From 415e680187fa18419c0b4f33c44a8ddeb23bcb28 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=81ukasz=20Fiszer?= Date: Fri, 15 Nov 2019 00:50:17 +0100 Subject: [PATCH] react-query: improve types for useQuery in paginated mode (#40399) * react-query: improve types for useQuery in paginated mode * react-query: remove patch version from header --- types/react-query/index.d.ts | 17 +++++++++++++++-- types/react-query/react-query-tests.ts | 16 ++++++++++++++++ 2 files changed, 31 insertions(+), 2 deletions(-) diff --git a/types/react-query/index.d.ts b/types/react-query/index.d.ts index dede7f425b..62b235f8a4 100644 --- a/types/react-query/index.d.ts +++ b/types/react-query/index.d.ts @@ -11,6 +11,13 @@ export function useQuery( options?: QueryOptions ): QueryResult; +// overloaded useQuery function with pagination +export function useQuery( + queryKey: QueryKey, + queryFn: QueryFunction, + options?: QueryOptionsPaginated +): QueryResultPaginated; + export type QueryKey = string | [string, TVariables] | false | null | QueryKeyFunction; export type QueryKeyFunction = () => string | [string, TVariables] | false | null; @@ -18,8 +25,6 @@ export type QueryFunction = (variables: TVar export interface QueryOptions { manual?: boolean; - paginated?: boolean; - getCanFetchMore?: (lastPage: number, allPages: number) => boolean; retry?: boolean | number; retryDelay?: (retryAttempt: number) => number; staleTime?: number; @@ -30,6 +35,11 @@ export interface QueryOptions { suspense?: boolean; } +export interface QueryOptionsPaginated extends QueryOptions { + paginated: true; + getCanFetchMore: (lastPage: number, allPages: number) => boolean; +} + export interface QueryResult { data: null | TResult; error: null | Error; @@ -38,6 +48,9 @@ export interface QueryResult { isCached: boolean; failureCount: number; refetch: (arg?: {variables?: TVariables, merge?: (...args: any[]) => any, disableThrow?: boolean}) => void; +} + +export interface QueryResultPaginated extends QueryResult { isFetchingMore: boolean; canFetchMore: boolean; fetchMore: (variables?: TVariables) => Promise; diff --git a/types/react-query/react-query-tests.ts b/types/react-query/react-query-tests.ts index d35d8a0a0e..91c72e555f 100644 --- a/types/react-query/react-query-tests.ts +++ b/types/react-query/react-query-tests.ts @@ -9,6 +9,9 @@ querySimple.data; // $ExpectType string | null querySimple.error; // $ExpectType Error | null querySimple.isLoading; // $ExpectType boolean querySimple.refetch(); // $ExpectType void +queryPaginated.fetchMore; // $ExpectError +queryPaginated.canFetchMore; // $ExpectError +queryPaginated.isFetchingMore; // $ExpectError // Query Variables const param = 'test'; @@ -33,6 +36,19 @@ const queryNested = useQuery(['key', { }], (variables) => Promise.resolve(variables.nested.props[0])); queryNested.data; // $ExpectType number | null +// Paginated mode +const queryPaginated = useQuery('key', () => Promise.resolve([1, 2, 3]), { + paginated: true, + getCanFetchMore: (lastPage, allPages) => true +}); +queryPaginated.data; // $ExpectType number[][] | null +queryPaginated.fetchMore; // $ExpectType (variables?: {} | undefined) => Promise || (variables?: object | undefined) => Promise +queryPaginated.canFetchMore; // $ExpectType boolean +queryPaginated.isFetchingMore; // $ExpectType boolean + +// Paginated mode - check if getCanFetchMore is required +useQuery('key', () => Promise.resolve(), {paginated: true}); // $ExpectError + // Simple mutation const mutation = () => Promise.resolve(['foo', 1]);