From d9166580720351124dee165d47f51719f369a89f Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Sat, 18 Mar 2023 13:54:17 -0700
Subject: [PATCH] Update TableFields to not error

Also optional value is required
---
 components/InputTableField/index.tsx  | 2 +-
 components/SliderTableField/index.tsx | 4 ++--
 components/SwitchTableField/index.tsx | 6 +++---
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/components/InputTableField/index.tsx b/components/InputTableField/index.tsx
index c7a254cb..47ba15b9 100644
--- a/components/InputTableField/index.tsx
+++ b/components/InputTableField/index.tsx
@@ -9,7 +9,7 @@ interface Props {
   label: string
   description?: string
   placeholder?: string
-  value: number
+  value?: number
   className?: string
   imageAlt?: string
   imageClass?: string
diff --git a/components/SliderTableField/index.tsx b/components/SliderTableField/index.tsx
index abfe428c..d26dd3c5 100644
--- a/components/SliderTableField/index.tsx
+++ b/components/SliderTableField/index.tsx
@@ -9,7 +9,7 @@ interface Props {
   name: string
   label: string
   description?: string
-  value: number
+  value?: number
   className?: string
   imageAlt?: string
   imageClass?: string
@@ -29,7 +29,7 @@ const SliderTableField = (props: Props) => {
   }, [props.value])
 
   useEffect(() => {
-    if (value !== props.value) props.onValueChange(value)
+    if (value !== undefined && value !== props.value) props.onValueChange(value)
   }, [value])
 
   function handleValueCommit(value: number[]) {
diff --git a/components/SwitchTableField/index.tsx b/components/SwitchTableField/index.tsx
index e2e2e2bd..0861526b 100644
--- a/components/SwitchTableField/index.tsx
+++ b/components/SwitchTableField/index.tsx
@@ -8,7 +8,7 @@ interface Props {
   name: string
   label: string
   description?: string
-  value: boolean
+  value?: boolean
   className?: string
   imageAlt?: string
   imageClass?: string
@@ -17,14 +17,14 @@ interface Props {
 }
 
 const SwitchTableField = (props: Props) => {
-  const [value, setValue] = useState(false)
+  const [value, setValue] = useState(props.value)
 
   useEffect(() => {
     if (value !== props.value) setValue(props.value)
   }, [props.value])
 
   useEffect(() => {
-    props.onValueChange(value)
+    if (value !== undefined) props.onValueChange(value)
   }, [value])
 
   function onValueChange(value: boolean) {