-
-
Notifications
You must be signed in to change notification settings - Fork 3.6k
Closed
Labels
Description
QueryClient.prefetchQuery is unfortunately not generic, meaning that we have to use a type assertion.
Consider this code:
type ApiProxy = {
getUsers(): Promise<User[]>;
}
type ApiClient = ApiProxy; // etc.
type ApiServer = ApiProxy; // etc.
export const makeUsersQuery = (
apiProxy: ApiProxy,
): FetchQueryOptions<User[], unknown, User[]> => ({
queryKey: ["users"],
queryFn: () => apiProxy.getUsers(),
});
/** As a hook **/
export const useUsers = (apiClient: ApiClient): UseQueryResult<User[]> =>
useQuery(makeUsersQuery(apiClient)); // no type assertion necessary
/** For ssr **/
export const prefetchUsers = async (
queryClient: QueryClient,
apiService: ApiService,
): Promise<void> =>
// Unfortunately, `prefetchQuery` isn't generic, so there's a type conflict
queryClient.prefetchQuery(makeUsersQuery(apiService) as FetchQueryOptions);Aligning prefetchQuery with fetchQuery's generics would fix this.