Implementing union enum when mutlifields are all enums

gui/app/src/common/crud/widgets/union-enum.tsx

@@ -0,0 +1,40 @@
+import {FieldProps, WidgetProps} from "@rjsf/utils";
+import AnyOfField from "@rjsf/core/lib/components/fields/MultiSchemaField";
+import {ListSubheader, MenuItem, Select} from "@mui/material";
+import {useState} from "react";
+import Autocomplete from "@mui/material/Autocomplete";
+import TextField from "@mui/material/TextField";
+
+export const UnionEnumWidget = (props: WidgetProps) => {
+  const {
+    options,
+    value,
+  } = props;
+  const [selectedValue, setSelectedValue] = useState(null);
+
+
+  if (! selectedValue && value && options.enumOptions) {
+    for (const opt of options.enumOptions){
+       if (opt.value == value) {
+         setSelectedValue(opt);
+         break;
+       }
+    }
+  }
+
+  return (
+    <Autocomplete
+      value={selectedValue}
+      onChange={(event, newValue) => {
+          setSelectedValue(newValue);
+          props.onChange(newValue.value);
+      }}
+      options={options.enumOptions}
+      groupBy={(option) => option.type}
+      getOptionLabel={(option) => option.title}
+      renderInput={(params) => (
+          <TextField {...params} label={ props.label } variant="outlined" />
+      )}
+    />
+  );
+}