granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update how we save and propagate filters

Browse source 
We save filterset in a local state, because the FilterBar will send it down to us from cookies.

We then set each individual property from that filter set.

We set inputs to have a placeholder, as max buttons and max turns could not be set (null). Then, we only send those fields when they have a value provided by the user.
This commit is contained in:
Justin Edmund 2023-03-20 10:10:33 -07:00
parent ef8401cb14
commit 87cbd00ac2
1 changed files with 15 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

37
components/FilterModal/index.tsx
View file

@ -26,6 +26,7 @@ import './index.scss'
interface Props extends DialogProps { interface Props extends DialogProps {
defaultFilterSet: FilterSet defaultFilterSet: FilterSet
filterSet: FilterSet filterSet: FilterSet
sendAdvancedFilters: (filters: FilterSet) => void
} }
const MAX_CHARACTERS = 5 const MAX_CHARACTERS = 5
@ -50,7 +51,7 @@ const FilterModal = (props: Props) => {
const [fullAutoOpen, setFullAutoOpen] = useState(false) const [fullAutoOpen, setFullAutoOpen] = useState(false)
const [autoGuardOpen, setAutoGuardOpen] = useState(false) const [autoGuardOpen, setAutoGuardOpen] = useState(false)
const [minCharacterCount, setMinCharacterCount] = useState(3) const [filterSet, setFilterSet] = useState<FilterSet>({})
const [minWeaponCount, setMinWeaponCount] = useState(5) const [minWeaponCount, setMinWeaponCount] = useState(5)
const [minSummonCount, setMinSummonCount] = useState(2) const [minSummonCount, setMinSummonCount] = useState(2)
@ -63,7 +64,6 @@ const FilterModal = (props: Props) => {
const [chargeAttack, setChargeAttack] = useState( const [chargeAttack, setChargeAttack] = useState(
props.defaultFilterSet.charge_attack props.defaultFilterSet.charge_attack
) )
const [minCharacterCount, setMinCharacterCount] = useState( const [minCharacterCount, setMinCharacterCount] = useState(
props.defaultFilterSet.characters_count props.defaultFilterSet.characters_count
) )
@ -125,30 +125,23 @@ const FilterModal = (props: Props) => {
} }
function saveFilters() { function saveFilters() {
const filters = { const filters: FilterSet = {}
full_auto: fullAuto, filters.full_auto = fullAuto
auto_guard: autoGuard, filters.auto_guard = autoGuard
charge_attack: chargeAttack, filters.charge_attack = chargeAttack
characters_count: minCharacterCount, filters.characters_count = minCharacterCount
weapons_count: minWeaponCount, filters.weapons_count = minWeaponCount
summons_count: minSummonCount, filters.summons_count = minSummonCount
button_count: maxButtonsCount, filters.name_quality = nameQuality
turn_count: maxTurnsCount, filters.user_quality = userQuality
name_quality: nameQuality, filters.original = originalOnly
user_quality: userQuality,
original: originalOnly,
}
console.log(filters) if (maxButtonsCount) filters.button_count = maxButtonsCount
function openSelect(name: 'charge_attack' | 'full_auto' | 'auto_guard') { if (maxTurnsCount) filters.turn_count = maxTurnsCount
setChargeAttackOpen(name === 'charge_attack' ? !chargeAttackOpen : false)
setFullAutoOpen(name === 'full_auto' ? !fullAutoOpen : false)
setAutoGuardOpen(name === 'auto_guard' ? !autoGuardOpen : false)
}
setCookie('filters', filters, { path: '/' }) setCookie('filters', filters, { path: '/' })
props.sendAdvancedFilters(filters) props.sendAdvancedFilters(filters)
// openChange() openChange()
} }
function resetFilters() { function resetFilters() {