fix(types): useSuspenseQuery should type-narrow the Error field (#9105)

* fix(types): useSuspenseQuery should type-narrow the Error field

* Update packages/query-core/src/types.ts

Co-authored-by: Jonghyeon Ko <[email protected]>

* Update packages/query-core/src/types.ts

Co-authored-by: Jonghyeon Ko <[email protected]>

* ref: use DistributiveOmit from query-core in vue-query

* chore: fix type error in tests

---------

Co-authored-by: Jonghyeon Ko <[email protected]>

Author: TkDodo

packages/query-core/src/types.ts

@@ -9,6 +9,11 @@ import type { QueryFilters, QueryTypeFilter, SkipToken } from './utils'
 import type { QueryCache } from './queryCache'
 import type { MutationCache } from './mutationCache'
 
+export type DistributiveOmit<
+  TObject,
+  TKey extends keyof TObject,
+> = TObject extends any ? Omit<TObject, TKey> : never
+
 export type OmitKeyof<
   TObject,
   TKey extends TStrictly extends 'safely'

packages/react-query/src/__tests__/useSuspenseQuery.test-d.tsx

@@ -68,4 +68,15 @@ describe('useSuspenseQuery', () => {
     // @ts-expect-error TS2339
     query.isPlaceholderData
   })
+
+  it('should type-narrow the error field', () => {
+    const query = useSuspenseQuery({
+      queryKey: ['key'],
+      queryFn: () => Promise.resolve(5),
+    })
+
+    if (query.status === 'error') {
+      expectTypeOf(query.error).toEqualTypeOf<Error>()
+    }
+  })
 })

packages/react-query/src/__tests__/useSuspenseQuery.test.tsx

@@ -703,7 +703,7 @@ describe('useSuspenseQuery', () => {
 
   it('should render the correct amount of times in Suspense mode when gcTime is set to 0', async () => {
     const key = queryKey()
-    let state: UseSuspenseQueryResult<number> | null = null
+    let state: UseSuspenseQueryResult<number, Error | null> | null = null
 
     let count = 0
     let renders = 0

packages/react-query/src/types.ts

@@ -4,6 +4,7 @@ import type {
   DefaultError,
   DefinedInfiniteQueryObserverResult,
   DefinedQueryObserverResult,
+  DistributiveOmit,
   InfiniteQueryObserverOptions,
   InfiniteQueryObserverResult,
   MutateFunction,
@@ -155,7 +156,7 @@ export type UseQueryResult<
 export type UseSuspenseQueryResult<
   TData = unknown,
   TError = DefaultError,
-> = OmitKeyof<
+> = DistributiveOmit<
   DefinedQueryObserverResult<TData, TError>,
   'isPlaceholderData' | 'promise'
 >

packages/vue-query/src/types.ts

@@ -55,10 +55,6 @@ export type DeepUnwrapRef<T> = T extends UnwrapLeaf
         }
       : UnwrapRef<T>
 
-export type DistributiveOmit<T, TKeyOfAny extends keyof any> = T extends any
-  ? Omit<T, TKeyOfAny>
-  : never
-
 export interface DefaultOptions<TError = DefaultError> {
   queries?: OmitKeyof<QueryObserverOptions<unknown, TError>, 'queryKey'> & {
     /**

packages/vue-query/src/useMutation.ts

@@ -15,12 +15,13 @@ import { useQueryClient } from './useQueryClient'
 import type { ToRefs } from 'vue-demi'
 import type {
   DefaultError,
+  DistributiveOmit,
   MutateFunction,
   MutateOptions,
   MutationObserverOptions,
   MutationObserverResult,
 } from '@tanstack/query-core'
-import type { DistributiveOmit, MaybeRefDeep } from './types'
+import type { MaybeRefDeep } from './types'
 import type { QueryClient } from './queryClient'
 
 type MutationResult<TData, TError, TVariables, TContext> = DistributiveOmit<