feat: typed query filters

packages/query-core/src/__tests__/queryClient.test-d.tsx

@@ -497,3 +497,39 @@ describe('fully typed usage', () => {
     queryClient.getMutationDefaults(mutationKey)
   })
 })
+
+describe('invalidateQueries', () => {
+  it('shows type error when queryKey is a wrong type in invalidateQueries', () => {
+    const queryClient = new QueryClient()
+
+    queryClient.invalidateQueries()
+
+    queryClient.invalidateQueries({
+      queryKey: ['1'],
+    })
+
+    queryClient.invalidateQueries({
+      // @ts-expect-error
+      queryKey: '1',
+    })
+
+    queryClient.invalidateQueries({
+      // @ts-expect-error
+      queryKey: {},
+    })
+  })
+  it('predicate should be typed if key is tagged', () => {
+    const queryKey = ['key'] as DataTag<Array<string>, number>
+    const queryClient = new QueryClient()
+    queryClient.invalidateQueries({
+      queryKey,
+      predicate: (query) => {
+        expectTypeOf(query.state.data).toEqualTypeOf<number | undefined>()
+        expectTypeOf(query.queryKey).toEqualTypeOf<
+          DataTag<Array<string>, number>
+        >()
+        return true
+      },
+    })
+  })
+})

packages/query-core/src/queryClient.ts

