Separate QueryArg and PageParam types for infinite queries

Author: markerikson

packages/toolkit/src/query/core/apiState.ts

@@ -7,6 +7,8 @@ import type {
   BaseEndpointDefinition,
   ResultTypeFrom,
   QueryArgFrom,
+  InfiniteQueryDefinition,
+  PageParamFrom,
 } from '../endpointDefinitions'
 import type { Id, WithRequiredProp } from '../tsHelpers'
 
@@ -28,24 +30,21 @@ export type RefetchConfigOptions = {
   refetchOnFocus: boolean
 }
 
-export type GetNextPageParamFunction<TPageParam, TQueryFnData = unknown> = (
+export type GetNextPageParamFunction<TPageParam, TQueryFnData> = (
   lastPage: TQueryFnData,
   allPages: Array<TQueryFnData>,
   lastPageParam: TPageParam,
   allPageParams: Array<TPageParam>,
 ) => TPageParam | undefined | null
 
-export type GetPreviousPageParamFunction<TPageParam, TQueryFnData = unknown> = (
+export type GetPreviousPageParamFunction<TPageParam, TQueryFnData> = (
   firstPage: TQueryFnData,
   allPages: Array<TQueryFnData>,
   firstPageParam: TPageParam,
   allPageParams: Array<TPageParam>,
 ) => TPageParam | undefined | null
 
-export type InfiniteQueryConfigOptions<
-  TQueryFnData = unknown,
-  TPageParam = unknown,
-> = {
+export type InfiniteQueryConfigOptions<TQueryFnData, TPageParam> = {
   /**
    * This function can be set to automatically get the previous cursor for infinite queries.
    * The result will also be used to determine the value of `hasPreviousPage`.
@@ -54,7 +53,7 @@ export type InfiniteQueryConfigOptions<
   getNextPageParam: GetNextPageParamFunction<TPageParam, TQueryFnData>
 }
 
-export interface InfiniteData<TData, TPageParam = unknown> {
+export interface InfiniteData<TData, TPageParam> {
   pages: Array<TData>
   pageParams: Array<TPageParam>
 }
@@ -239,15 +238,18 @@ export type QuerySubState<
 
 export type InfiniteQuerySubState<
   D extends BaseEndpointDefinition<any, any, any>,
-> = QuerySubState<D, InfiniteData<ResultTypeFrom<D>>> & {
-  // TODO: These shouldn't be optional
-  hasNextPage?: boolean
-  hasPreviousPage?: boolean
-  isFetchingNextPage?: boolean
-  isFetchingPreviousPage?: boolean
-  param?: QueryArgFrom<D>
-  direction?: 'forward' | 'backwards'
-}
+> =
+  D extends InfiniteQueryDefinition<any, any, any, any, any>
+    ? QuerySubState<D, InfiniteData<ResultTypeFrom<D>, PageParamFrom<D>>> & {
+        // TODO: These shouldn't be optional
+        hasNextPage?: boolean
+        hasPreviousPage?: boolean
+        isFetchingNextPage?: boolean
+        isFetchingPreviousPage?: boolean
+        param?: PageParamFrom<D>
+        direction?: 'forward' | 'backwards'
+      }
+    : never
 
 type BaseMutationSubState<D extends BaseEndpointDefinition<any, any, any>> = {
   requestId: string

packages/toolkit/src/query/core/buildInitiate.ts

@@ -12,6 +12,7 @@ import type { BaseQueryError, QueryReturnValue } from '../baseQueryTypes'
 import type { InternalSerializeQueryArgs } from '../defaultSerializeQueryArgs'
 import type {
   EndpointDefinitions,
+  InfiniteQueryArgFrom,
   InfiniteQueryDefinition,
   MutationDefinition,
   QueryArgFrom,
@@ -70,7 +71,7 @@ export type StartInfiniteQueryActionCreatorOptions = {
   subscribe?: boolean
   forceRefetch?: boolean | number
   subscriptionOptions?: SubscriptionOptions
-  infiniteQueryOptions?: InfiniteQueryConfigOptions
+  infiniteQueryOptions?: InfiniteQueryConfigOptions<unknown, unknown>
   direction?: 'forward' | 'backwards'
   [forceQueryFnSymbol]?: () => QueryReturnValue
   param?: unknown
@@ -89,7 +90,7 @@ type StartQueryActionCreator<
 type StartInfiniteQueryActionCreator<
   D extends InfiniteQueryDefinition<any, any, any, any, any>,
 > = (
-  arg: QueryArgFrom<D>,
+  arg: InfiniteQueryArgFrom<D>,
   options?: StartInfiniteQueryActionCreatorOptions,
 ) => (
   dispatch: ThunkDispatch<any, any, UnknownAction>,
@@ -111,7 +112,7 @@ export type QueryActionCreatorResult<
 }
 
 export type InfiniteQueryActionCreatorResult<
-  D extends InfiniteQueryDefinition<any, any, any, any>,
+  D extends InfiniteQueryDefinition<any, any, any, any, any>,
 > = Promise<InfiniteQueryResultSelectorResult<D>> & {
   arg: QueryArgFrom<D>
   requestId: string
@@ -479,7 +480,7 @@ You must add the middleware for RTK-Query to function correctly!`,
 
   function buildInitiateInfiniteQuery(
     endpointName: string,
-    endpointDefinition: InfiniteQueryDefinition<any, any, any, any>,
+    endpointDefinition: InfiniteQueryDefinition<any, any, any, any, any>,
     pages?: number,
   ) {
     const infiniteQueryAction: StartInfiniteQueryActionCreator<any> =

packages/toolkit/src/query/core/buildSelectors.ts

@@ -105,14 +105,14 @@ export type QueryResultSelectorResult<
 > = QuerySubState<Definition> & RequestStatusFlags
 
 type InfiniteQueryResultSelectorFactory<
-  Definition extends InfiniteQueryDefinition<any, any, any, any>,
+  Definition extends InfiniteQueryDefinition<any, any, any, any, any>,
   RootState,
 > = (
   queryArg: QueryArgFrom<Definition> | SkipToken,
 ) => (state: RootState) => InfiniteQueryResultSelectorResult<Definition>
 
 export type InfiniteQueryResultSelectorResult<
-  Definition extends InfiniteQueryDefinition<any, any, any, any>,
+  Definition extends InfiniteQueryDefinition<any, any, any, any, any>,
 > = InfiniteQuerySubState<Definition> & RequestStatusFlags
 
 type MutationResultSelectorFactory<
@@ -215,7 +215,7 @@ export function buildSelectors<
   // selector currently is just a clone of Query though
   function buildInfiniteQuerySelector(
     endpointName: string,
-    endpointDefinition: InfiniteQueryDefinition<any, any, any, any>,
+    endpointDefinition: InfiniteQueryDefinition<any, any, any, any, any>,
   ) {
     return ((queryArgs: any) => {
       const serializedArgs = serializeQueryArgs({

packages/toolkit/src/query/core/buildThunks.ts

@@ -429,7 +429,7 @@ export function buildThunks<
       // Infinite query wrapper, which executes the request and returns
       // the InfiniteData `{pages, pageParams}` structure
       const fetchPage = async (
-        data: InfiniteData<unknown>,
+        data: InfiniteData<unknown, unknown>,
         param: unknown,
         previous?: boolean,
       ): Promise<QueryReturnValue> => {
@@ -575,10 +575,10 @@ export function buildThunks<
           for (let i = 1; i < remainingPages; i++) {
             const param = getNextPageParam(
               endpointDefinition.infiniteQueryOptions,
-              result.data as InfiniteData<unknown>,
+              result.data as InfiniteData<unknown, unknown>,
             )
             result = await fetchPage(
-              result.data as InfiniteData<unknown>,
+              result.data as InfiniteData<unknown, unknown>,
               param,
             )
           }
@@ -638,8 +638,8 @@ In the case of an unhandled error, no tags will be "provided" or "invalidated".`
   }
 
   function getNextPageParam(
-    options: InfiniteQueryConfigOptions<any>,
-    { pages, pageParams }: InfiniteData<unknown>,
+    options: InfiniteQueryConfigOptions<unknown, unknown>,
+    { pages, pageParams }: InfiniteData<unknown, unknown>,
   ): unknown | undefined {
     const lastIndex = pages.length - 1
     return options.getNextPageParam(
@@ -651,8 +651,8 @@ In the case of an unhandled error, no tags will be "provided" or "invalidated".`
   }
 
   function getPreviousPageParam(
-    options: InfiniteQueryConfigOptions<any>,
-    { pages, pageParams }: InfiniteData<unknown>,
+    options: InfiniteQueryConfigOptions<unknown, unknown>,
+    { pages, pageParams }: InfiniteData<unknown, unknown>,
   ): unknown | undefined {
     return options.getPreviousPageParam?.(
       pages[0],

packages/toolkit/src/query/endpointDefinitions.ts

@@ -35,6 +35,7 @@ import type {
   OmitFromUnion,
   UnwrapPromise,
 } from './tsHelpers'
+import { AnyARecord } from 'dns'
 
 const resultType = /* @__PURE__ */ Symbol()
 const baseQuery = /* @__PURE__ */ Symbol()
@@ -43,6 +44,7 @@ type EndpointDefinitionWithQuery<
   QueryArg,
   BaseQuery extends BaseQueryFn,
   ResultType,
+  PageParam = never,
 > = {
   /**
    * `query` can be a function that returns either a `string` or an `object` which is passed to your `baseQuery`. If you are using [fetchBaseQuery](./fetchBaseQuery), this can return either a `string` or an `object` of properties in `FetchArgs`. If you use your own custom [`baseQuery`](../../rtk-query/usage/customizing-queries), you can customize this behavior to your liking.
@@ -546,6 +548,7 @@ export type QueryDefinition<
 // cloning Query Endpoint Definition with an extra option to begin with
 export interface InfiniteQueryTypes<
   QueryArg,
+  PageParam,
   BaseQuery extends BaseQueryFn,
   TagTypes extends string,
   ResultType,
@@ -560,6 +563,7 @@ export interface InfiniteQueryTypes<
    */
   InfiniteQueryDefinition: InfiniteQueryDefinition<
     QueryArg,
+    PageParam,
     BaseQuery,
     TagTypes,
     ResultType,
@@ -573,6 +577,7 @@ export interface InfiniteQueryExtraOptions<
   TagTypes extends string,
   ResultType,
   QueryArg,
+  PageParam,
   BaseQuery extends BaseQueryFn,
   ReducerPath extends string = string,
 > extends CacheLifecycleInfiniteQueryExtraOptions<
@@ -664,6 +669,7 @@ export interface InfiniteQueryExtraOptions<
    */
   Types?: InfiniteQueryTypes<
     QueryArg,
+    PageParam,
     BaseQuery,
     TagTypes,
     ResultType,
@@ -673,18 +679,22 @@ export interface InfiniteQueryExtraOptions<
 
 export type InfiniteQueryDefinition<
   QueryArg,
+  PageParam,
   BaseQuery extends BaseQueryFn,
   TagTypes extends string,
   ResultType,
   ReducerPath extends string = string,
-> = BaseEndpointDefinition<QueryArg, BaseQuery, ResultType> &
-  InfiniteQueryExtraOptions<
-    TagTypes,
-    ResultType,
-    QueryArg,
-    BaseQuery,
-    ReducerPath
-  >
+> =
+  // Intentionally use `PageParam` as the QueryArg` type
+  BaseEndpointDefinition<PageParam, BaseQuery, ResultType> &
+    InfiniteQueryExtraOptions<
+      TagTypes,
+      ResultType,
+      QueryArg,
+      PageParam,
+      BaseQuery,
+      ReducerPath
+    >
 
 type MutationTypes<
   QueryArg,
@@ -812,11 +822,13 @@ export type EndpointDefinition<
   TagTypes extends string,
   ResultType,
   ReducerPath extends string = string,
+  PageParam = any,
 > =
   | QueryDefinition<QueryArg, BaseQuery, TagTypes, ResultType, ReducerPath>
   | MutationDefinition<QueryArg, BaseQuery, TagTypes, ResultType, ReducerPath>
   | InfiniteQueryDefinition<
       QueryArg,
+      PageParam,
       BaseQuery,
       TagTypes,
       ResultType,
@@ -842,7 +854,7 @@ export function isMutationDefinition(
 
 export function isInfiniteQueryDefinition(
   e: EndpointDefinition<any, any, any, any>,
-): e is InfiniteQueryDefinition<any, any, any, any> {
+): e is InfiniteQueryDefinition<any, any, any, any, any> {
   return e.type === DefinitionType.infinitequery
 }
 
@@ -922,10 +934,11 @@ export type EndpointBuilder<
     >,
   ): MutationDefinition<QueryArg, BaseQuery, TagTypes, ResultType, ReducerPath>
 
-  infiniteQuery<ResultType, QueryArg>(
+  infiniteQuery<ResultType, QueryArg, PageParam>(
     definition: OmitFromUnion<
       InfiniteQueryDefinition<
         QueryArg,
+        PageParam,
         BaseQuery,
         TagTypes,
         ResultType,
@@ -935,6 +948,7 @@ export type EndpointBuilder<
     >,
   ): InfiniteQueryDefinition<
     QueryArg,
+    PageParam,
     BaseQuery,
     TagTypes,
     ResultType,
@@ -981,7 +995,15 @@ export function expandTagDescription(
 }
 
 export type QueryArgFrom<D extends BaseEndpointDefinition<any, any, any>> =
-  D extends BaseEndpointDefinition<infer QA, any, any> ? QA : unknown
+  D extends BaseEndpointDefinition<infer QA, any, any> ? QA : never
+
+// Just extracting `QueryArg` from `BaseEndpointDefinition`
+// doesn't sufficiently match here.
+// We need to explicitly match against `InfiniteQueryDefinition`
+export type InfiniteQueryArgFrom<
+  D extends BaseEndpointDefinition<any, any, any>,
+> = D extends InfiniteQueryDefinition<infer QA, any, any, any, any> ? QA : never
+
 export type ResultTypeFrom<D extends BaseEndpointDefinition<any, any, any>> =
   D extends BaseEndpointDefinition<any, any, infer RT> ? RT : unknown
 
@@ -992,6 +1014,11 @@ export type ReducerPathFrom<
 export type TagTypesFrom<D extends EndpointDefinition<any, any, any, any>> =
   D extends EndpointDefinition<any, any, infer RP, any> ? RP : unknown
 
+export type PageParamFrom<
+  D extends InfiniteQueryDefinition<any, any, any, any, any>,
+> =
+  D extends InfiniteQueryDefinition<any, infer PP, any, any, any> ? PP : unknown
+
 export type TagTypesFromApi<T> =
   T extends Api<any, any, any, infer TagTypes> ? TagTypes : never
 
@@ -1035,13 +1062,15 @@ export type OverrideResultType<Definition, NewResultType> =
         >
       : Definition extends InfiniteQueryDefinition<
             infer QueryArg,
+            infer PageParam,
             infer BaseQuery,
             infer TagTypes,
             any,
             infer ReducerPath
           >
         ? InfiniteQueryDefinition<
             QueryArg,
+            PageParam,
             BaseQuery,
             TagTypes,
             NewResultType,
@@ -1084,13 +1113,15 @@ export type UpdateDefinitions<
         >
       : Definitions[K] extends InfiniteQueryDefinition<
             infer QueryArg,
+            infer PageParam,
             infer BaseQuery,
             any,
             infer ResultType,
             infer ReducerPath
           >
         ? InfiniteQueryDefinition<
             QueryArg,
+            PageParam,
             BaseQuery,
             NewTagTypes,
             TransformedResponse<NewDefinitions, K, ResultType>,