fix(types): fix promise inference in useQueries (#3493)

* fix(types): handle Promise inference in useQueries

* fix(types): prettier

Author: artysidorenko

src/core/tests/query.test.tsx

@@ -803,7 +803,8 @@ describe('query', () => {
 
     const observer = new QueryObserver(queryClient, {
       queryKey: key,
-      queryFn: (() => undefined) as any,
+      // @ts-expect-error (queryFn must not return undefined)
+      queryFn: () => undefined,
       retry: false,
     })
 

src/core/types.ts

@@ -14,7 +14,7 @@ export type QueryFunction<
   TQueryKey extends QueryKey = QueryKey
 > = (
   context: QueryFunctionContext<TQueryKey>
-) => QueryFunctionData<T> | Promise<QueryFunctionData<T>>
+) => QueryFunctionData<T | Promise<T>>
 
 export interface QueryFunctionContext<
   TQueryKey extends QueryKey = QueryKey,

src/persistQueryClient/tests/PersistQueryClientProvider.test.tsx

@@ -147,7 +147,7 @@ describe('PersistQueryClientProvider', () => {
 
       return (
         <div>
-          <h1>{String(state.data)}</h1>
+          <h1>{state.data}</h1>
           <h2>fetchStatus: {state.fetchStatus}</h2>
         </div>
       )

src/reactjs/tests/useQueries.test.tsx

@@ -776,8 +776,25 @@ describe('useQueries', () => {
       expectType<QueryObserverResult<string, unknown>>(result4[1])
       expectType<QueryObserverResult<number, unknown>>(result4[2])
 
-      // Array as const does not throw error
+      // handles when queryFn returns a Promise
       const result5 = useQueries({
+        queries: [
+          {
+            queryKey: key1,
+            queryFn: () => Promise.resolve('string'),
+            onSuccess: (a: string) => {
+              expectType<string>(a)
+              expectTypeNotAny(a)
+            },
+            // @ts-expect-error (refuses to accept a Promise)
+            onSettled: (a: Promise<string>) => null,
+          },
+        ],
+      })
+      expectType<QueryObserverResult<string, unknown>>(result5[0])
+
+      // Array as const does not throw error
+      const result6 = useQueries({
         queries: [
           {
             queryKey: ['key1'],
@@ -789,8 +806,8 @@ describe('useQueries', () => {
           },
         ],
       } as const)
-      expectType<QueryObserverResult<string, unknown>>(result5[0])
-      expectType<QueryObserverResult<number, unknown>>(result5[1])
+      expectType<QueryObserverResult<string, unknown>>(result6[0])
+      expectType<QueryObserverResult<number, unknown>>(result6[1])
 
       // field names should be enforced - array literal
       useQueries({

src/reactjs/tests/useQuery.test.tsx

@@ -38,6 +38,10 @@ describe('useQuery', () => {
       expectType<unknown>(noQueryFn.data)
       expectType<unknown>(noQueryFn.error)
 
+      // it should not be possible for queryFn to return undefined
+      // @ts-expect-error (queryFn returns undefined)
+      useQuery(key, () => undefined)
+
       // it should infer the result type from the query function
       const fromQueryFn = useQuery(key, () => 'test')
       expectType<string | undefined>(fromQueryFn.data)