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

Fix useEffect looping in RaidDropdown

Browse source
This commit is contained in:
Justin Edmund 2022-02-28 11:57:02 -08:00
parent ad1472dfbb
commit 13ddd2131a
1 changed files with 22 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

55
components/RaidDropdown/index.tsx
View file

@ -1,4 +1,4 @@
import React, { useEffect, useState } from 'react' import React, { useCallback, useEffect, useState } from 'react'
import { useCookies } from 'react-cookie' import { useCookies } from 'react-cookie'
import { appState } from '~utils/appState' import { appState } from '~utils/appState'
@ -15,47 +15,36 @@ interface Props {
} }
const RaidDropdown = React.forwardRef<HTMLSelectElement, Props>(function useFieldSet(props, ref) { const RaidDropdown = React.forwardRef<HTMLSelectElement, Props>(function useFieldSet(props, ref) {
const [cookies, _] = useCookies(['user']) const [cookies] = useCookies(['user'])
const headers = (cookies.user != null) ? {
headers: { 'Authorization': `Bearer ${cookies.user.access_token}` }
} : {}
const [raids, setRaids] = useState<Raid[][]>() const [raids, setRaids] = useState<Raid[][]>()
const [flatRaids, setFlatRaids] = useState<Raid[]>() const [flatRaids, setFlatRaids] = useState<Raid[]>()
const raidGroups = [ const raidGroups = [
'Assorted', 'Assorted', 'Omega', 'T1 Summons', 'T2 Summons',
'Omega', 'Primarchs', 'Nightmare', 'Omega (Impossible)', 'Omega II',
'T1 Summons', 'Tier 1 Summons (Impossible)', 'Tier 3 Summons', 'Ennead', 'Malice',
'T2 Summons', '6-Star Raids', 'Six-Dragons', 'Nightmare (Impossible)', 'Astral',
'Primarchs',
'Nightmare',
'Omega (Impossible)',
'Omega II',
'Tier 1 Summons (Impossible)',
'Tier 3 Summons',
'Ennead',
'Malice',
'6-Star Raids',
'Six-Dragons',
'Nightmare (Impossible)',
'Astral',
'Super Ultimate' 'Super Ultimate'
] ]
useEffect(() => { useEffect(() => {
const headers = (cookies.user != null) ? {
headers: { 'Authorization': `Bearer ${cookies.user.access_token}` }
} : {}
function fetchRaids() {
console.log("Fetching list of raids...")
api.endpoints.raids.getAll(headers)
.then((response) => {
const raids = response.data.map((r: any) => r.raid)
appState.raids = raids
organizeRaids(raids)
})
}
fetchRaids() fetchRaids()
}, [fetchRaids]) }, [])
function fetchRaids() {
api.endpoints.raids.getAll(headers)
.then((response) => {
const raids = response.data.map((r: any) => r.raid)
appState.raids = raids
organizeRaids(raids)
})
}
function organizeRaids(raids: Raid[]) { function organizeRaids(raids: Raid[]) {
const numGroups = Math.max.apply(Math, raids.map(raid => raid.group)) const numGroups = Math.max.apply(Math, raids.map(raid => raid.group))