Merge branch 'main' into alpha

Author: TkDodo

docs/react/reference/QueryClient.md

@@ -527,7 +527,7 @@ function Component() {
 
 **Options**
 
-- `mutationKey: string | unknown[]`
+- `mutationKey: unknown[]`
 - `options: MutationOptions`
 
 > Similar to [`setQueryDefaults`](#queryclientsetquerydefaults), the order of registration does matter here.

docs/react/reference/useMutation.md

@@ -51,7 +51,7 @@ mutate(variables, {
 - `gcTime: number | Infinity`
   - The time in milliseconds that unused/inactive cache data remains in memory. When a mutation's cache becomes unused or inactive, that cache data will be garbage collected after this duration. When different cache times are specified, the longest one will be used.
   - If set to `Infinity`, will disable garbage collection
-- `mutationKey: string`
+- `mutationKey: unknown[]`
   - Optional
   - A mutation key can be set to inherit defaults set with `queryClient.setMutationDefaults` or to identify the mutation in the devtools.
 - `networkMode: 'online' | 'always' | 'offlineFirst`

examples/react/react-native/src/hooks/useAppState.ts

@@ -3,9 +3,9 @@ import { AppState, AppStateStatus } from 'react-native'
 
 export function useAppState(onChange: (status: AppStateStatus) => void) {
   useEffect(() => {
-    AppState.addEventListener('change', onChange)
+    const subscription = AppState.addEventListener('change', onChange)
     return () => {
-      AppState.removeEventListener('change', onChange)
+      subscription.remove()
     }
   }, [onChange])
 }

packages/query-core/src/index.ts

@@ -2,6 +2,7 @@
 
 export { CancelledError } from './retryer'
 export { QueryCache } from './queryCache'
+export type { QueryCacheNotifyEvent } from './queryCache'
 export { QueryClient } from './queryClient'
 export { QueryObserver } from './queryObserver'
 export { QueriesObserver } from './queriesObserver'

packages/query-core/src/infiniteQueryBehavior.ts

@@ -39,7 +39,10 @@ export function infiniteQueryBehavior<TQueryFnData, TError, TData>(
         // Get query function
         const queryFn =
           context.options.queryFn ||
-          (() => Promise.reject(new Error('Missing queryFn')))
+          (() =>
+            Promise.reject(
+              new Error(`Missing queryFn: '${context.options.queryHash}'`),
+            ))
 
         // Create function to fetch a page
         const fetchPage = async (

packages/query-core/src/notifyManager.ts

@@ -8,6 +8,8 @@ type NotifyFunction = (callback: () => void) => void
 
 type BatchNotifyFunction = (callback: () => void) => void
 
+type BatchCallsCallback<T extends unknown[]> = (...args: T) => void
+
 export function createNotifyManager() {
   let queue: NotifyCallback[] = []
   let transactions = 0
@@ -45,12 +47,14 @@ export function createNotifyManager() {
   /**
    * All calls to the wrapped function will be batched.
    */
-  const batchCalls = <T extends Function>(callback: T): T => {
-    return ((...args: any[]) => {
+  const batchCalls = <T extends unknown[]>(
+    callback: BatchCallsCallback<T>,
+  ): BatchCallsCallback<T> => {
+    return (...args) => {
       schedule(() => {
         callback(...args)
       })
-    }) as any
+    }
   }
 
   const flush = (): void => {

packages/query-core/src/query.ts

@@ -387,7 +387,9 @@ export class Query<
     // Create fetch function
     const fetchFn = () => {
       if (!this.options.queryFn) {
-        return Promise.reject(new Error('Missing queryFn'))
+        return Promise.reject(
+          new Error(`Missing queryFn: '${this.options.queryHash}'`),
+        )
       }
       this.#abortSignalConsumed = false
       return this.options.queryFn(

packages/query-core/src/queryCache.ts

@@ -68,7 +68,7 @@ interface NotifyEventQueryObserverOptionsUpdated extends NotifyEvent {
   observer: QueryObserver<any, any, any, any, any>
 }
 
-type QueryCacheNotifyEvent =
+export type QueryCacheNotifyEvent =
   | NotifyEventQueryAdded
   | NotifyEventQueryRemoved
   | NotifyEventQueryUpdated

packages/query-core/src/tests/infiniteQueryBehavior.test.tsx

@@ -1,14 +1,16 @@
 import { waitFor } from '@testing-library/react'
-import type { QueryClient, InfiniteQueryObserverResult } from '..'
+import type { QueryClient, QueryCache, InfiniteQueryObserverResult } from '..'
 import { InfiniteQueryObserver, CancelledError } from '..'
 import { createQueryClient, queryKey, sleep } from './utils'
 import { vi } from 'vitest'
 
 describe('InfiniteQueryBehavior', () => {
   let queryClient: QueryClient
+  let queryCache: QueryCache
 
   beforeEach(() => {
     queryClient = createQueryClient()
+    queryCache = queryClient.getQueryCache()
     queryClient.mount()
   })
 
@@ -35,9 +37,10 @@ describe('InfiniteQueryBehavior', () => {
     })
 
     await waitFor(() => {
+      const query = queryCache.find({ queryKey: key })!
       return expect(observerResult).toMatchObject({
         isError: true,
-        error: new Error('Missing queryFn'),
+        error: new Error(`Missing queryFn: '${query.queryHash}'`),
       })
     })
 

packages/query-core/src/tests/notifyManager.test.tsx

@@ -49,4 +49,19 @@ describe('notifyManager', () => {
 
     expect(notifySpy).toHaveBeenCalledTimes(1)
   })
+
+  it('typedefs should catch proper signatures', async () => {
+    const notifyManagerTest = createNotifyManager()
+
+    // we define some fn with its signature:
+    const fn: (a: string, b: number) => string = (a, b) => a + b
+
+    //now somefn expect to be called with args [a: string, b: number]
+    const someFn = notifyManagerTest.batchCalls(fn)
+
+    someFn('im happy', 4)
+
+    //@ts-expect-error
+    someFn('im not happy', false)
+  })
 })