From f903af222203dff352d76600c662ade09998bae6 Mon Sep 17 00:00:00 2001
From: Damian Osipiuk <osipiukd+git@gmail.com>
Date: Wed, 8 May 2024 00:06:14 +0200
Subject: [PATCH] fix(vue-query): ref unwrapping of QueryKey in queryOptions
 (#7390)

* fix(vue-query): ref unwrapping of QueryKey in queryOptions

* test: add test
---
 .../src/__tests__/queryOptions.types.test.ts  | 21 +++++++-
 packages/vue-query/src/useInfiniteQuery.ts    | 53 +++++++------------
 packages/vue-query/src/useQuery.ts            | 46 +++++++---------
 3 files changed, 59 insertions(+), 61 deletions(-)

diff --git a/packages/vue-query/src/__tests__/queryOptions.types.test.ts b/packages/vue-query/src/__tests__/queryOptions.types.test.ts
index e398760236..7939d2dc81 100644
--- a/packages/vue-query/src/__tests__/queryOptions.types.test.ts
+++ b/packages/vue-query/src/__tests__/queryOptions.types.test.ts
@@ -1,5 +1,5 @@
 import { describe, it } from 'vitest'
-import { reactive } from 'vue-demi'
+import { reactive, ref } from 'vue-demi'
 import { QueryClient } from '../queryClient'
 import { queryOptions } from '../queryOptions'
 import { useQuery } from '../useQuery'
@@ -148,4 +148,23 @@ describe('queryOptions', () => {
       return result
     })
   })
+  it('should allow to be passed to QueryClient methods while containing ref in queryKey', () => {
+    doNotExecute(() => {
+      const options = queryOptions({
+        queryKey: ['key', ref(1), { nested: ref(2) }],
+        queryFn: () => Promise.resolve(5),
+      })
+
+      const queryClient = new QueryClient()
+
+      // Should not error
+      const data = queryClient.invalidateQueries(options)
+      // Should not error
+      const data2 = queryClient.fetchQuery(options)
+
+      const result: Expect<Equal<typeof data, Promise<void>>> = true
+      const result2: Expect<Equal<typeof data2, Promise<number>>> = true
+      return result || result2
+    })
+  })
 })
diff --git a/packages/vue-query/src/useInfiniteQuery.ts b/packages/vue-query/src/useInfiniteQuery.ts
index d2369886e4..f0e4c3134e 100644
--- a/packages/vue-query/src/useInfiniteQuery.ts
+++ b/packages/vue-query/src/useInfiniteQuery.ts
@@ -29,39 +29,26 @@ export type UseInfiniteQueryOptions<
     TQueryData,
     TQueryKey,
     TPageParam
-  >]: Property extends
-    | 'queryFn'
-    | 'getPreviousPageParam'
-    | 'getNextPageParam'
-    | 'select'
-    ? InfiniteQueryObserverOptions<
-        TQueryFnData,
-        TError,
-        TData,
-        TQueryData,
-        DeepUnwrapRef<TQueryKey>,
-        TPageParam
-      >[Property]
-    : Property extends 'enabled'
-      ? MaybeRefOrGetter<
-          InfiniteQueryObserverOptions<
-            TQueryFnData,
-            TError,
-            TData,
-            TQueryData,
-            TQueryKey
-          >[Property]
-        >
-      : MaybeRefDeep<
-          InfiniteQueryObserverOptions<
-            TQueryFnData,
-            TError,
-            TData,
-            TQueryData,
-            TQueryKey,
-            TPageParam
-          >[Property]
-        >
+  >]: Property extends 'enabled'
+    ? MaybeRefOrGetter<
+        InfiniteQueryObserverOptions<
+          TQueryFnData,
+          TError,
+          TData,
+          TQueryData,
+          DeepUnwrapRef<TQueryKey>
+        >[Property]
+      >
+    : MaybeRefDeep<
+        InfiniteQueryObserverOptions<
+          TQueryFnData,
+          TError,
+          TData,
+          TQueryData,
+          DeepUnwrapRef<TQueryKey>,
+          TPageParam
+        >[Property]
+      >
 }
 
 export type UseInfiniteQueryReturnType<TData, TError> = UseBaseQueryReturnType<
diff --git a/packages/vue-query/src/useQuery.ts b/packages/vue-query/src/useQuery.ts
index 2e032d74b7..ad91144139 100644
--- a/packages/vue-query/src/useQuery.ts
+++ b/packages/vue-query/src/useQuery.ts
@@ -30,33 +30,25 @@ export type UseQueryOptions<
     TData,
     TQueryData,
     TQueryKey
-  >]: Property extends 'queryFn' | 'select'
-    ? QueryObserverOptions<
-        TQueryFnData,
-        TError,
-        TData,
-        TQueryData,
-        DeepUnwrapRef<TQueryKey>
-      >[Property]
-    : Property extends 'enabled'
-      ? MaybeRefOrGetter<
-          QueryObserverOptions<
-            TQueryFnData,
-            TError,
-            TData,
-            TQueryData,
-            TQueryKey
-          >[Property]
-        >
-      : MaybeRefDeep<
-          QueryObserverOptions<
-            TQueryFnData,
-            TError,
-            TData,
-            TQueryData,
-            TQueryKey
-          >[Property]
-        >
+  >]: Property extends 'enabled'
+    ? MaybeRefOrGetter<
+        QueryObserverOptions<
+          TQueryFnData,
+          TError,
+          TData,
+          TQueryData,
+          DeepUnwrapRef<TQueryKey>
+        >[Property]
+      >
+    : MaybeRefDeep<
+        QueryObserverOptions<
+          TQueryFnData,
+          TError,
+          TData,
+          TQueryData,
+          DeepUnwrapRef<TQueryKey>
+        >[Property]
+      >
 }>
 
 export type UndefinedInitialQueryOptions<