scott/crabfit
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Cache and suspend stats until loaded

Browse source
This commit is contained in:
Benji Grant 2023-06-18 12:14:13 +10:00
parent 189538d1dc
commit 744c97c1d5
2 changed files with 8 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
frontend/src/app/page.tsx
View file

@ -1,3 +1,4 @@
import { Suspense } from 'react'
import { Trans } from 'react-i18next/TransWithoutContext' import { Trans } from 'react-i18next/TransWithoutContext'
import Link from 'next/link' import Link from 'next/link'
@ -31,7 +32,9 @@ const Page = async () => {
<Content> <Content>
<h2>{t('about.name')}</h2> <h2>{t('about.name')}</h2>
<Stats /> <Suspense>
<Stats />
</Suspense>
<P><Trans i18nKey="about.content.p1" t={t} i18n={i18n}>_<br /><Link href="/how-to" rel="help">_</Link>_</Trans></P> <P><Trans i18nKey="about.content.p1" t={t} i18n={i18n}>_<br /><Link href="/how-to" rel="help">_</Link>_</Trans></P>

7
frontend/src/config/api.ts
View file

@ -43,11 +43,12 @@ export const StatsResponse = z.object({
}) })
export type StatsResponse = z.infer<typeof StatsResponse> export type StatsResponse = z.infer<typeof StatsResponse>
const get = async <S extends z.Schema>(url: string, schema: S, auth?: string): Promise<ReturnType<S['parse']>> => { const get = async <S extends z.Schema>(url: string, schema: S, auth?: string, nextOptions?: NextFetchRequestConfig): Promise<ReturnType<S['parse']>> => {
const res = await fetch(new URL(url, API_BASE), { const res = await fetch(new URL(url, API_BASE), {
headers: { headers: {
...auth && { Authorization: `Bearer ${auth}` }, ...auth && { Authorization: `Bearer ${auth}` },
} },
next: nextOptions,
}) })
.catch(console.warn) .catch(console.warn)
if (!res?.ok) throw res if (!res?.ok) throw res
@ -69,7 +70,7 @@ const post = async <S extends z.Schema>(url: string, schema: S, input: unknown,
} }
// Get // Get
export const getStats = () => get('/stats', StatsResponse) export const getStats = () => get('/stats', StatsResponse, undefined, { revalidate: 60 })
export const getEvent = (eventId: string) => get(`/event/${eventId}`, EventResponse) export const getEvent = (eventId: string) => get(`/event/${eventId}`, EventResponse)
export const getPeople = (eventId: string) => get(`/event/${eventId}/people`, PersonResponse.array()) export const getPeople = (eventId: string) => get(`/event/${eventId}/people`, PersonResponse.array())
export const getPerson = (eventId: string, personName: string, password?: string) => get(`/event/${eventId}/people/${personName}`, PersonResponse, password && btoa(password)) export const getPerson = (eventId: string, personName: string, password?: string) => get(`/event/${eventId}/people/${personName}`, PersonResponse, password && btoa(password))