@@ -15,14 +15,15 @@ import { notifyManager } from './notifyManager'
 import { infiniteQueryBehavior } from './infiniteQueryBehavior'
 import type {
   CancelOptions,
-  DataTag,
   DefaultError,
   DefaultOptions,
   DefaultedQueryObserverOptions,
   EnsureInfiniteQueryDataOptions,
   EnsureQueryDataOptions,
   FetchInfiniteQueryOptions,
   FetchQueryOptions,
+  InferDataFromTag,
+  InferErrorFromTag,
   InfiniteData,
   InvalidateOptions,
   InvalidateQueryFilters,
@@ -39,7 +40,6 @@ import type {
   RefetchQueryFilters,
   ResetOptions,
   SetDataOptions,
-  UnsetMarker,
 } from './types'
 import type { QueryState } from './query'
 import type { MutationFilters, QueryFilters, Updater } from './utils'
@@ -122,13 +122,7 @@ export class QueryClient {
   getQueryData<
     TQueryFnData = unknown,
     TTaggedQueryKey extends QueryKey = QueryKey,
-    TInferredQueryFnData = TTaggedQueryKey extends DataTag<
-      unknown,
-      infer TaggedValue,
-      unknown
-    >
-      ? TaggedValue
-      : TQueryFnData,
+    TInferredQueryFnData = InferDataFromTag<TQueryFnData, TTaggedQueryKey>,
   >(queryKey: TTaggedQueryKey): TInferredQueryFnData | undefined {
     const options = this.defaultQueryOptions({ queryKey })
 
@@ -191,13 +185,7 @@ export class QueryClient {
   setQueryData<
     TQueryFnData = unknown,
     TTaggedQueryKey extends QueryKey = QueryKey,
-    TInferredQueryFnData = TTaggedQueryKey extends DataTag<
-      unknown,
-      infer TaggedValue,
-      unknown
-    >
-      ? TaggedValue
-      : TQueryFnData,
+    TInferredQueryFnData = InferDataFromTag<TQueryFnData, TTaggedQueryKey>,
   >(
     queryKey: TTaggedQueryKey,
     updater: Updater<
@@ -267,22 +255,8 @@ export class QueryClient {
     TQueryFnData = unknown,
     TError = DefaultError,
     TTaggedQueryKey extends QueryKey = QueryKey,
-    TInferredQueryFnData = TTaggedQueryKey extends DataTag<
-      unknown,
-      infer TaggedValue,
-      unknown
-    >
-      ? TaggedValue
-      : TQueryFnData,
-    TInferredError = TTaggedQueryKey extends DataTag<
-      unknown,
-      unknown,
-      infer TaggedError
-    >
-      ? TaggedError extends UnsetMarker
-        ? TError
-        : TaggedError
-      : TError,
+    TInferredQueryFnData = InferDataFromTag<TQueryFnData, TTaggedQueryKey>,
+    TInferredError = InferErrorFromTag<TError, TTaggedQueryKey>,
   >(
     queryKey: TTaggedQueryKey,
   ): QueryState<TInferredQueryFnData, TInferredError> | undefined {
@@ -336,29 +310,35 @@ export class QueryClient {
   }
 
   invalidateQueries<
-    TInvalidateQueryFilters extends InvalidateQueryFilters<
-      any,
-      any,
-      any,
-      any
-    > = InvalidateQueryFilters,
+    TQueryFnData = unknown,
+    TError = DefaultError,
+    TTaggedQueryKey extends QueryKey = QueryKey,
+    TInferredQueryFnData = InferDataFromTag<TQueryFnData, TTaggedQueryKey>,
+    TInferredError = InferErrorFromTag<TError, TTaggedQueryKey>,
   >(
-    filters?: TInvalidateQueryFilters,
+    filters?: InvalidateQueryFilters<
+      TInferredQueryFnData,
+      TInferredError,
+      TInferredQueryFnData,
+      TTaggedQueryKey
+    >,
     options: InvalidateOptions = {},
   ): Promise<void> {
     return notifyManager.batch(() => {
-      this.#queryCache.findAll(filters).forEach((query) => {
+      this.#queryCache.findAll(filters as QueryFilters).forEach((query) => {
         query.invalidate()
       })
 
       if (filters?.refetchType === 'none') {
         return Promise.resolve()
       }
-      const refetchFilters: RefetchQueryFilters = {
-        ...filters,
-        type: filters?.refetchType ?? filters?.type ?? 'active',
-      }
-      return this.refetchQueries(refetchFilters, options)
+      return this.refetchQueries(
+        {
+          ...filters,
+          type: filters?.refetchType ?? filters?.type ?? 'active',
+        },
+        options,
+      )
     })
   }
 

packages/query-core/src/types.ts

@@ -74,6 +74,18 @@ export type DataTag<
       [dataTagErrorSymbol]: TError
     }
 
+export type InferDataFromTag<TQueryFnData, TTaggedQueryKey extends QueryKey> =
+  TTaggedQueryKey extends DataTag<unknown, infer TaggedValue, unknown>
+    ? TaggedValue
+    : TQueryFnData
+
+export type InferErrorFromTag<TError, TTaggedQueryKey extends QueryKey> =
+  TTaggedQueryKey extends DataTag<unknown, unknown, infer TaggedError>
+    ? TaggedError extends UnsetMarker
+      ? TError
+      : TaggedError
+    : TError
+
 export type QueryFunction<
   T = unknown,
   TQueryKey extends QueryKey = QueryKey,

packages/vue-query/src/queryClient.ts

@@ -3,9 +3,6 @@
 import { cloneDeepUnref } from './utils'
 import { QueryCache } from './queryCache'
 import { MutationCache } from './mutationCache'
-import type { UseQueryOptions } from './useQuery'
-import type { Ref } from 'vue-demi'
-import type { MaybeRefDeep, NoUnknown } from './types'
 import type {
   CancelOptions,
   DataTag,
@@ -14,6 +11,8 @@
   EnsureQueryDataOptions,
   FetchInfiniteQueryOptions,
   FetchQueryOptions,
+  InferDataFromTag,
+  InferErrorFromTag,
   InfiniteData,
   InvalidateOptions,
   InvalidateQueryFilters,
@@ -33,6 +32,9 @@
   SetDataOptions,
   Updater,
 } from '@tanstack/query-core'
+import type { UseQueryOptions } from './useQuery'
+import type { Ref } from 'vue-demi'
+import type { MaybeRefDeep, NoUnknown } from './types'
 
 export class QueryClient extends QC {
   constructor(config: QueryClientConfig = {}) {
@@ -56,11 +58,7 @@
 
   getQueryData<TData = unknown, TTaggedQueryKey extends QueryKey = QueryKey>(
     queryKey: TTaggedQueryKey,
-  ):
-    | (TTaggedQueryKey extends DataTag<unknown, infer TaggedValue, unknown>
-        ? TaggedValue
-        : TData)
-    | undefined
+  ): InferDataFromTag<TData, TTaggedQueryKey> | undefined
   getQueryData<TData = unknown>(
     queryKey: MaybeRefDeep<QueryKey>,
   ): TData | undefined
@@ -171,8 +169,36 @@
     return super.cancelQueries(cloneDeepUnref(filters), cloneDeepUnref(options))
   }
 
-  invalidateQueries(
-    filters: MaybeRefDeep<InvalidateQueryFilters> = {},
+  invalidateQueries<
+    TQueryFnData = unknown,
+    TError = DefaultError,
+    TTaggedQueryKey extends QueryKey = QueryKey,
+    TInferredQueryFnData = InferDataFromTag<TQueryFnData, TTaggedQueryKey>,
+    TInferredError = InferErrorFromTag<TError, TTaggedQueryKey>,
+  >(
+    filters?: InvalidateQueryFilters<
+      TInferredQueryFnData,
+      TInferredError,
+      TInferredQueryFnData,
+      TTaggedQueryKey
+    >,
+    options?: MaybeRefDeep<InvalidateOptions>,
+  ): Promise<void>
+  invalidateQueries<
+    TQueryFnData = unknown,
+    TError = DefaultError,
+    TTaggedQueryKey extends QueryKey = QueryKey,
+    TInferredQueryFnData = InferDataFromTag<TQueryFnData, TTaggedQueryKey>,
+    TInferredError = InferErrorFromTag<TError, TTaggedQueryKey>,
+  >(
+    filters: MaybeRefDeep<
+      InvalidateQueryFilters<
+        TInferredQueryFnData,
+        TInferredError,
+        TInferredQueryFnData,
+        TTaggedQueryKey
+      >
+    > = {},
     options: MaybeRefDeep<InvalidateOptions> = {},
   ): Promise<void> {
     const filtersCloned = cloneDeepUnref(filters)
@@ -187,7 +213,12 @@
       return Promise.resolve()
     }
 
-    const refetchFilters: RefetchQueryFilters = {
+    const refetchFilters: RefetchQueryFilters<
+      TInferredQueryFnData,
+      TInferredError,
+      TInferredQueryFnData,
+      TTaggedQueryKey
+    > = {
       ...filtersCloned,
       type: filtersCloned.refetchType ?? filtersCloned.type ?? 'active',
     }