From 2bf578fec9ff7b9687ec5a63be1867f0675f4215 Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Sat, 18 Mar 2023 06:49:42 -0700
Subject: [PATCH] Implemented SwitchTableField

---
 components/SwitchTableField/index.scss |  0
 components/SwitchTableField/index.tsx  | 47 ++++++++++++++++++++++++++
 2 files changed, 47 insertions(+)
 create mode 100644 components/SwitchTableField/index.scss
 create mode 100644 components/SwitchTableField/index.tsx

diff --git a/components/SwitchTableField/index.scss b/components/SwitchTableField/index.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/components/SwitchTableField/index.tsx b/components/SwitchTableField/index.tsx
new file mode 100644
index 00000000..02e69f2f
--- /dev/null
+++ b/components/SwitchTableField/index.tsx
@@ -0,0 +1,47 @@
+import { useEffect, useState } from 'react'
+import Switch from '~components/Switch'
+import TableField from '~components/TableField'
+
+import './index.scss'
+
+interface Props {
+  name: string
+  label: string
+  description?: string
+  value?: boolean
+  className?: string
+  imageAlt?: string
+  imageClass?: string
+  imageSrc?: string[]
+}
+
+const SwitchTableField = (props: Props) => {
+  const [value, setValue] = useState(false)
+
+  useEffect(() => {
+    if (props.value) setValue(props.value)
+  }, [props.value])
+
+  function onValueChange(value: boolean) {
+    setValue(value)
+  }
+
+  return (
+    <TableField
+      name={props.name}
+      className="SwitchField"
+      imageAlt={props.imageAlt}
+      imageClass={props.imageClass}
+      imageSrc={props.imageSrc}
+      label={props.label}
+    >
+      <Switch
+        name={props.name}
+        checked={value}
+        onCheckedChange={onValueChange}
+      />
+    </TableField>
+  )
+}
+
+export default SwitchTableField