Merge pull request #11765 from Hallidayo/studio-enum-select

fix: studio editor enum

studio/components/grid/components/editor/SelectEditor.tsx

@@ -1,10 +1,10 @@
-import { Listbox } from '@supabase/ui'
+import { Select } from 'ui'
 import { EditorProps } from '@supabase/react-data-grid'
 
 import { useTrackedState } from 'components/grid/store'
 
 interface SelectEditorProps<TRow, TSummaryRow = unknown> extends EditorProps<TRow, TSummaryRow> {
-  options: { label: string; value: string }[]
+  options: { label: string; _value: string }[]
 }
 
 export function SelectEditor<TRow, TSummaryRow = unknown>({
@@ -19,11 +19,12 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
 
   const value = row[column.key as keyof TRow] as unknown as string
 
-  function onChange(value: string) {
-    if (!value || value == '') {
+  function onChange(event: any) {
+    debugger
+    if (!event.target.value || event.target.value == '') {
       onRowChange({ ...row, [column.key]: null }, true)
     } else {
-      onRowChange({ ...row, [column.key]: value }, true)
+      onRowChange({ ...row, [column.key]: event.target.value }, true)
     }
   }
 
@@ -32,7 +33,7 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
   }
 
   return (
-    <Listbox
+    <Select
       autoFocus
       id="select-editor"
       name="select-editor"
@@ -44,14 +45,12 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
       onChange={onChange}
       onBlur={onBlur}
     >
-      <Listbox.Option id="NULL" label="NULL" value="">
-        NULL
-      </Listbox.Option>
-      {options.map(({ label, value }) => (
-        <Listbox.Option key={value} label={label} value={value}>
+      <Select.Option value="">NULL</Select.Option>
+      {options.map(({ label, _value }) => (
+        <Select.Option key={_value} value={_value} selected={_value === value}>
           {label}
-        </Listbox.Option>
+        </Select.Option>
       ))}
-    </Listbox>
+    </Select>
   )
 }