diff --git a/docs/react/guides/migrating-to-v5.md b/docs/react/guides/migrating-to-v5.md index 938b53bd0b..0ba0cfd6ba 100644 --- a/docs/react/guides/migrating-to-v5.md +++ b/docs/react/guides/migrating-to-v5.md @@ -136,6 +136,17 @@ A few notes about how codemod works: `onSuccess`, `onError` and `onSettled` have been removed from Queries. They haven't been touched for Mutations. Please see [this RFC](https://github.com/TanStack/query/discussions/5279) for motivations behind this change and what to do instead. +### The `refetchInteval` callback function only gets `query` passed + +This streamlines how callbacks are invoked (the `refetchOnWindowFocus`, `refetchOnMount` and `refetchOnReconnect` callbacks all only get the query passed as well), and it fixes some typing issues when callbacks get data transformed by `select`. + +```diff +- refetchInterval: number | false | ((data: TData | undefined, query: Query) => number | false | undefined) ++ refetchInterval: number | false | ((query: Query) => number | false | undefined) +``` + +You can still access data with `query.state.data`, however, it will not be data that has been transformed by `select`. If you need to access the transformed data, you can call the transformation again on `query.state.data`. + ### The `remove` method has been removed from useQuery Previously, remove method used to remove the query from the queryCache without informing observers about it. It was best used to remove data imperatively that is no longer needed, e.g. when logging a user out. diff --git a/docs/react/reference/useQuery.md b/docs/react/reference/useQuery.md index 1e9c80403a..96673b3806 100644 --- a/docs/react/reference/useQuery.md +++ b/docs/react/reference/useQuery.md @@ -98,10 +98,10 @@ const { - `queryKeyHashFn: (queryKey: QueryKey) => string` - Optional - If specified, this function is used to hash the `queryKey` to a string. -- `refetchInterval: number | false | ((data: TData | undefined, query: Query) => number | false | undefined)` +- `refetchInterval: number | false | ((query: Query) => number | false | undefined)` - Optional - If set to a number, all queries will continuously refetch at this frequency in milliseconds - - If set to a function, the function will be executed with the latest data and query to compute a frequency + - If set to a function, the function will be executed with the query to compute a frequency - `refetchIntervalInBackground: boolean` - Optional - If set to `true`, queries that are set to continuously refetch with a `refetchInterval` will continue to refetch while their tab/window is in the background diff --git a/packages/query-core/src/queryObserver.ts b/packages/query-core/src/queryObserver.ts index b885c125e0..c145ad2d65 100644 --- a/packages/query-core/src/queryObserver.ts +++ b/packages/query-core/src/queryObserver.ts @@ -368,10 +368,7 @@ export class QueryObserver< #computeRefetchInterval() { return ( (typeof this.options.refetchInterval === 'function' - ? this.options.refetchInterval( - this.#currentResult.data, - this.#currentQuery, - ) + ? this.options.refetchInterval(this.#currentQuery) : this.options.refetchInterval) ?? false ) } diff --git a/packages/query-core/src/types.ts b/packages/query-core/src/types.ts index 517fb38632..57a164e2b7 100644 --- a/packages/query-core/src/types.ts +++ b/packages/query-core/src/types.ts @@ -237,7 +237,6 @@ export interface QueryObserverOptions< | number | false | (( - data: TData | undefined, query: Query, ) => number | false | undefined) /** diff --git a/packages/react-query/src/__tests__/useQuery.test.tsx b/packages/react-query/src/__tests__/useQuery.test.tsx index 98b56d90d9..f72b514b7c 100644 --- a/packages/react-query/src/__tests__/useQuery.test.tsx +++ b/packages/react-query/src/__tests__/useQuery.test.tsx @@ -4146,7 +4146,7 @@ describe('useQuery', () => { await sleep(10) return count++ }, - refetchInterval: (data = 0) => (data < 2 ? 10 : false), + refetchInterval: ({ state: { data = 0 } }) => (data < 2 ? 10 : false), }) states.push(queryInfo) diff --git a/packages/react-query/src/__tests__/useQuery.types.test.tsx b/packages/react-query/src/__tests__/useQuery.types.test.tsx index eb742654e7..620c4bf470 100644 --- a/packages/react-query/src/__tests__/useQuery.types.test.tsx +++ b/packages/react-query/src/__tests__/useQuery.types.test.tsx @@ -47,13 +47,15 @@ describe('initialData', () => { it('it should be possible to define a different TData than TQueryFnData using select with queryOptions spread into useQuery', () => { doNotExecute(() => { - const options = (select?: (data: number) => TData) => - queryOptions({ - queryKey: ['key'], - queryFn: () => Promise.resolve(1), - select, - }) - const query = useQuery(options((data) => data > 1)) + const options = queryOptions({ + queryKey: ['key'], + queryFn: () => Promise.resolve(1), + }) + + const query = useQuery({ + ...options, + select: (data) => data > 1, + }) const result: Expect< Equal diff --git a/packages/solid-query/src/__tests__/createQuery.test.tsx b/packages/solid-query/src/__tests__/createQuery.test.tsx index c8e513463b..a7247d1106 100644 --- a/packages/solid-query/src/__tests__/createQuery.test.tsx +++ b/packages/solid-query/src/__tests__/createQuery.test.tsx @@ -3715,7 +3715,7 @@ describe('createQuery', () => { await sleep(10) return count++ }, - refetchInterval: (data = 0) => (data < 2 ? 10 : false), + refetchInterval: ({ state: { data = 0 } }) => (data < 2 ? 10 : false), })) createRenderEffect(() => {