UI: Fix double-loading of API data on pages with slow rendering (#17357)

Without `staleTime: Infinity`, the query data would be immediately marked
stale, and in combination with the `gcTime: 0` setting and a brief unmount
during data loading (via Suspense), the data would have to be reloaded a second
time during/after the first real render.

`gcTime: 0` + `staleTime: Infinity` should give us the desired behavior where
data loaded for a page should be valid forever as long as that page is being
displayed, but always thrown away (and later reloaded) whenever we navigate
away and again to that page.

Signed-off-by: Julius Volz <julius.volz@gmail.com>
This commit is contained in:
Julius Volz 2025-10-17 17:17:48 +02:00 committed by GitHub
parent a3e404755b
commit 09e7111aa7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -125,6 +125,7 @@ export const useSuspenseAPIQuery = <T>({ key, path, params }: QueryOptions) => {
queryKey: key !== undefined ? key : [path, params],
retry: false,
refetchOnWindowFocus: false,
staleTime: Infinity, // Required for suspense queries since the component is briefly unmounted when loading the data, which together with a gcTime of 0 will cause the data to be garbage collected before it can be used.
gcTime: 0,
queryFn: createQueryFn({ pathPrefix, path, params }),
});