pierrejeambrun commented on code in PR #63895:
URL: https://github.com/apache/airflow/pull/63895#discussion_r2965094079
##########
airflow-core/src/airflow/ui/src/components/FlexibleForm/FieldDropdown.tsx:
##########
@@ -39,75 +37,65 @@ const labelLookup = (
return key === null ? "null" : String(key);
};
+
const enumTypes = ["string", "number", "integer"];
+type Option = {
+ label: string;
+ value: string;
+};
+
Review Comment:
I believe you can omit that.
##########
airflow-core/src/airflow/ui/src/components/FlexibleForm/FieldDropdown.tsx:
##########
@@ -39,75 +37,65 @@ const labelLookup = (
return key === null ? "null" : String(key);
};
+
const enumTypes = ["string", "number", "integer"];
+type Option = {
+ label: string;
+ value: string;
+};
+
export const FieldDropdown = ({ name, namespace = "default", onUpdate }:
FlexibleFormElementProps) => {
const { t: translate } = useTranslation("components");
const { disabled, paramsDict, setParamsDict } = useParamStore(namespace);
const param = paramsDict[name] ?? paramPlaceholder;
- const selectOptions = createListCollection({
- items:
- param.schema.enum?.map((value) => {
- // Convert null to string constant for zag-js compatibility
- const stringValue = String(value ?? NULL_STRING_VALUE);
+ const options: Array<Option> =
+ param.schema.enum?.map((value) => ({
+ label: labelLookup(value, param.schema.values_display),
+ value: String(value ?? NULL_STRING_VALUE),
+ })) ?? [];
- return {
- label: labelLookup(value, param.schema.values_display),
- value: stringValue,
- };
- }) ?? [],
- });
+ const currentValue =
+ // eslint-disable-next-line unicorn/no-null
+ param.value === null
+ ? options.find((opt) => opt.value === NULL_STRING_VALUE) ?? null
+ : enumTypes.includes(typeof param.value)
+ ? options.find((opt) => opt.value === String(param.value)) ?? null
+ : // eslint-disable-next-line unicorn/no-null
+ null;
- const contentRef = useRef<HTMLDivElement | null>(null);
-
- const handleChange = ([value]: Array<string>) => {
+ const handleChange = (selected: SingleValue<Option>) => {
if (paramsDict[name]) {
- if (value === NULL_STRING_VALUE || value === undefined) {
+ if (!selected || selected.value === NULL_STRING_VALUE) {
// eslint-disable-next-line unicorn/no-null
paramsDict[name].value = null;
} else {
// Map the string value back to the original typed enum value (e.g.
number, string)
// so that backend validation receives the correct type.
const originalValue = param.schema.enum?.find(
- (enumVal) => String(enumVal ?? NULL_STRING_VALUE) === value,
+ (enumVal) => String(enumVal ?? NULL_STRING_VALUE) === selected.value,
);
- paramsDict[name].value = originalValue ?? value;
+ paramsDict[name].value = originalValue ?? selected.value;
}
}
setParamsDict(paramsDict);
- onUpdate(value);
+ onUpdate(selected?.value ?? "");
};
return (
- <Select.Root
- collection={selectOptions}
- disabled={disabled}
+ <ReactSelect<Option>
Review Comment:
And that.
```suggestion
<ReactSelect
```
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
