From 401506dcf8db84a7160d3c14d4e7a089c97dcaf5 Mon Sep 17 00:00:00 2001
From: Justin Edmund <justin@jedmund.com>
Date: Mon, 20 Mar 2023 10:07:35 -0700
Subject: [PATCH] Swap to using selects for some boolean fields

Charge Attack, Full Auto, and Auto Guard are not boolean values since the user can select (and the default should be) to show both on and off values. We swap to using a SelectTableField here to represent this difference.

We also added logic for Full Auto and Auto Guard fields since they are tied together in some cases (you can't show Auto Guard teams that have Full Auto disabled)
---
 components/FilterModal/index.tsx | 49 +++++++++++++++++---------------
 1 file changed, 26 insertions(+), 23 deletions(-)

diff --git a/components/FilterModal/index.tsx b/components/FilterModal/index.tsx
index 4e5dfcb6..a4644aa5 100644
--- a/components/FilterModal/index.tsx
+++ b/components/FilterModal/index.tsx
@@ -46,10 +46,9 @@ const FilterModal = (props: Props) => {
 
   // States
   const [open, setOpen] = useState(false)
-
-  const [fullAuto, setFullAuto] = useState(props.filterSet.full_auto)
-  const [autoGuard, setAutoGuard] = useState(props.filterSet.auto_guard)
-  const [chargeAttack, setChargeAttack] = useState(DEFAULT_CHARGE_ATTACK)
+  const [chargeAttackOpen, setChargeAttackOpen] = useState(false)
+  const [fullAutoOpen, setFullAutoOpen] = useState(false)
+  const [autoGuardOpen, setAutoGuardOpen] = useState(false)
 
   const [minCharacterCount, setMinCharacterCount] = useState(3)
   const [minWeaponCount, setMinWeaponCount] = useState(5)
@@ -140,7 +139,11 @@ const FilterModal = (props: Props) => {
     }
 
     console.log(filters)
-    if (maxTurnsCount) filters.turn_count = maxTurnsCount
+  function openSelect(name: 'charge_attack' | 'full_auto' | 'auto_guard') {
+    setChargeAttackOpen(name === 'charge_attack' ? !chargeAttackOpen : false)
+    setFullAutoOpen(name === 'full_auto' ? !fullAutoOpen : false)
+    setAutoGuardOpen(name === 'auto_guard' ? !autoGuardOpen : false)
+  }
 
     setCookie('filters', filters, { path: '/' })
     props.sendAdvancedFilters(filters)
@@ -181,19 +184,19 @@ const FilterModal = (props: Props) => {
   }
 
   // Value listeners
-  function handleChargeAttackValueChange(value: boolean) {
-    setChargeAttack(value)
+  function handleChargeAttackValueChange(value: string) {
+    setChargeAttack(parseInt(value))
   }
 
-  function handleFullAutoValueChange(value: boolean) {
-    setFullAuto(value)
+  function handleFullAutoValueChange(value: string) {
+    const newValue = parseInt(value)
     setFullAuto(newValue)
     if (newValue === 0 || (newValue === -1 && autoGuard === 1))
       setAutoGuard(newValue)
   }
 
-  function handleAutoGuardValueChange(value: boolean) {
-    setAutoGuard(value)
+  function handleAutoGuardValueChange(value: string) {
+    const newValue = parseInt(value)
     setAutoGuard(newValue)
     if (newValue === 1 || (newValue === -1 && fullAuto === 0))
       setFullAuto(newValue)
@@ -273,14 +276,14 @@ const FilterModal = (props: Props) => {
 
   // Selects
   const fullAutoField = () => (
-    <SwitchTableField
+    <SelectTableField
       name="full_auto"
       label={t('modals.filters.labels.full_auto')}
       open={fullAutoOpen}
-      value={fullAuto}
+      value={`${fullAuto}`}
       onOpenChange={() => openSelect('full_auto')}
       onClose={() => setFullAutoOpen(false)}
-      onValueChange={handleFullAutoValueChange}
+      onChange={handleFullAutoValueChange}
     >
       <SelectItem key="on-off" value="-1">
         {t('modals.filters.options.on_and_off')}
@@ -291,18 +294,18 @@ const FilterModal = (props: Props) => {
       <SelectItem key="off" value="0">
         {t('modals.filters.options.off')}
       </SelectItem>
-    />
+    </SelectTableField>
   )
 
   const autoGuardField = () => (
-    <SwitchTableField
+    <SelectTableField
       name="auto_guard"
       label={t('modals.filters.labels.auto_guard')}
       open={autoGuardOpen}
-      value={autoGuard}
+      value={`${autoGuard}`}
       onOpenChange={() => openSelect('auto_guard')}
       onClose={() => setAutoGuardOpen(false)}
-      onValueChange={handleAutoGuardValueChange}
+      onChange={handleAutoGuardValueChange}
     >
       <SelectItem key="on-off" value="-1">
         {t('modals.filters.options.on_and_off')}
@@ -313,18 +316,18 @@ const FilterModal = (props: Props) => {
       <SelectItem key="off" value="0">
         {t('modals.filters.options.off')}
       </SelectItem>
-    />
+    </SelectTableField>
   )
 
   const chargeAttackField = () => (
-    <SwitchTableField
+    <SelectTableField
       name="charge_attack"
       label={t('modals.filters.labels.charge_attack')}
       open={chargeAttackOpen}
-      value={chargeAttack}
+      value={`${chargeAttack}`}
       onOpenChange={() => openSelect('charge_attack')}
       onClose={() => setChargeAttackOpen(false)}
-      onValueChange={handleChargeAttackValueChange}
+      onChange={handleChargeAttackValueChange}
     >
       <SelectItem key="on-off" value="-1">
         {t('modals.filters.options.on_and_off')}
@@ -335,7 +338,7 @@ const FilterModal = (props: Props) => {
       <SelectItem key="off" value="0">
         {t('modals.filters.options.off')}
       </SelectItem>
-    />
+    </SelectTableField>
   )
 
   // Switches