@tanstack/react-query 5.45.1 → 5.47.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/legacy/index.cjs +5 -0
- package/build/legacy/index.cjs.map +1 -1
- package/build/legacy/index.d.cts +1 -0
- package/build/legacy/index.d.ts +1 -0
- package/build/legacy/index.js +3 -0
- package/build/legacy/index.js.map +1 -1
- package/build/legacy/prefetch.cjs +45 -0
- package/build/legacy/prefetch.cjs.map +1 -0
- package/build/legacy/prefetch.d.cts +6 -0
- package/build/legacy/prefetch.d.ts +6 -0
- package/build/legacy/prefetch.js +19 -0
- package/build/legacy/prefetch.js.map +1 -0
- package/build/modern/index.cjs +5 -0
- package/build/modern/index.cjs.map +1 -1
- package/build/modern/index.d.cts +1 -0
- package/build/modern/index.d.ts +1 -0
- package/build/modern/index.js +3 -0
- package/build/modern/index.js.map +1 -1
- package/build/modern/prefetch.cjs +45 -0
- package/build/modern/prefetch.cjs.map +1 -0
- package/build/modern/prefetch.d.cts +6 -0
- package/build/modern/prefetch.d.ts +6 -0
- package/build/modern/prefetch.js +19 -0
- package/build/modern/prefetch.js.map +1 -0
- package/build/query-codemods/tsconfig.json +4 -1
- package/package.json +2 -2
- package/src/__tests__/prefetch.test-d.tsx +80 -0
- package/src/__tests__/prefetch.test.tsx +434 -0
- package/src/index.ts +1 -0
- package/src/prefetch.ts +42 -0
package/build/legacy/index.cjs
CHANGED
|
@@ -34,6 +34,8 @@ __export(src_exports, {
|
|
|
34
34
|
useIsRestoring: () => import_isRestoring.useIsRestoring,
|
|
35
35
|
useMutation: () => import_useMutation.useMutation,
|
|
36
36
|
useMutationState: () => import_useMutationState.useMutationState,
|
|
37
|
+
usePrefetchInfiniteQuery: () => import_prefetch.usePrefetchInfiniteQuery,
|
|
38
|
+
usePrefetchQuery: () => import_prefetch.usePrefetchQuery,
|
|
37
39
|
useQueries: () => import_useQueries.useQueries,
|
|
38
40
|
useQuery: () => import_useQuery.useQuery,
|
|
39
41
|
useQueryClient: () => import_QueryClientProvider.useQueryClient,
|
|
@@ -50,6 +52,7 @@ var import_useQuery = require("./useQuery.cjs");
|
|
|
50
52
|
var import_useSuspenseQuery = require("./useSuspenseQuery.cjs");
|
|
51
53
|
var import_useSuspenseInfiniteQuery = require("./useSuspenseInfiniteQuery.cjs");
|
|
52
54
|
var import_useSuspenseQueries = require("./useSuspenseQueries.cjs");
|
|
55
|
+
var import_prefetch = require("./prefetch.cjs");
|
|
53
56
|
var import_queryOptions = require("./queryOptions.cjs");
|
|
54
57
|
var import_infiniteQueryOptions = require("./infiniteQueryOptions.cjs");
|
|
55
58
|
var import_QueryClientProvider = require("./QueryClientProvider.cjs");
|
|
@@ -75,6 +78,8 @@ var import_isRestoring = require("./isRestoring.cjs");
|
|
|
75
78
|
useIsRestoring,
|
|
76
79
|
useMutation,
|
|
77
80
|
useMutationState,
|
|
81
|
+
usePrefetchInfiniteQuery,
|
|
82
|
+
usePrefetchQuery,
|
|
78
83
|
useQueries,
|
|
79
84
|
useQuery,
|
|
80
85
|
useQueryClient,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAc,iCAHd;AAMA,wBAAc,wBANd;AAOA,wBAA2B;AAE3B,sBAAyB;AACzB,8BAAiC;AACjC,sCAAyC;AACzC,gCAAmC;AAKnC,0BAA6B;AAK7B,kCAAqC;AAKrC,iCAIO;AAGP,+BAAkC;AAElC,qCAGO;AACP,2BAA8B;AAC9B,8BAAgD;AAChD,yBAA4B;AAC5B,8BAAiC;AACjC,yBAAoD;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { usePrefetchQuery, usePrefetchInfiniteQuery } from './prefetch'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAc,iCAHd;AAMA,wBAAc,wBANd;AAOA,wBAA2B;AAE3B,sBAAyB;AACzB,8BAAiC;AACjC,sCAAyC;AACzC,gCAAmC;AAKnC,sBAA2D;AAC3D,0BAA6B;AAK7B,kCAAqC;AAKrC,iCAIO;AAGP,+BAAkC;AAElC,qCAGO;AACP,2BAA8B;AAC9B,8BAAgD;AAChD,yBAA4B;AAC5B,8BAAiC;AACjC,yBAAoD;","names":[]}
|
package/build/legacy/index.d.cts
CHANGED
|
@@ -5,6 +5,7 @@ export { useQuery } from './useQuery.cjs';
|
|
|
5
5
|
export { useSuspenseQuery } from './useSuspenseQuery.cjs';
|
|
6
6
|
export { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery.cjs';
|
|
7
7
|
export { SuspenseQueriesOptions, SuspenseQueriesResults, useSuspenseQueries } from './useSuspenseQueries.cjs';
|
|
8
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery } from './prefetch.cjs';
|
|
8
9
|
export { DefinedInitialDataOptions, UndefinedInitialDataOptions, queryOptions } from './queryOptions.cjs';
|
|
9
10
|
export { DefinedInitialDataInfiniteOptions, UndefinedInitialDataInfiniteOptions, infiniteQueryOptions } from './infiniteQueryOptions.cjs';
|
|
10
11
|
export { QueryClientContext, QueryClientProvider, QueryClientProviderProps, useQueryClient } from './QueryClientProvider.cjs';
|
package/build/legacy/index.d.ts
CHANGED
|
@@ -5,6 +5,7 @@ export { useQuery } from './useQuery.js';
|
|
|
5
5
|
export { useSuspenseQuery } from './useSuspenseQuery.js';
|
|
6
6
|
export { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery.js';
|
|
7
7
|
export { SuspenseQueriesOptions, SuspenseQueriesResults, useSuspenseQueries } from './useSuspenseQueries.js';
|
|
8
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery } from './prefetch.js';
|
|
8
9
|
export { DefinedInitialDataOptions, UndefinedInitialDataOptions, queryOptions } from './queryOptions.js';
|
|
9
10
|
export { DefinedInitialDataInfiniteOptions, UndefinedInitialDataInfiniteOptions, infiniteQueryOptions } from './infiniteQueryOptions.js';
|
|
10
11
|
export { QueryClientContext, QueryClientProvider, QueryClientProviderProps, useQueryClient } from './QueryClientProvider.js';
|
package/build/legacy/index.js
CHANGED
|
@@ -6,6 +6,7 @@ import { useQuery } from "./useQuery.js";
|
|
|
6
6
|
import { useSuspenseQuery } from "./useSuspenseQuery.js";
|
|
7
7
|
import { useSuspenseInfiniteQuery } from "./useSuspenseInfiniteQuery.js";
|
|
8
8
|
import { useSuspenseQueries } from "./useSuspenseQueries.js";
|
|
9
|
+
import { usePrefetchQuery, usePrefetchInfiniteQuery } from "./prefetch.js";
|
|
9
10
|
import { queryOptions } from "./queryOptions.js";
|
|
10
11
|
import { infiniteQueryOptions } from "./infiniteQueryOptions.js";
|
|
11
12
|
import {
|
|
@@ -37,6 +38,8 @@ export {
|
|
|
37
38
|
useIsRestoring,
|
|
38
39
|
useMutation,
|
|
39
40
|
useMutationState,
|
|
41
|
+
usePrefetchInfiniteQuery,
|
|
42
|
+
usePrefetchQuery,
|
|
40
43
|
useQueries,
|
|
41
44
|
useQuery,
|
|
42
45
|
useQueryClient,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";AAGA,cAAc;AAGd,cAAc;AACd,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,gCAAgC;AACzC,SAAS,0BAA0B;AAKnC,SAAS,oBAAoB;AAK7B,SAAS,4BAA4B;AAKrC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,SAAS,yBAAyB;AAElC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,qBAAqB;AAC9B,SAAS,eAAe,wBAAwB;AAChD,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,gBAAgB,2BAA2B;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { usePrefetchQuery, usePrefetchInfiniteQuery } from './prefetch'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";AAGA,cAAc;AAGd,cAAc;AACd,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,gCAAgC;AACzC,SAAS,0BAA0B;AAKnC,SAAS,kBAAkB,gCAAgC;AAC3D,SAAS,oBAAoB;AAK7B,SAAS,4BAA4B;AAKrC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,SAAS,yBAAyB;AAElC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,qBAAqB;AAC9B,SAAS,eAAe,wBAAwB;AAChD,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,gBAAgB,2BAA2B;","names":[]}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/prefetch.ts
|
|
21
|
+
var prefetch_exports = {};
|
|
22
|
+
__export(prefetch_exports, {
|
|
23
|
+
usePrefetchInfiniteQuery: () => usePrefetchInfiniteQuery,
|
|
24
|
+
usePrefetchQuery: () => usePrefetchQuery
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(prefetch_exports);
|
|
27
|
+
var import_QueryClientProvider = require("./QueryClientProvider.cjs");
|
|
28
|
+
function usePrefetchQuery(options) {
|
|
29
|
+
const queryClient = (0, import_QueryClientProvider.useQueryClient)();
|
|
30
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
31
|
+
queryClient.prefetchQuery(options);
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
function usePrefetchInfiniteQuery(options) {
|
|
35
|
+
const queryClient = (0, import_QueryClientProvider.useQueryClient)();
|
|
36
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
37
|
+
queryClient.prefetchInfiniteQuery(options);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
41
|
+
0 && (module.exports = {
|
|
42
|
+
usePrefetchInfiniteQuery,
|
|
43
|
+
usePrefetchQuery
|
|
44
|
+
});
|
|
45
|
+
//# sourceMappingURL=prefetch.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/prefetch.ts"],"sourcesContent":["import { useQueryClient } from './QueryClientProvider'\nimport type {\n DefaultError,\n FetchInfiniteQueryOptions,\n FetchQueryOptions,\n QueryKey,\n} from '@tanstack/query-core'\n\nexport function usePrefetchQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchQuery(options)\n }\n}\n\nexport function usePrefetchInfiniteQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n options: FetchInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchInfiniteQuery(options)\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCAA+B;AAQxB,SAAS,iBAKd,SAAoE;AACpE,QAAM,kBAAc,2CAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,cAAc,OAAO;AAAA,EACnC;AACF;AAEO,SAAS,yBAOd,SAOA;AACA,QAAM,kBAAc,2CAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,sBAAsB,OAAO;AAAA,EAC3C;AACF;","names":[]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { DefaultError, QueryKey, FetchQueryOptions, FetchInfiniteQueryOptions } from '@tanstack/query-core';
|
|
2
|
+
|
|
3
|
+
declare function usePrefetchQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>): void;
|
|
4
|
+
declare function usePrefetchInfiniteQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(options: FetchInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): void;
|
|
5
|
+
|
|
6
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { DefaultError, QueryKey, FetchQueryOptions, FetchInfiniteQueryOptions } from '@tanstack/query-core';
|
|
2
|
+
|
|
3
|
+
declare function usePrefetchQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>): void;
|
|
4
|
+
declare function usePrefetchInfiniteQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(options: FetchInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): void;
|
|
5
|
+
|
|
6
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
// src/prefetch.ts
|
|
2
|
+
import { useQueryClient } from "./QueryClientProvider.js";
|
|
3
|
+
function usePrefetchQuery(options) {
|
|
4
|
+
const queryClient = useQueryClient();
|
|
5
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
6
|
+
queryClient.prefetchQuery(options);
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
function usePrefetchInfiniteQuery(options) {
|
|
10
|
+
const queryClient = useQueryClient();
|
|
11
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
12
|
+
queryClient.prefetchInfiniteQuery(options);
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
export {
|
|
16
|
+
usePrefetchInfiniteQuery,
|
|
17
|
+
usePrefetchQuery
|
|
18
|
+
};
|
|
19
|
+
//# sourceMappingURL=prefetch.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/prefetch.ts"],"sourcesContent":["import { useQueryClient } from './QueryClientProvider'\nimport type {\n DefaultError,\n FetchInfiniteQueryOptions,\n FetchQueryOptions,\n QueryKey,\n} from '@tanstack/query-core'\n\nexport function usePrefetchQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchQuery(options)\n }\n}\n\nexport function usePrefetchInfiniteQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n options: FetchInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchInfiniteQuery(options)\n }\n}\n"],"mappings":";AAAA,SAAS,sBAAsB;AAQxB,SAAS,iBAKd,SAAoE;AACpE,QAAM,cAAc,eAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,cAAc,OAAO;AAAA,EACnC;AACF;AAEO,SAAS,yBAOd,SAOA;AACA,QAAM,cAAc,eAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,sBAAsB,OAAO;AAAA,EAC3C;AACF;","names":[]}
|
package/build/modern/index.cjs
CHANGED
|
@@ -34,6 +34,8 @@ __export(src_exports, {
|
|
|
34
34
|
useIsRestoring: () => import_isRestoring.useIsRestoring,
|
|
35
35
|
useMutation: () => import_useMutation.useMutation,
|
|
36
36
|
useMutationState: () => import_useMutationState.useMutationState,
|
|
37
|
+
usePrefetchInfiniteQuery: () => import_prefetch.usePrefetchInfiniteQuery,
|
|
38
|
+
usePrefetchQuery: () => import_prefetch.usePrefetchQuery,
|
|
37
39
|
useQueries: () => import_useQueries.useQueries,
|
|
38
40
|
useQuery: () => import_useQuery.useQuery,
|
|
39
41
|
useQueryClient: () => import_QueryClientProvider.useQueryClient,
|
|
@@ -50,6 +52,7 @@ var import_useQuery = require("./useQuery.cjs");
|
|
|
50
52
|
var import_useSuspenseQuery = require("./useSuspenseQuery.cjs");
|
|
51
53
|
var import_useSuspenseInfiniteQuery = require("./useSuspenseInfiniteQuery.cjs");
|
|
52
54
|
var import_useSuspenseQueries = require("./useSuspenseQueries.cjs");
|
|
55
|
+
var import_prefetch = require("./prefetch.cjs");
|
|
53
56
|
var import_queryOptions = require("./queryOptions.cjs");
|
|
54
57
|
var import_infiniteQueryOptions = require("./infiniteQueryOptions.cjs");
|
|
55
58
|
var import_QueryClientProvider = require("./QueryClientProvider.cjs");
|
|
@@ -75,6 +78,8 @@ var import_isRestoring = require("./isRestoring.cjs");
|
|
|
75
78
|
useIsRestoring,
|
|
76
79
|
useMutation,
|
|
77
80
|
useMutationState,
|
|
81
|
+
usePrefetchInfiniteQuery,
|
|
82
|
+
usePrefetchQuery,
|
|
78
83
|
useQueries,
|
|
79
84
|
useQuery,
|
|
80
85
|
useQueryClient,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAc,iCAHd;AAMA,wBAAc,wBANd;AAOA,wBAA2B;AAE3B,sBAAyB;AACzB,8BAAiC;AACjC,sCAAyC;AACzC,gCAAmC;AAKnC,0BAA6B;AAK7B,kCAAqC;AAKrC,iCAIO;AAGP,+BAAkC;AAElC,qCAGO;AACP,2BAA8B;AAC9B,8BAAgD;AAChD,yBAA4B;AAC5B,8BAAiC;AACjC,yBAAoD;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { usePrefetchQuery, usePrefetchInfiniteQuery } from './prefetch'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,wBAAc,iCAHd;AAMA,wBAAc,wBANd;AAOA,wBAA2B;AAE3B,sBAAyB;AACzB,8BAAiC;AACjC,sCAAyC;AACzC,gCAAmC;AAKnC,sBAA2D;AAC3D,0BAA6B;AAK7B,kCAAqC;AAKrC,iCAIO;AAGP,+BAAkC;AAElC,qCAGO;AACP,2BAA8B;AAC9B,8BAAgD;AAChD,yBAA4B;AAC5B,8BAAiC;AACjC,yBAAoD;","names":[]}
|
package/build/modern/index.d.cts
CHANGED
|
@@ -5,6 +5,7 @@ export { useQuery } from './useQuery.cjs';
|
|
|
5
5
|
export { useSuspenseQuery } from './useSuspenseQuery.cjs';
|
|
6
6
|
export { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery.cjs';
|
|
7
7
|
export { SuspenseQueriesOptions, SuspenseQueriesResults, useSuspenseQueries } from './useSuspenseQueries.cjs';
|
|
8
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery } from './prefetch.cjs';
|
|
8
9
|
export { DefinedInitialDataOptions, UndefinedInitialDataOptions, queryOptions } from './queryOptions.cjs';
|
|
9
10
|
export { DefinedInitialDataInfiniteOptions, UndefinedInitialDataInfiniteOptions, infiniteQueryOptions } from './infiniteQueryOptions.cjs';
|
|
10
11
|
export { QueryClientContext, QueryClientProvider, QueryClientProviderProps, useQueryClient } from './QueryClientProvider.cjs';
|
package/build/modern/index.d.ts
CHANGED
|
@@ -5,6 +5,7 @@ export { useQuery } from './useQuery.js';
|
|
|
5
5
|
export { useSuspenseQuery } from './useSuspenseQuery.js';
|
|
6
6
|
export { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery.js';
|
|
7
7
|
export { SuspenseQueriesOptions, SuspenseQueriesResults, useSuspenseQueries } from './useSuspenseQueries.js';
|
|
8
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery } from './prefetch.js';
|
|
8
9
|
export { DefinedInitialDataOptions, UndefinedInitialDataOptions, queryOptions } from './queryOptions.js';
|
|
9
10
|
export { DefinedInitialDataInfiniteOptions, UndefinedInitialDataInfiniteOptions, infiniteQueryOptions } from './infiniteQueryOptions.js';
|
|
10
11
|
export { QueryClientContext, QueryClientProvider, QueryClientProviderProps, useQueryClient } from './QueryClientProvider.js';
|
package/build/modern/index.js
CHANGED
|
@@ -6,6 +6,7 @@ import { useQuery } from "./useQuery.js";
|
|
|
6
6
|
import { useSuspenseQuery } from "./useSuspenseQuery.js";
|
|
7
7
|
import { useSuspenseInfiniteQuery } from "./useSuspenseInfiniteQuery.js";
|
|
8
8
|
import { useSuspenseQueries } from "./useSuspenseQueries.js";
|
|
9
|
+
import { usePrefetchQuery, usePrefetchInfiniteQuery } from "./prefetch.js";
|
|
9
10
|
import { queryOptions } from "./queryOptions.js";
|
|
10
11
|
import { infiniteQueryOptions } from "./infiniteQueryOptions.js";
|
|
11
12
|
import {
|
|
@@ -37,6 +38,8 @@ export {
|
|
|
37
38
|
useIsRestoring,
|
|
38
39
|
useMutation,
|
|
39
40
|
useMutationState,
|
|
41
|
+
usePrefetchInfiniteQuery,
|
|
42
|
+
usePrefetchQuery,
|
|
40
43
|
useQueries,
|
|
41
44
|
useQuery,
|
|
42
45
|
useQueryClient,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";AAGA,cAAc;AAGd,cAAc;AACd,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,gCAAgC;AACzC,SAAS,0BAA0B;AAKnC,SAAS,oBAAoB;AAK7B,SAAS,4BAA4B;AAKrC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,SAAS,yBAAyB;AAElC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,qBAAqB;AAC9B,SAAS,eAAe,wBAAwB;AAChD,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,gBAAgB,2BAA2B;","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/* istanbul ignore file */\n\n// Re-export core\nexport * from '@tanstack/query-core'\n\n// React Query\nexport * from './types'\nexport { useQueries } from './useQueries'\nexport type { QueriesResults, QueriesOptions } from './useQueries'\nexport { useQuery } from './useQuery'\nexport { useSuspenseQuery } from './useSuspenseQuery'\nexport { useSuspenseInfiniteQuery } from './useSuspenseInfiniteQuery'\nexport { useSuspenseQueries } from './useSuspenseQueries'\nexport type {\n SuspenseQueriesResults,\n SuspenseQueriesOptions,\n} from './useSuspenseQueries'\nexport { usePrefetchQuery, usePrefetchInfiniteQuery } from './prefetch'\nexport { queryOptions } from './queryOptions'\nexport type {\n DefinedInitialDataOptions,\n UndefinedInitialDataOptions,\n} from './queryOptions'\nexport { infiniteQueryOptions } from './infiniteQueryOptions'\nexport type {\n DefinedInitialDataInfiniteOptions,\n UndefinedInitialDataInfiniteOptions,\n} from './infiniteQueryOptions'\nexport {\n QueryClientContext,\n QueryClientProvider,\n useQueryClient,\n} from './QueryClientProvider'\nexport type { QueryClientProviderProps } from './QueryClientProvider'\nexport type { QueryErrorResetBoundaryProps } from './QueryErrorResetBoundary'\nexport { HydrationBoundary } from './HydrationBoundary'\nexport type { HydrationBoundaryProps } from './HydrationBoundary'\nexport {\n QueryErrorResetBoundary,\n useQueryErrorResetBoundary,\n} from './QueryErrorResetBoundary'\nexport { useIsFetching } from './useIsFetching'\nexport { useIsMutating, useMutationState } from './useMutationState'\nexport { useMutation } from './useMutation'\nexport { useInfiniteQuery } from './useInfiniteQuery'\nexport { useIsRestoring, IsRestoringProvider } from './isRestoring'\n"],"mappings":";AAGA,cAAc;AAGd,cAAc;AACd,SAAS,kBAAkB;AAE3B,SAAS,gBAAgB;AACzB,SAAS,wBAAwB;AACjC,SAAS,gCAAgC;AACzC,SAAS,0BAA0B;AAKnC,SAAS,kBAAkB,gCAAgC;AAC3D,SAAS,oBAAoB;AAK7B,SAAS,4BAA4B;AAKrC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAGP,SAAS,yBAAyB;AAElC;AAAA,EACE;AAAA,EACA;AAAA,OACK;AACP,SAAS,qBAAqB;AAC9B,SAAS,eAAe,wBAAwB;AAChD,SAAS,mBAAmB;AAC5B,SAAS,wBAAwB;AACjC,SAAS,gBAAgB,2BAA2B;","names":[]}
|
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __export = (target, all) => {
|
|
7
|
+
for (var name in all)
|
|
8
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
+
};
|
|
10
|
+
var __copyProps = (to, from, except, desc) => {
|
|
11
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
+
for (let key of __getOwnPropNames(from))
|
|
13
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
+
}
|
|
16
|
+
return to;
|
|
17
|
+
};
|
|
18
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
+
|
|
20
|
+
// src/prefetch.ts
|
|
21
|
+
var prefetch_exports = {};
|
|
22
|
+
__export(prefetch_exports, {
|
|
23
|
+
usePrefetchInfiniteQuery: () => usePrefetchInfiniteQuery,
|
|
24
|
+
usePrefetchQuery: () => usePrefetchQuery
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(prefetch_exports);
|
|
27
|
+
var import_QueryClientProvider = require("./QueryClientProvider.cjs");
|
|
28
|
+
function usePrefetchQuery(options) {
|
|
29
|
+
const queryClient = (0, import_QueryClientProvider.useQueryClient)();
|
|
30
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
31
|
+
queryClient.prefetchQuery(options);
|
|
32
|
+
}
|
|
33
|
+
}
|
|
34
|
+
function usePrefetchInfiniteQuery(options) {
|
|
35
|
+
const queryClient = (0, import_QueryClientProvider.useQueryClient)();
|
|
36
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
37
|
+
queryClient.prefetchInfiniteQuery(options);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
40
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
41
|
+
0 && (module.exports = {
|
|
42
|
+
usePrefetchInfiniteQuery,
|
|
43
|
+
usePrefetchQuery
|
|
44
|
+
});
|
|
45
|
+
//# sourceMappingURL=prefetch.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/prefetch.ts"],"sourcesContent":["import { useQueryClient } from './QueryClientProvider'\nimport type {\n DefaultError,\n FetchInfiniteQueryOptions,\n FetchQueryOptions,\n QueryKey,\n} from '@tanstack/query-core'\n\nexport function usePrefetchQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchQuery(options)\n }\n}\n\nexport function usePrefetchInfiniteQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n options: FetchInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchInfiniteQuery(options)\n }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,iCAA+B;AAQxB,SAAS,iBAKd,SAAoE;AACpE,QAAM,kBAAc,2CAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,cAAc,OAAO;AAAA,EACnC;AACF;AAEO,SAAS,yBAOd,SAOA;AACA,QAAM,kBAAc,2CAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,sBAAsB,OAAO;AAAA,EAC3C;AACF;","names":[]}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { DefaultError, QueryKey, FetchQueryOptions, FetchInfiniteQueryOptions } from '@tanstack/query-core';
|
|
2
|
+
|
|
3
|
+
declare function usePrefetchQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>): void;
|
|
4
|
+
declare function usePrefetchInfiniteQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(options: FetchInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): void;
|
|
5
|
+
|
|
6
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery };
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
import { DefaultError, QueryKey, FetchQueryOptions, FetchInfiniteQueryOptions } from '@tanstack/query-core';
|
|
2
|
+
|
|
3
|
+
declare function usePrefetchQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>): void;
|
|
4
|
+
declare function usePrefetchInfiniteQuery<TQueryFnData = unknown, TError = DefaultError, TData = TQueryFnData, TQueryKey extends QueryKey = QueryKey, TPageParam = unknown>(options: FetchInfiniteQueryOptions<TQueryFnData, TError, TData, TQueryKey, TPageParam>): void;
|
|
5
|
+
|
|
6
|
+
export { usePrefetchInfiniteQuery, usePrefetchQuery };
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
// src/prefetch.ts
|
|
2
|
+
import { useQueryClient } from "./QueryClientProvider.js";
|
|
3
|
+
function usePrefetchQuery(options) {
|
|
4
|
+
const queryClient = useQueryClient();
|
|
5
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
6
|
+
queryClient.prefetchQuery(options);
|
|
7
|
+
}
|
|
8
|
+
}
|
|
9
|
+
function usePrefetchInfiniteQuery(options) {
|
|
10
|
+
const queryClient = useQueryClient();
|
|
11
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
12
|
+
queryClient.prefetchInfiniteQuery(options);
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
export {
|
|
16
|
+
usePrefetchInfiniteQuery,
|
|
17
|
+
usePrefetchQuery
|
|
18
|
+
};
|
|
19
|
+
//# sourceMappingURL=prefetch.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../src/prefetch.ts"],"sourcesContent":["import { useQueryClient } from './QueryClientProvider'\nimport type {\n DefaultError,\n FetchInfiniteQueryOptions,\n FetchQueryOptions,\n QueryKey,\n} from '@tanstack/query-core'\n\nexport function usePrefetchQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchQuery(options)\n }\n}\n\nexport function usePrefetchInfiniteQuery<\n TQueryFnData = unknown,\n TError = DefaultError,\n TData = TQueryFnData,\n TQueryKey extends QueryKey = QueryKey,\n TPageParam = unknown,\n>(\n options: FetchInfiniteQueryOptions<\n TQueryFnData,\n TError,\n TData,\n TQueryKey,\n TPageParam\n >,\n) {\n const queryClient = useQueryClient()\n\n if (!queryClient.getQueryState(options.queryKey)) {\n queryClient.prefetchInfiniteQuery(options)\n }\n}\n"],"mappings":";AAAA,SAAS,sBAAsB;AAQxB,SAAS,iBAKd,SAAoE;AACpE,QAAM,cAAc,eAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,cAAc,OAAO;AAAA,EACnC;AACF;AAEO,SAAS,yBAOd,SAOA;AACA,QAAM,cAAc,eAAe;AAEnC,MAAI,CAAC,YAAY,cAAc,QAAQ,QAAQ,GAAG;AAChD,gBAAY,sBAAsB,OAAO;AAAA,EAC3C;AACF;","names":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/react-query",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.47.0",
|
|
4
4
|
"description": "Hooks for managing, caching and syncing asynchronous and remote data in React",
|
|
5
5
|
"author": "tannerlinsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
"!build/codemods/**/__tests__"
|
|
42
42
|
],
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@tanstack/query-core": "5.
|
|
44
|
+
"@tanstack/query-core": "5.47.0"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
47
|
"@types/react": "npm:types-react@rc",
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { describe, expectTypeOf, it } from 'vitest'
|
|
2
|
+
import { usePrefetchInfiniteQuery, usePrefetchQuery } from '../prefetch'
|
|
3
|
+
|
|
4
|
+
describe('usePrefetchQuery', () => {
|
|
5
|
+
it('should return nothing', () => {
|
|
6
|
+
const result = usePrefetchQuery({
|
|
7
|
+
queryKey: ['key'],
|
|
8
|
+
queryFn: () => Promise.resolve(5),
|
|
9
|
+
})
|
|
10
|
+
|
|
11
|
+
expectTypeOf(result).toEqualTypeOf<void>()
|
|
12
|
+
})
|
|
13
|
+
|
|
14
|
+
it('should not allow refetchInterval, enabled or throwOnError options', () => {
|
|
15
|
+
usePrefetchQuery({
|
|
16
|
+
queryKey: ['key'],
|
|
17
|
+
queryFn: () => Promise.resolve(5),
|
|
18
|
+
// @ts-expect-error TS2345
|
|
19
|
+
refetchInterval: 1000,
|
|
20
|
+
})
|
|
21
|
+
|
|
22
|
+
usePrefetchQuery({
|
|
23
|
+
queryKey: ['key'],
|
|
24
|
+
queryFn: () => Promise.resolve(5),
|
|
25
|
+
// @ts-expect-error TS2345
|
|
26
|
+
enabled: true,
|
|
27
|
+
})
|
|
28
|
+
|
|
29
|
+
usePrefetchQuery({
|
|
30
|
+
queryKey: ['key'],
|
|
31
|
+
queryFn: () => Promise.resolve(5),
|
|
32
|
+
// @ts-expect-error TS2345
|
|
33
|
+
throwOnError: true,
|
|
34
|
+
})
|
|
35
|
+
})
|
|
36
|
+
})
|
|
37
|
+
|
|
38
|
+
describe('useInfinitePrefetchQuery', () => {
|
|
39
|
+
it('should return nothing', () => {
|
|
40
|
+
const result = usePrefetchInfiniteQuery({
|
|
41
|
+
queryKey: ['key'],
|
|
42
|
+
queryFn: () => Promise.resolve(5),
|
|
43
|
+
initialPageParam: 1,
|
|
44
|
+
getNextPageParam: () => 1,
|
|
45
|
+
})
|
|
46
|
+
|
|
47
|
+
expectTypeOf(result).toEqualTypeOf<void>()
|
|
48
|
+
})
|
|
49
|
+
|
|
50
|
+
it('should require initialPageParam and getNextPageParam', () => {
|
|
51
|
+
// @ts-expect-error TS2345
|
|
52
|
+
usePrefetchInfiniteQuery({
|
|
53
|
+
queryKey: ['key'],
|
|
54
|
+
queryFn: () => Promise.resolve(5),
|
|
55
|
+
})
|
|
56
|
+
})
|
|
57
|
+
|
|
58
|
+
it('should not allow refetchInterval, enabled or throwOnError options', () => {
|
|
59
|
+
usePrefetchQuery({
|
|
60
|
+
queryKey: ['key'],
|
|
61
|
+
queryFn: () => Promise.resolve(5),
|
|
62
|
+
// @ts-expect-error TS2345
|
|
63
|
+
refetchInterval: 1000,
|
|
64
|
+
})
|
|
65
|
+
|
|
66
|
+
usePrefetchQuery({
|
|
67
|
+
queryKey: ['key'],
|
|
68
|
+
queryFn: () => Promise.resolve(5),
|
|
69
|
+
// @ts-expect-error TS2345
|
|
70
|
+
enabled: true,
|
|
71
|
+
})
|
|
72
|
+
|
|
73
|
+
usePrefetchQuery({
|
|
74
|
+
queryKey: ['key'],
|
|
75
|
+
queryFn: () => Promise.resolve(5),
|
|
76
|
+
// @ts-expect-error TS2345
|
|
77
|
+
throwOnError: true,
|
|
78
|
+
})
|
|
79
|
+
})
|
|
80
|
+
})
|
|
@@ -0,0 +1,434 @@
|
|
|
1
|
+
import { describe, expect, it, vi } from 'vitest'
|
|
2
|
+
import React from 'react'
|
|
3
|
+
import { fireEvent, waitFor } from '@testing-library/react'
|
|
4
|
+
import { ErrorBoundary } from 'react-error-boundary'
|
|
5
|
+
import {
|
|
6
|
+
QueryCache,
|
|
7
|
+
usePrefetchInfiniteQuery,
|
|
8
|
+
usePrefetchQuery,
|
|
9
|
+
useQueryErrorResetBoundary,
|
|
10
|
+
useSuspenseInfiniteQuery,
|
|
11
|
+
useSuspenseQuery,
|
|
12
|
+
} from '..'
|
|
13
|
+
import { createQueryClient, queryKey, renderWithClient, sleep } from './utils'
|
|
14
|
+
|
|
15
|
+
import type { InfiniteData, UseInfiniteQueryOptions, UseQueryOptions } from '..'
|
|
16
|
+
import type { Mock } from 'vitest'
|
|
17
|
+
|
|
18
|
+
const generateQueryFn = (data: string) =>
|
|
19
|
+
vi.fn<any, Promise<string>>().mockImplementation(async () => {
|
|
20
|
+
await sleep(10)
|
|
21
|
+
|
|
22
|
+
return data
|
|
23
|
+
})
|
|
24
|
+
|
|
25
|
+
const generateInfiniteQueryOptions = (
|
|
26
|
+
data: Array<{ data: string; currentPage: number; totalPages: number }>,
|
|
27
|
+
) => {
|
|
28
|
+
let currentPage = 0
|
|
29
|
+
|
|
30
|
+
return {
|
|
31
|
+
queryFn: vi
|
|
32
|
+
.fn<any, Promise<(typeof data)[number]>>()
|
|
33
|
+
.mockImplementation(async () => {
|
|
34
|
+
const currentPageData = data[currentPage]
|
|
35
|
+
if (!currentPageData) {
|
|
36
|
+
throw new Error('No data defined for page ' + currentPage)
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
await sleep(10)
|
|
40
|
+
currentPage++
|
|
41
|
+
|
|
42
|
+
return currentPageData
|
|
43
|
+
}),
|
|
44
|
+
initialPageParam: 1,
|
|
45
|
+
getNextPageParam: (lastPage: (typeof data)[number]) =>
|
|
46
|
+
lastPage.currentPage === lastPage.totalPages
|
|
47
|
+
? undefined
|
|
48
|
+
: lastPage.currentPage + 1,
|
|
49
|
+
}
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
describe('usePrefetchQuery', () => {
|
|
53
|
+
const queryCache = new QueryCache()
|
|
54
|
+
const queryClient = createQueryClient({ queryCache })
|
|
55
|
+
|
|
56
|
+
function Suspended<TData = unknown>(props: {
|
|
57
|
+
queryOpts: UseQueryOptions<TData, Error, TData, Array<string>>
|
|
58
|
+
children?: React.ReactNode
|
|
59
|
+
}) {
|
|
60
|
+
const state = useSuspenseQuery(props.queryOpts)
|
|
61
|
+
|
|
62
|
+
return (
|
|
63
|
+
<div>
|
|
64
|
+
<div>data: {String(state.data)}</div>
|
|
65
|
+
{props.children}
|
|
66
|
+
</div>
|
|
67
|
+
)
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
it('should prefetch query if query state does not exist', async () => {
|
|
71
|
+
const queryOpts = {
|
|
72
|
+
queryKey: queryKey(),
|
|
73
|
+
queryFn: generateQueryFn('prefetchQuery'),
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
const componentQueryOpts = {
|
|
77
|
+
...queryOpts,
|
|
78
|
+
queryFn: generateQueryFn('useSuspenseQuery'),
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
function App() {
|
|
82
|
+
usePrefetchQuery(queryOpts)
|
|
83
|
+
|
|
84
|
+
return (
|
|
85
|
+
<React.Suspense fallback="Loading...">
|
|
86
|
+
<Suspended queryOpts={componentQueryOpts} />
|
|
87
|
+
</React.Suspense>
|
|
88
|
+
)
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
92
|
+
|
|
93
|
+
await waitFor(() => rendered.getByText('data: prefetchQuery'))
|
|
94
|
+
expect(queryOpts.queryFn).toHaveBeenCalledTimes(1)
|
|
95
|
+
})
|
|
96
|
+
|
|
97
|
+
it('should not prefetch query if query state exists', async () => {
|
|
98
|
+
const queryOpts = {
|
|
99
|
+
queryKey: queryKey(),
|
|
100
|
+
queryFn: generateQueryFn('The usePrefetchQuery hook is smart!'),
|
|
101
|
+
}
|
|
102
|
+
|
|
103
|
+
function App() {
|
|
104
|
+
usePrefetchQuery(queryOpts)
|
|
105
|
+
|
|
106
|
+
return (
|
|
107
|
+
<React.Suspense fallback="Loading...">
|
|
108
|
+
<Suspended queryOpts={queryOpts} />
|
|
109
|
+
</React.Suspense>
|
|
110
|
+
)
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
await queryClient.fetchQuery(queryOpts)
|
|
114
|
+
queryOpts.queryFn.mockClear()
|
|
115
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
116
|
+
|
|
117
|
+
expect(rendered.queryByText('fetching: true')).not.toBeInTheDocument()
|
|
118
|
+
await waitFor(() =>
|
|
119
|
+
rendered.getByText('data: The usePrefetchQuery hook is smart!'),
|
|
120
|
+
)
|
|
121
|
+
expect(queryOpts.queryFn).not.toHaveBeenCalled()
|
|
122
|
+
})
|
|
123
|
+
|
|
124
|
+
it('should let errors fall through and not refetch failed queries', async () => {
|
|
125
|
+
const queryFn = generateQueryFn('Not an error')
|
|
126
|
+
|
|
127
|
+
const queryOpts = {
|
|
128
|
+
queryKey: queryKey(),
|
|
129
|
+
queryFn,
|
|
130
|
+
}
|
|
131
|
+
|
|
132
|
+
queryFn.mockImplementationOnce(async () => {
|
|
133
|
+
await sleep(10)
|
|
134
|
+
|
|
135
|
+
throw new Error('Oops! Server error!')
|
|
136
|
+
})
|
|
137
|
+
|
|
138
|
+
function App() {
|
|
139
|
+
usePrefetchQuery(queryOpts)
|
|
140
|
+
|
|
141
|
+
return (
|
|
142
|
+
<ErrorBoundary fallbackRender={() => <div>Oops!</div>}>
|
|
143
|
+
<React.Suspense fallback="Loading...">
|
|
144
|
+
<Suspended queryOpts={queryOpts} />
|
|
145
|
+
</React.Suspense>
|
|
146
|
+
</ErrorBoundary>
|
|
147
|
+
)
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
await queryClient.prefetchQuery(queryOpts)
|
|
151
|
+
queryFn.mockClear()
|
|
152
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
153
|
+
|
|
154
|
+
await waitFor(() => rendered.getByText('Oops!'))
|
|
155
|
+
expect(rendered.queryByText('data: Not an error')).not.toBeInTheDocument()
|
|
156
|
+
expect(queryOpts.queryFn).not.toHaveBeenCalled()
|
|
157
|
+
})
|
|
158
|
+
|
|
159
|
+
it('should not create an endless loop when using inside a suspense boundary', async () => {
|
|
160
|
+
const queryFn = generateQueryFn('prefetchedQuery')
|
|
161
|
+
|
|
162
|
+
const queryOpts = {
|
|
163
|
+
queryKey: queryKey(),
|
|
164
|
+
queryFn,
|
|
165
|
+
}
|
|
166
|
+
|
|
167
|
+
function Prefetch({ children }: { children: React.ReactNode }) {
|
|
168
|
+
usePrefetchQuery(queryOpts)
|
|
169
|
+
return <>{children}</>
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
function App() {
|
|
173
|
+
return (
|
|
174
|
+
<React.Suspense>
|
|
175
|
+
<Prefetch>
|
|
176
|
+
<Suspended queryOpts={queryOpts} />
|
|
177
|
+
</Prefetch>
|
|
178
|
+
</React.Suspense>
|
|
179
|
+
)
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
183
|
+
await waitFor(() => rendered.getByText('data: prefetchedQuery'))
|
|
184
|
+
expect(queryOpts.queryFn).toHaveBeenCalledTimes(1)
|
|
185
|
+
})
|
|
186
|
+
|
|
187
|
+
it('should be able to recover from errors and try fetching again', async () => {
|
|
188
|
+
const queryFn = generateQueryFn('This is fine :dog: :fire:')
|
|
189
|
+
|
|
190
|
+
const queryOpts = {
|
|
191
|
+
queryKey: queryKey(),
|
|
192
|
+
queryFn,
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
queryFn.mockImplementationOnce(async () => {
|
|
196
|
+
await sleep(10)
|
|
197
|
+
|
|
198
|
+
throw new Error('Oops! Server error!')
|
|
199
|
+
})
|
|
200
|
+
|
|
201
|
+
function App() {
|
|
202
|
+
const { reset } = useQueryErrorResetBoundary()
|
|
203
|
+
usePrefetchQuery(queryOpts)
|
|
204
|
+
|
|
205
|
+
return (
|
|
206
|
+
<ErrorBoundary
|
|
207
|
+
onReset={reset}
|
|
208
|
+
fallbackRender={({ resetErrorBoundary }) => (
|
|
209
|
+
<div>
|
|
210
|
+
<div>Oops!</div>
|
|
211
|
+
<button onClick={resetErrorBoundary}>Try again</button>
|
|
212
|
+
</div>
|
|
213
|
+
)}
|
|
214
|
+
>
|
|
215
|
+
<React.Suspense fallback="Loading...">
|
|
216
|
+
<Suspended queryOpts={queryOpts} />
|
|
217
|
+
</React.Suspense>
|
|
218
|
+
</ErrorBoundary>
|
|
219
|
+
)
|
|
220
|
+
}
|
|
221
|
+
|
|
222
|
+
await queryClient.prefetchQuery(queryOpts)
|
|
223
|
+
queryFn.mockClear()
|
|
224
|
+
|
|
225
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
226
|
+
|
|
227
|
+
await waitFor(() => rendered.getByText('Oops!'))
|
|
228
|
+
fireEvent.click(rendered.getByText('Try again'))
|
|
229
|
+
await waitFor(() => rendered.getByText('data: This is fine :dog: :fire:'))
|
|
230
|
+
expect(queryOpts.queryFn).toHaveBeenCalledTimes(1)
|
|
231
|
+
})
|
|
232
|
+
|
|
233
|
+
it('should not create a suspense waterfall if prefetch is fired', async () => {
|
|
234
|
+
const firstQueryOpts = {
|
|
235
|
+
queryKey: queryKey(),
|
|
236
|
+
queryFn: generateQueryFn('Prefetch is nice!'),
|
|
237
|
+
}
|
|
238
|
+
|
|
239
|
+
const secondQueryOpts = {
|
|
240
|
+
queryKey: queryKey(),
|
|
241
|
+
queryFn: generateQueryFn('Prefetch is really nice!!'),
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
const thirdQueryOpts = {
|
|
245
|
+
queryKey: queryKey(),
|
|
246
|
+
queryFn: generateQueryFn('Prefetch does not create waterfalls!!'),
|
|
247
|
+
}
|
|
248
|
+
|
|
249
|
+
const Fallback = vi.fn().mockImplementation(() => <div>Loading...</div>)
|
|
250
|
+
|
|
251
|
+
function App() {
|
|
252
|
+
usePrefetchQuery(firstQueryOpts)
|
|
253
|
+
usePrefetchQuery(secondQueryOpts)
|
|
254
|
+
usePrefetchQuery(thirdQueryOpts)
|
|
255
|
+
|
|
256
|
+
return (
|
|
257
|
+
<React.Suspense fallback={<Fallback />}>
|
|
258
|
+
<Suspended queryOpts={firstQueryOpts}>
|
|
259
|
+
<Suspended queryOpts={secondQueryOpts}>
|
|
260
|
+
<Suspended queryOpts={thirdQueryOpts} />
|
|
261
|
+
</Suspended>
|
|
262
|
+
</Suspended>
|
|
263
|
+
</React.Suspense>
|
|
264
|
+
)
|
|
265
|
+
}
|
|
266
|
+
|
|
267
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
268
|
+
expect(
|
|
269
|
+
queryClient.getQueryState(firstQueryOpts.queryKey)?.fetchStatus,
|
|
270
|
+
).toBe('fetching')
|
|
271
|
+
expect(
|
|
272
|
+
queryClient.getQueryState(secondQueryOpts.queryKey)?.fetchStatus,
|
|
273
|
+
).toBe('fetching')
|
|
274
|
+
expect(
|
|
275
|
+
queryClient.getQueryState(thirdQueryOpts.queryKey)?.fetchStatus,
|
|
276
|
+
).toBe('fetching')
|
|
277
|
+
await waitFor(() => rendered.getByText('Loading...'))
|
|
278
|
+
await waitFor(() => rendered.getByText('data: Prefetch is nice!'))
|
|
279
|
+
await waitFor(() => rendered.getByText('data: Prefetch is really nice!!'))
|
|
280
|
+
await waitFor(() =>
|
|
281
|
+
rendered.getByText('data: Prefetch does not create waterfalls!!'),
|
|
282
|
+
)
|
|
283
|
+
expect(Fallback).toHaveBeenCalledTimes(1)
|
|
284
|
+
expect(firstQueryOpts.queryFn).toHaveBeenCalledTimes(1)
|
|
285
|
+
expect(secondQueryOpts.queryFn).toHaveBeenCalledTimes(1)
|
|
286
|
+
expect(thirdQueryOpts.queryFn).toHaveBeenCalledTimes(1)
|
|
287
|
+
})
|
|
288
|
+
})
|
|
289
|
+
|
|
290
|
+
describe('usePrefetchInfiniteQuery', () => {
|
|
291
|
+
const queryCache = new QueryCache()
|
|
292
|
+
const queryClient = createQueryClient({ queryCache })
|
|
293
|
+
|
|
294
|
+
const Fallback = vi.fn().mockImplementation(() => <div>Loading...</div>)
|
|
295
|
+
|
|
296
|
+
function Suspended<T = unknown>(props: {
|
|
297
|
+
queryOpts: UseInfiniteQueryOptions<
|
|
298
|
+
T,
|
|
299
|
+
Error,
|
|
300
|
+
InfiniteData<T>,
|
|
301
|
+
any,
|
|
302
|
+
Array<string>,
|
|
303
|
+
any
|
|
304
|
+
>
|
|
305
|
+
renderPage: (page: T) => React.JSX.Element
|
|
306
|
+
}) {
|
|
307
|
+
const state = useSuspenseInfiniteQuery(props.queryOpts)
|
|
308
|
+
|
|
309
|
+
return (
|
|
310
|
+
<div>
|
|
311
|
+
{state.data.pages.map((page) => props.renderPage(page))}
|
|
312
|
+
<button onClick={() => state.fetchNextPage()}>Next Page</button>
|
|
313
|
+
</div>
|
|
314
|
+
)
|
|
315
|
+
}
|
|
316
|
+
|
|
317
|
+
it('should prefetch an infinite query if query state does not exist', async () => {
|
|
318
|
+
const data = [
|
|
319
|
+
{ data: 'Do you fetch on render?', currentPage: 1, totalPages: 3 },
|
|
320
|
+
{ data: 'Or do you render as you fetch?', currentPage: 2, totalPages: 3 },
|
|
321
|
+
{
|
|
322
|
+
data: 'Either way, Tanstack Query helps you!',
|
|
323
|
+
currentPage: 3,
|
|
324
|
+
totalPages: 3,
|
|
325
|
+
},
|
|
326
|
+
]
|
|
327
|
+
|
|
328
|
+
const queryOpts = {
|
|
329
|
+
queryKey: queryKey(),
|
|
330
|
+
...generateInfiniteQueryOptions(data),
|
|
331
|
+
}
|
|
332
|
+
|
|
333
|
+
function App() {
|
|
334
|
+
usePrefetchInfiniteQuery({ ...queryOpts, pages: data.length })
|
|
335
|
+
|
|
336
|
+
return (
|
|
337
|
+
<React.Suspense fallback={<Fallback />}>
|
|
338
|
+
<Suspended
|
|
339
|
+
queryOpts={queryOpts}
|
|
340
|
+
renderPage={(page) => <div>data: {page.data}</div>}
|
|
341
|
+
/>
|
|
342
|
+
</React.Suspense>
|
|
343
|
+
)
|
|
344
|
+
}
|
|
345
|
+
|
|
346
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
347
|
+
|
|
348
|
+
await waitFor(() => rendered.getByText('data: Do you fetch on render?'))
|
|
349
|
+
fireEvent.click(rendered.getByText('Next Page'))
|
|
350
|
+
await waitFor(() =>
|
|
351
|
+
rendered.getByText('data: Or do you render as you fetch?'),
|
|
352
|
+
)
|
|
353
|
+
fireEvent.click(rendered.getByText('Next Page'))
|
|
354
|
+
await waitFor(() =>
|
|
355
|
+
rendered.getByText('data: Either way, Tanstack Query helps you!'),
|
|
356
|
+
)
|
|
357
|
+
expect(Fallback).toHaveBeenCalledTimes(1)
|
|
358
|
+
expect(queryOpts.queryFn).toHaveBeenCalledTimes(3)
|
|
359
|
+
})
|
|
360
|
+
|
|
361
|
+
it('should not display fallback if the query cache is already populated', async () => {
|
|
362
|
+
const queryOpts = {
|
|
363
|
+
queryKey: queryKey(),
|
|
364
|
+
...generateInfiniteQueryOptions([
|
|
365
|
+
{ data: 'Prefetch rocks!', currentPage: 1, totalPages: 3 },
|
|
366
|
+
{ data: 'No waterfalls, boy!', currentPage: 2, totalPages: 3 },
|
|
367
|
+
{ data: 'Tanstack Query #ftw', currentPage: 3, totalPages: 3 },
|
|
368
|
+
]),
|
|
369
|
+
}
|
|
370
|
+
|
|
371
|
+
await queryClient.prefetchInfiniteQuery({ ...queryOpts, pages: 3 })
|
|
372
|
+
;(queryOpts.queryFn as Mock).mockClear()
|
|
373
|
+
|
|
374
|
+
function App() {
|
|
375
|
+
usePrefetchInfiniteQuery(queryOpts)
|
|
376
|
+
|
|
377
|
+
return (
|
|
378
|
+
<React.Suspense fallback={<Fallback />}>
|
|
379
|
+
<Suspended
|
|
380
|
+
queryOpts={queryOpts}
|
|
381
|
+
renderPage={(page) => <div>data: {page.data}</div>}
|
|
382
|
+
/>
|
|
383
|
+
</React.Suspense>
|
|
384
|
+
)
|
|
385
|
+
}
|
|
386
|
+
|
|
387
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
388
|
+
|
|
389
|
+
await waitFor(() => rendered.getByText('data: Prefetch rocks!'))
|
|
390
|
+
fireEvent.click(rendered.getByText('Next Page'))
|
|
391
|
+
await waitFor(() => rendered.getByText('data: No waterfalls, boy!'))
|
|
392
|
+
fireEvent.click(rendered.getByText('Next Page'))
|
|
393
|
+
await waitFor(() => rendered.getByText('data: Tanstack Query #ftw'))
|
|
394
|
+
expect(queryOpts.queryFn).not.toHaveBeenCalled()
|
|
395
|
+
expect(Fallback).not.toHaveBeenCalled()
|
|
396
|
+
})
|
|
397
|
+
|
|
398
|
+
it('should not create an endless loop when using inside a suspense boundary', async () => {
|
|
399
|
+
const queryOpts = {
|
|
400
|
+
queryKey: queryKey(),
|
|
401
|
+
...generateInfiniteQueryOptions([
|
|
402
|
+
{ data: 'Infinite Page 1', currentPage: 1, totalPages: 3 },
|
|
403
|
+
{ data: 'Infinite Page 2', currentPage: 1, totalPages: 3 },
|
|
404
|
+
{ data: 'Infinite Page 3', currentPage: 1, totalPages: 3 },
|
|
405
|
+
]),
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
function Prefetch({ children }: { children: React.ReactNode }) {
|
|
409
|
+
usePrefetchInfiniteQuery(queryOpts)
|
|
410
|
+
return <>{children}</>
|
|
411
|
+
}
|
|
412
|
+
|
|
413
|
+
function App() {
|
|
414
|
+
return (
|
|
415
|
+
<React.Suspense>
|
|
416
|
+
<Prefetch>
|
|
417
|
+
<Suspended
|
|
418
|
+
queryOpts={queryOpts}
|
|
419
|
+
renderPage={(page) => <div>data: {page.data}</div>}
|
|
420
|
+
/>
|
|
421
|
+
</Prefetch>
|
|
422
|
+
</React.Suspense>
|
|
423
|
+
)
|
|
424
|
+
}
|
|
425
|
+
|
|
426
|
+
const rendered = renderWithClient(queryClient, <App />)
|
|
427
|
+
await waitFor(() => rendered.getByText('data: Infinite Page 1'))
|
|
428
|
+
fireEvent.click(rendered.getByText('Next Page'))
|
|
429
|
+
await waitFor(() => rendered.getByText('data: Infinite Page 2'))
|
|
430
|
+
fireEvent.click(rendered.getByText('Next Page'))
|
|
431
|
+
await waitFor(() => rendered.getByText('data: Infinite Page 3'))
|
|
432
|
+
expect(queryOpts.queryFn).toHaveBeenCalledTimes(3)
|
|
433
|
+
})
|
|
434
|
+
})
|
package/src/index.ts
CHANGED
|
@@ -15,6 +15,7 @@ export type {
|
|
|
15
15
|
SuspenseQueriesResults,
|
|
16
16
|
SuspenseQueriesOptions,
|
|
17
17
|
} from './useSuspenseQueries'
|
|
18
|
+
export { usePrefetchQuery, usePrefetchInfiniteQuery } from './prefetch'
|
|
18
19
|
export { queryOptions } from './queryOptions'
|
|
19
20
|
export type {
|
|
20
21
|
DefinedInitialDataOptions,
|
package/src/prefetch.ts
ADDED
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { useQueryClient } from './QueryClientProvider'
|
|
2
|
+
import type {
|
|
3
|
+
DefaultError,
|
|
4
|
+
FetchInfiniteQueryOptions,
|
|
5
|
+
FetchQueryOptions,
|
|
6
|
+
QueryKey,
|
|
7
|
+
} from '@tanstack/query-core'
|
|
8
|
+
|
|
9
|
+
export function usePrefetchQuery<
|
|
10
|
+
TQueryFnData = unknown,
|
|
11
|
+
TError = DefaultError,
|
|
12
|
+
TData = TQueryFnData,
|
|
13
|
+
TQueryKey extends QueryKey = QueryKey,
|
|
14
|
+
>(options: FetchQueryOptions<TQueryFnData, TError, TData, TQueryKey>) {
|
|
15
|
+
const queryClient = useQueryClient()
|
|
16
|
+
|
|
17
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
18
|
+
queryClient.prefetchQuery(options)
|
|
19
|
+
}
|
|
20
|
+
}
|
|
21
|
+
|
|
22
|
+
export function usePrefetchInfiniteQuery<
|
|
23
|
+
TQueryFnData = unknown,
|
|
24
|
+
TError = DefaultError,
|
|
25
|
+
TData = TQueryFnData,
|
|
26
|
+
TQueryKey extends QueryKey = QueryKey,
|
|
27
|
+
TPageParam = unknown,
|
|
28
|
+
>(
|
|
29
|
+
options: FetchInfiniteQueryOptions<
|
|
30
|
+
TQueryFnData,
|
|
31
|
+
TError,
|
|
32
|
+
TData,
|
|
33
|
+
TQueryKey,
|
|
34
|
+
TPageParam
|
|
35
|
+
>,
|
|
36
|
+
) {
|
|
37
|
+
const queryClient = useQueryClient()
|
|
38
|
+
|
|
39
|
+
if (!queryClient.getQueryState(options.queryKey)) {
|
|
40
|
+
queryClient.prefetchInfiniteQuery(options)
|
|
41
|
+
}
|
|
42
|
+
}
|