fix(vue-query): preserve TQueryKey inference with generic params (#8199)

.changeset/vue-query-generic-querykey-inference.md

@@ -0,0 +1,5 @@
+---
+'@tanstack/vue-query': patch
+---
+
+fix(vue-query): preserve `TQueryKey` inference when wrapping `useQuery` in a composable with a generic param

packages/vue-query/src/__tests__/useQuery.test-d.ts

@@ -1,8 +1,8 @@
-import { describe, expectTypeOf, it } from 'vitest'
+import { assertType, describe, expectTypeOf, it } from 'vitest'
 import { computed, reactive, ref } from 'vue-demi'
 import { queryKey, sleep } from '@tanstack/query-test-utils'
 import { queryOptions, useQuery } from '..'
-import type { OmitKeyof, UseQueryOptions } from '..'
+import type { OmitKeyof, UseQueryOptions, UseQueryReturnType } from '..'
 
 describe('useQuery', () => {
   describe('Config object overload', () => {
@@ -152,6 +152,29 @@ describe('useQuery', () => {
     })
   })
 
+  describe('generic queryKey inference (#8199)', () => {
+    it('should not error when wrapping useQuery in a composable that propagates a generic type to the queryKey', () => {
+      const basket = { fruit: 'apple', vegetable: 'broccoli' } as const
+
+      function getBasket<T extends 'fruit' | 'vegetable'>(type: T) {
+        return basket[type]
+      }
+
+      function useBasket<T extends 'fruit' | 'vegetable'>(type: T) {
+        return useQuery({
+          queryKey: ['basket', type] as const,
+          queryFn({ queryKey: [, t] }) {
+            return getBasket(t)
+          },
+        })
+      }
+
+      assertType<UseQueryReturnType<'apple' | 'broccoli', Error>>(
+        useBasket('fruit'),
+      )
+    })
+  })
+
   describe('custom composable', () => {
     it('should allow custom composable using UseQueryOptions', () => {
       const key = queryKey()

packages/vue-query/src/useQuery.ts

@@ -42,15 +42,25 @@ export type UseQueryOptions<
               TQueryData,
               DeepUnwrapRef<TQueryKey>
             >)
-      : MaybeRefDeep<
-          QueryObserverOptions<
-            TQueryFnData,
-            TError,
-            TData,
-            TQueryData,
-            DeepUnwrapRef<TQueryKey>
-          >[Property]
-        >
+      : Property extends 'queryKey'
+        ? MaybeRef<
+            QueryObserverOptions<
+              TQueryFnData,
+              TError,
+              TData,
+              TQueryData,
+              TQueryKey
+            >[Property]
+          >
+        : MaybeRefDeep<
+            QueryObserverOptions<
+              TQueryFnData,
+              TError,
+              TData,
+              TQueryData,
+              DeepUnwrapRef<TQueryKey>
+            >[Property]
+          >
   } & ShallowOption
 >