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

Update useQueryState to use history and shallow routing

Browse source
This commit is contained in:
Justin Edmund 2022-12-22 21:32:57 -08:00
parent 908e807f00
commit 9de459b958
3 changed files with 36 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
pages/[username].tsx
View file

@ -63,16 +63,20 @@ const ProfileRoute: React.FC<Props> = (props: Props) => {
// Recency is in seconds
const [element, setElement] = useQueryState('element', {
defaultValue: -1,
history: 'push',
parse: (query: string) => parseElement(query),
serialize: (value) => serializeElement(value),
})
const [raidSlug, setRaidSlug] = useQueryState('raid', {
defaultValue: 'all',
history: 'push',
})
const [recency, setRecency] = useQueryState('recency', {
defaultValue: -1,
history: 'push',
parse: (query: string) => parseInt(query),
serialize: (value) => `${value}`,
})
const [recency, setRecency] = useQueryState(
'recency',
queryTypes.integer.withDefault(-1)
)
// Define transformers for element
function parseElement(query: string) {
@ -203,16 +207,16 @@ const ProfileRoute: React.FC<Props> = (props: Props) => {
raidSlug?: string
recency?: number
}) {
if (element == 0) setElement(0)
else if (element) setElement(element)
if (element == 0) setElement(0, { shallow: true })
else if (element) setElement(element, { shallow: true })
if (raids && raidSlug) {
const raid = raids.find((raid) => raid.slug === raidSlug)
setRaid(raid)
setRaidSlug(raidSlug)
setRaidSlug(raidSlug, { shallow: true })
}
if (recency) setRecency(recency)
if (recency) setRecency(recency, { shallow: true })
}
// Methods: Navigation

20
pages/saved.tsx
View file

@ -62,16 +62,20 @@ const SavedRoute: React.FC<Props> = (props: Props) => {
// Recency is in seconds
const [element, setElement] = useQueryState('element', {
defaultValue: -1,
history: 'push',
parse: (query: string) => parseElement(query),
serialize: (value) => serializeElement(value),
})
const [raidSlug, setRaidSlug] = useQueryState('raid', {
defaultValue: 'all',
history: 'push',
})
const [recency, setRecency] = useQueryState('recency', {
defaultValue: -1,
history: 'push',
parse: (query: string) => parseInt(query),
serialize: (value) => `${value}`,
})
const [recency, setRecency] = useQueryState(
'recency',
queryTypes.integer.withDefault(-1)
)
// Define transformers for element
function parseElement(query: string) {
@ -196,16 +200,16 @@ const SavedRoute: React.FC<Props> = (props: Props) => {
raidSlug?: string
recency?: number
}) {
if (element == 0) setElement(0)
else if (element) setElement(element)
if (element == 0) setElement(0, { shallow: true })
else if (element) setElement(element, { shallow: true })
if (raids && raidSlug) {
const raid = raids.find((raid) => raid.slug === raidSlug)
setRaid(raid)
setRaidSlug(raidSlug)
setRaidSlug(raidSlug, { shallow: true })
}
if (recency) setRecency(recency)
if (recency) setRecency(recency, { shallow: true })
}
// Methods: Favorites

20
pages/teams.tsx
View file

@ -61,16 +61,20 @@ const TeamsRoute: React.FC<Props> = (props: Props) => {
// Recency is in seconds
const [element, setElement] = useQueryState('element', {
defaultValue: -1,
history: 'push',
parse: (query: string) => parseElement(query),
serialize: (value) => serializeElement(value),
})
const [raidSlug, setRaidSlug] = useQueryState('raid', {
defaultValue: 'all',
history: 'push',
})
const [recency, setRecency] = useQueryState('recency', {
defaultValue: -1,
history: 'push',
parse: (query: string) => parseInt(query),
serialize: (value) => `${value}`,
})
const [recency, setRecency] = useQueryState(
'recency',
queryTypes.integer.withDefault(-1)
)
// Define transformers for element
function parseElement(query: string) {
@ -195,16 +199,16 @@ const TeamsRoute: React.FC<Props> = (props: Props) => {
raidSlug?: string
recency?: number
}) {
if (element == 0) setElement(0)
else if (element) setElement(element)
if (element == 0) setElement(0, { shallow: true })
else if (element) setElement(element, { shallow: true })
if (raids && raidSlug) {
const raid = raids.find((raid) => raid.slug === raidSlug)
setRaid(raid)
setRaidSlug(raidSlug)
setRaidSlug(raidSlug, { shallow: true })
}
if (recency) setRecency(recency)
if (recency) setRecency(recency, { shallow: true })
}
// Methods: Favorites