From 8cc5f19d9e948a6b8747880faaa00dd45eb1895f Mon Sep 17 00:00:00 2001
From: Ollie Halliday <22655069+Hallidayo@users.noreply.github.com>
Date: Thu, 19 Jan 2023 16:18:01 +0000
Subject: [PATCH 1/5] changed to use Select instead of ListBox

---
 .../grid/components/editor/SelectEditor.tsx    | 18 ++++++++----------
 1 file changed, 8 insertions(+), 10 deletions(-)

diff --git a/studio/components/grid/components/editor/SelectEditor.tsx b/studio/components/grid/components/editor/SelectEditor.tsx
index f980583fad0..206417e5901 100644
--- a/studio/components/grid/components/editor/SelectEditor.tsx
+++ b/studio/components/grid/components/editor/SelectEditor.tsx
@@ -1,4 +1,4 @@
-import { Listbox } from '@supabase/ui'
+import { Select } from '@supabase/ui'
 import { EditorProps } from '@supabase/react-data-grid'
 
 import { useTrackedState } from 'components/grid/store'
@@ -19,11 +19,11 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
 
   const value = row[column.key as keyof TRow] as unknown as string
 
-  function onChange(value: string) {
+  function onChange(value: any) {
     if (!value || value == '') {
       onRowChange({ ...row, [column.key]: null }, true)
     } else {
-      onRowChange({ ...row, [column.key]: value }, true)
+      onRowChange({ ...row, [column.key]: value.target.value }, true)
     }
   }
 
@@ -32,7 +32,7 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
   }
 
   return (
-    <Listbox
+    <Select
       autoFocus
       id="select-editor"
       name="select-editor"
@@ -44,14 +44,12 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
       onChange={onChange}
       onBlur={onBlur}
     >
-      <Listbox.Option id="NULL" label="NULL" value="">
-        NULL
-      </Listbox.Option>
+      <Select.Option value="">NULL</Select.Option>
       {options.map(({ label, value }) => (
-        <Listbox.Option key={value} label={label} value={value}>
+        <Select.Option key={value} value={value}>
           {label}
-        </Listbox.Option>
+        </Select.Option>
       ))}
-    </Listbox>
+    </Select>
   )
 }

From 30dd26e816f0db8a9fead7501a461d331f217c76 Mon Sep 17 00:00:00 2001
From: Ollie Halliday <22655069+Hallidayo@users.noreply.github.com>
Date: Fri, 20 Jan 2023 12:07:57 +0000
Subject: [PATCH 2/5] changed to ui package and added selected param

---
 studio/components/grid/components/editor/SelectEditor.tsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/studio/components/grid/components/editor/SelectEditor.tsx b/studio/components/grid/components/editor/SelectEditor.tsx
index 206417e5901..6a0410470d2 100644
--- a/studio/components/grid/components/editor/SelectEditor.tsx
+++ b/studio/components/grid/components/editor/SelectEditor.tsx
@@ -1,10 +1,10 @@
-import { Select } 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>({
@@ -45,8 +45,8 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
       onBlur={onBlur}
     >
       <Select.Option value="">NULL</Select.Option>
-      {options.map(({ label, value }) => (
-        <Select.Option key={value} value={value}>
+      {options.map(({ label, _value }) => (
+        <Select.Option key={_value} value={_value} selected={_value === value}>
           {label}
         </Select.Option>
       ))}

From e83c3bff83ee73c587c014248a8bcdb08ac111d1 Mon Sep 17 00:00:00 2001
From: Ollie Halliday <22655069+Hallidayo@users.noreply.github.com>
Date: Mon, 23 Jan 2023 15:54:18 +0000
Subject: [PATCH 3/5] renamed paramter to event

---
 studio/components/grid/components/editor/SelectEditor.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/studio/components/grid/components/editor/SelectEditor.tsx b/studio/components/grid/components/editor/SelectEditor.tsx
index 6a0410470d2..ce9ed3e32d0 100644
--- a/studio/components/grid/components/editor/SelectEditor.tsx
+++ b/studio/components/grid/components/editor/SelectEditor.tsx
@@ -19,11 +19,11 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
 
   const value = row[column.key as keyof TRow] as unknown as string
 
-  function onChange(value: any) {
-    if (!value || value == '') {
+  function onChange(event: any) {
+    if (!event || event == '') {
       onRowChange({ ...row, [column.key]: null }, true)
     } else {
-      onRowChange({ ...row, [column.key]: value.target.value }, true)
+      onRowChange({ ...row, [column.key]: event.target.value }, true)
     }
   }
 

From 7e342941d0ec014378c7de64852d114ad555a4d2 Mon Sep 17 00:00:00 2001
From: Ollie Halliday <22655069+Hallidayo@users.noreply.github.com>
Date: Mon, 23 Jan 2023 15:59:18 +0000
Subject: [PATCH 4/5] issue when changing to NULL fixed

---
 studio/components/grid/components/editor/SelectEditor.tsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/studio/components/grid/components/editor/SelectEditor.tsx b/studio/components/grid/components/editor/SelectEditor.tsx
index ce9ed3e32d0..d23964f978f 100644
--- a/studio/components/grid/components/editor/SelectEditor.tsx
+++ b/studio/components/grid/components/editor/SelectEditor.tsx
@@ -20,7 +20,8 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
   const value = row[column.key as keyof TRow] as unknown as string
 
   function onChange(event: any) {
-    if (!event || event == '') {
+    debugger
+    if (!event.target.vaue || event.target.value == '') {
       onRowChange({ ...row, [column.key]: null }, true)
     } else {
       onRowChange({ ...row, [column.key]: event.target.value }, true)

From 2d5d65c9c6223f88300fdb83bc50fb78dde22c3f Mon Sep 17 00:00:00 2001
From: Ollie Halliday <22655069+Hallidayo@users.noreply.github.com>
Date: Tue, 24 Jan 2023 12:19:45 +0000
Subject: [PATCH 5/5] fixed typo

---
 studio/components/grid/components/editor/SelectEditor.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/studio/components/grid/components/editor/SelectEditor.tsx b/studio/components/grid/components/editor/SelectEditor.tsx
index d23964f978f..9c65b367e11 100644
--- a/studio/components/grid/components/editor/SelectEditor.tsx
+++ b/studio/components/grid/components/editor/SelectEditor.tsx
@@ -21,7 +21,7 @@ export function SelectEditor<TRow, TSummaryRow = unknown>({
 
   function onChange(event: any) {
     debugger
-    if (!event.target.vaue || event.target.value == '') {
+    if (!event.target.value || event.target.value == '') {
       onRowChange({ ...row, [column.key]: null }, true)
     } else {
       onRowChange({ ...row, [column.key]: event.target.value }, true)