Cleanup timeout handling

This commit is contained in:
Zoe Roux 2024-01-30 16:41:30 +01:00
parent 92a3c2945c
commit ecc2b70e43
2 changed files with 11 additions and 10 deletions

View File

@ -99,12 +99,19 @@ export const AccountProvider = ({
// update user's data from kyoo un startup, it could have changed. // update user's data from kyoo un startup, it could have changed.
const selected = useMemo(() => accounts.find((x) => x.selected), [accounts]); const selected = useMemo(() => accounts.find((x) => x.selected), [accounts]);
const controller = useMemo(() => {
const ret = new AbortController();
setTimeout(() => ret.abort(), 5_000);
return ret;
}, [selected]);
const user = useFetch({ const user = useFetch({
path: ["auth", "me"], path: ["auth", "me"],
parser: UserP, parser: UserP,
placeholderData: selected as User, placeholderData: selected as User,
enabled: !!selected, enabled: !!selected,
timeout: 5_000, options: {
signal: controller.signal,
},
}); });
useEffect(() => { useEffect(() => {
if (!selected || !user.isSuccess || user.isPlaceholderData) return; if (!selected || !user.isSuccess || user.isPlaceholderData) return;

View File

@ -22,7 +22,6 @@ import { ComponentType, ReactElement } from "react";
import { import {
dehydrate, dehydrate,
QueryClient, QueryClient,
QueryFunction,
QueryFunctionContext, QueryFunctionContext,
useInfiniteQuery, useInfiniteQuery,
useQuery, useQuery,
@ -41,7 +40,6 @@ export let kyooApiUrl = kyooUrl;
export const queryFn = async <Data,>( export const queryFn = async <Data,>(
context: { context: {
timeout?: number;
apiUrl?: string; apiUrl?: string;
authenticated?: boolean; authenticated?: boolean;
method?: "GET" | "POST" | "PUT" | "PATCH" | "DELETE"; method?: "GET" | "POST" | "PUT" | "PATCH" | "DELETE";
@ -72,9 +70,6 @@ export const queryFn = async <Data,>(
.replace("/?", "?"); .replace("/?", "?");
let resp; let resp;
try { try {
const controller = context.timeout !== undefined ? new AbortController() : undefined;
if (controller) setTimeout(() => controller.abort(), context.timeout);
resp = await fetch(path, { resp = await fetch(path, {
method: context.method, method: context.method,
body: "body" in context && context.body ? JSON.stringify(context.body) : undefined, body: "body" in context && context.body ? JSON.stringify(context.body) : undefined,
@ -82,7 +77,7 @@ export const queryFn = async <Data,>(
...(token ? { Authorization: token } : {}), ...(token ? { Authorization: token } : {}),
...("body" in context ? { "Content-Type": "application/json" } : {}), ...("body" in context ? { "Content-Type": "application/json" } : {}),
}, },
signal: controller?.signal ?? context.signal, signal: context.signal,
}); });
} catch (e) { } catch (e) {
if (typeof e === "object" && e && "name" in e && e.name === "AbortError") if (typeof e === "object" && e && "name" in e && e.name === "AbortError")
@ -173,7 +168,6 @@ export type QueryIdentifier<T = unknown, Ret = T> = {
placeholderData?: T | (() => T); placeholderData?: T | (() => T);
enabled?: boolean; enabled?: boolean;
timeout?: number;
options?: Partial<Parameters<typeof queryFn>[0]>; options?: Partial<Parameters<typeof queryFn>[0]>;
}; };
@ -208,7 +202,7 @@ export const toQueryKey = (query: {
export const useFetch = <Data,>(query: QueryIdentifier<Data>) => { export const useFetch = <Data,>(query: QueryIdentifier<Data>) => {
return useQuery<Data, KyooErrors>({ return useQuery<Data, KyooErrors>({
queryKey: toQueryKey(query), queryKey: toQueryKey(query),
queryFn: (ctx) => queryFn({ ...ctx, timeout: query.timeout, ...query.options }, query.parser), queryFn: (ctx) => queryFn({ ...ctx, ...query.options }, query.parser),
placeholderData: query.placeholderData as any, placeholderData: query.placeholderData as any,
enabled: query.enabled, enabled: query.enabled,
}); });
@ -217,7 +211,7 @@ export const useFetch = <Data,>(query: QueryIdentifier<Data>) => {
export const useInfiniteFetch = <Data, Ret>(query: QueryIdentifier<Data, Ret>) => { export const useInfiniteFetch = <Data, Ret>(query: QueryIdentifier<Data, Ret>) => {
const ret = useInfiniteQuery<Page<Data>, KyooErrors>({ const ret = useInfiniteQuery<Page<Data>, KyooErrors>({
queryKey: toQueryKey(query), queryKey: toQueryKey(query),
queryFn: (ctx) => queryFn({ ...ctx, timeout: query.timeout }, Paged(query.parser)), queryFn: (ctx) => queryFn({ ...ctx, ...query.options }, Paged(query.parser)),
getNextPageParam: (page: Page<Data>) => page?.next || undefined, getNextPageParam: (page: Page<Data>) => page?.next || undefined,
initialPageParam: undefined, initialPageParam: undefined,
placeholderData: query.placeholderData as any, placeholderData: query.placeholderData as any,