@tanstack/react-query-next-experimental 5.0.0-alpha.80 → 5.0.0-alpha.84
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/lib/ReactQueryStreamedHydration.cjs.map +1 -1
- package/build/lib/ReactQueryStreamedHydration.d.ts +1 -1
- package/build/lib/ReactQueryStreamedHydration.d.ts.map +1 -1
- package/build/lib/ReactQueryStreamedHydration.js.map +1 -1
- package/build/lib/ReactQueryStreamedHydration.legacy.cjs.map +1 -1
- package/build/lib/ReactQueryStreamedHydration.legacy.js.map +1 -1
- package/package.json +3 -3
- package/src/ReactQueryStreamedHydration.tsx +7 -7
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryStreamedHydration.cjs","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport
|
|
1
|
+
{"version":3,"file":"ReactQueryStreamedHydration.cjs","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport {\n defaultShouldDehydrateQuery,\n dehydrate,\n hydrate,\n useQueryClient,\n} from '@tanstack/react-query'\nimport * as React from 'react'\nimport { createHydrationStreamProvider } from './HydrationStreamProvider'\nimport type { HydrationStreamProviderProps } from './HydrationStreamProvider'\nimport type {\n DehydrateOptions,\n DehydratedState,\n HydrateOptions,\n QueryClient,\n} from '@tanstack/react-query'\n\nconst stream = createHydrationStreamProvider<DehydratedState>()\n\n/**\n * This component is responsible for:\n * - hydrating the query client on the server\n * - dehydrating the query client on the server\n */\nexport function ReactQueryStreamedHydration(props: {\n children: React.ReactNode\n queryClient?: QueryClient\n options?: {\n hydrate?: HydrateOptions\n dehydrate?: DehydrateOptions\n }\n transformer?: HydrationStreamProviderProps<DehydratedState>['transformer']\n}) {\n const queryClient = useQueryClient(props.queryClient)\n\n /**\n * We need to track which queries were added/updated during the render\n */\n const [trackedKeys] = React.useState(() => new Set<string>())\n\n // <server only>\n if (typeof window === 'undefined') {\n // Do we need to care about unsubscribing? I don't think so to be honest\n queryClient.getQueryCache().subscribe((event) => {\n switch (event.type) {\n case 'added':\n case 'updated':\n // console.log('tracking', event.query.queryHash, 'b/c of a', event.type)\n trackedKeys.add(event.query.queryHash)\n }\n })\n }\n // </server only>\n\n return (\n <stream.Provider\n // Happens on server:\n onFlush={() => {\n /**\n * Dehydrated state of the client where we only include the queries that were added/updated since the last flush\n */\n const shouldDehydrate =\n props.options?.dehydrate?.shouldDehydrateQuery ??\n defaultShouldDehydrateQuery\n\n const dehydratedState = dehydrate(queryClient, {\n ...props.options?.dehydrate,\n shouldDehydrateQuery(query) {\n return trackedKeys.has(query.queryHash) && shouldDehydrate(query)\n },\n })\n trackedKeys.clear()\n\n if (!dehydratedState.queries.length) {\n return []\n }\n\n return [dehydratedState]\n }}\n // Happens in browser:\n onEntries={(entries) => {\n for (const hydratedState of entries) {\n hydrate(queryClient, hydratedState, props.options?.hydrate)\n }\n }}\n // Handle BigInts etc using superjson\n transformer={props.transformer}\n >\n {props.children}\n </stream.Provider>\n )\n}\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA;;AAEA;AACA;AACA;AACA;AACA;AACO;AASL;;AAEA;AACF;AACA;AACE;;AAEA;AACA;AACE;;;AAGI;AACA;AACE;;AAEJ;AACF;AACF;AACA;;AAEA;AAEI;;AAEE;AACR;AACA;;AAKQ;AACE;;AAEE;AACF;AACF;;AAGA;AACE;AACF;;AAGF;AACA;AAAA;;AAEE;;AAEA;AACF;AACA;AAAA;;;AAMN;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type { DehydratedState, DehydrateOptions, HydrateOptions, QueryClient } from '@tanstack/react-query';
|
|
2
1
|
import * as React from 'react';
|
|
3
2
|
import type { HydrationStreamProviderProps } from './HydrationStreamProvider';
|
|
3
|
+
import type { DehydrateOptions, DehydratedState, HydrateOptions, QueryClient } from '@tanstack/react-query';
|
|
4
4
|
/**
|
|
5
5
|
* This component is responsible for:
|
|
6
6
|
* - hydrating the query client on the server
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryStreamedHydration.d.ts","sourceRoot":"","sources":["../../src/ReactQueryStreamedHydration.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ReactQueryStreamedHydration.d.ts","sourceRoot":"","sources":["../../src/ReactQueryStreamedHydration.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,2BAA2B,CAAA;AAC7E,OAAO,KAAK,EACV,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,WAAW,EACZ,MAAM,uBAAuB,CAAA;AAI9B;;;;GAIG;AACH,wBAAgB,2BAA2B,CAAC,KAAK,EAAE;IACjD,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAA;IACzB,WAAW,CAAC,EAAE,WAAW,CAAA;IACzB,OAAO,CAAC,EAAE;QACR,OAAO,CAAC,EAAE,cAAc,CAAA;QACxB,SAAS,CAAC,EAAE,gBAAgB,CAAA;KAC7B,CAAA;IACD,WAAW,CAAC,EAAE,4BAA4B,CAAC,eAAe,CAAC,CAAC,aAAa,CAAC,CAAA;CAC3E,qBA2DA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryStreamedHydration.js","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport
|
|
1
|
+
{"version":3,"file":"ReactQueryStreamedHydration.js","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport {\n defaultShouldDehydrateQuery,\n dehydrate,\n hydrate,\n useQueryClient,\n} from '@tanstack/react-query'\nimport * as React from 'react'\nimport { createHydrationStreamProvider } from './HydrationStreamProvider'\nimport type { HydrationStreamProviderProps } from './HydrationStreamProvider'\nimport type {\n DehydrateOptions,\n DehydratedState,\n HydrateOptions,\n QueryClient,\n} from '@tanstack/react-query'\n\nconst stream = createHydrationStreamProvider<DehydratedState>()\n\n/**\n * This component is responsible for:\n * - hydrating the query client on the server\n * - dehydrating the query client on the server\n */\nexport function ReactQueryStreamedHydration(props: {\n children: React.ReactNode\n queryClient?: QueryClient\n options?: {\n hydrate?: HydrateOptions\n dehydrate?: DehydrateOptions\n }\n transformer?: HydrationStreamProviderProps<DehydratedState>['transformer']\n}) {\n const queryClient = useQueryClient(props.queryClient)\n\n /**\n * We need to track which queries were added/updated during the render\n */\n const [trackedKeys] = React.useState(() => new Set<string>())\n\n // <server only>\n if (typeof window === 'undefined') {\n // Do we need to care about unsubscribing? I don't think so to be honest\n queryClient.getQueryCache().subscribe((event) => {\n switch (event.type) {\n case 'added':\n case 'updated':\n // console.log('tracking', event.query.queryHash, 'b/c of a', event.type)\n trackedKeys.add(event.query.queryHash)\n }\n })\n }\n // </server only>\n\n return (\n <stream.Provider\n // Happens on server:\n onFlush={() => {\n /**\n * Dehydrated state of the client where we only include the queries that were added/updated since the last flush\n */\n const shouldDehydrate =\n props.options?.dehydrate?.shouldDehydrateQuery ??\n defaultShouldDehydrateQuery\n\n const dehydratedState = dehydrate(queryClient, {\n ...props.options?.dehydrate,\n shouldDehydrateQuery(query) {\n return trackedKeys.has(query.queryHash) && shouldDehydrate(query)\n },\n })\n trackedKeys.clear()\n\n if (!dehydratedState.queries.length) {\n return []\n }\n\n return [dehydratedState]\n }}\n // Happens in browser:\n onEntries={(entries) => {\n for (const hydratedState of entries) {\n hydrate(queryClient, hydratedState, props.options?.hydrate)\n }\n }}\n // Handle BigInts etc using superjson\n transformer={props.transformer}\n >\n {props.children}\n </stream.Provider>\n )\n}\n"],"names":[],"mappings":";;;;;AAkBA;;AAEA;AACA;AACA;AACA;AACA;AACO;AASL;;AAEA;AACF;AACA;AACE;;AAEA;AACA;AACE;;;AAGI;AACA;AACE;;AAEJ;AACF;AACF;AACA;;AAEA;AAEI;;AAEE;AACR;AACA;;AAKQ;AACE;;AAEE;AACF;AACF;;AAGA;AACE;AACF;;AAGF;AACA;AAAA;;AAEE;;AAEA;AACF;AACA;AAAA;;;AAMN;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryStreamedHydration.legacy.cjs","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport
|
|
1
|
+
{"version":3,"file":"ReactQueryStreamedHydration.legacy.cjs","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport {\n defaultShouldDehydrateQuery,\n dehydrate,\n hydrate,\n useQueryClient,\n} from '@tanstack/react-query'\nimport * as React from 'react'\nimport { createHydrationStreamProvider } from './HydrationStreamProvider'\nimport type { HydrationStreamProviderProps } from './HydrationStreamProvider'\nimport type {\n DehydrateOptions,\n DehydratedState,\n HydrateOptions,\n QueryClient,\n} from '@tanstack/react-query'\n\nconst stream = createHydrationStreamProvider<DehydratedState>()\n\n/**\n * This component is responsible for:\n * - hydrating the query client on the server\n * - dehydrating the query client on the server\n */\nexport function ReactQueryStreamedHydration(props: {\n children: React.ReactNode\n queryClient?: QueryClient\n options?: {\n hydrate?: HydrateOptions\n dehydrate?: DehydrateOptions\n }\n transformer?: HydrationStreamProviderProps<DehydratedState>['transformer']\n}) {\n const queryClient = useQueryClient(props.queryClient)\n\n /**\n * We need to track which queries were added/updated during the render\n */\n const [trackedKeys] = React.useState(() => new Set<string>())\n\n // <server only>\n if (typeof window === 'undefined') {\n // Do we need to care about unsubscribing? I don't think so to be honest\n queryClient.getQueryCache().subscribe((event) => {\n switch (event.type) {\n case 'added':\n case 'updated':\n // console.log('tracking', event.query.queryHash, 'b/c of a', event.type)\n trackedKeys.add(event.query.queryHash)\n }\n })\n }\n // </server only>\n\n return (\n <stream.Provider\n // Happens on server:\n onFlush={() => {\n /**\n * Dehydrated state of the client where we only include the queries that were added/updated since the last flush\n */\n const shouldDehydrate =\n props.options?.dehydrate?.shouldDehydrateQuery ??\n defaultShouldDehydrateQuery\n\n const dehydratedState = dehydrate(queryClient, {\n ...props.options?.dehydrate,\n shouldDehydrateQuery(query) {\n return trackedKeys.has(query.queryHash) && shouldDehydrate(query)\n },\n })\n trackedKeys.clear()\n\n if (!dehydratedState.queries.length) {\n return []\n }\n\n return [dehydratedState]\n }}\n // Happens in browser:\n onEntries={(entries) => {\n for (const hydratedState of entries) {\n hydrate(queryClient, hydratedState, props.options?.hydrate)\n }\n }}\n // Handle BigInts etc using superjson\n transformer={props.transformer}\n >\n {props.children}\n </stream.Provider>\n )\n}\n"],"names":["hydrate"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA;;AAEA;AACA;AACA;AACA;AACA;AACO;AASL;;AAEA;AACF;AACA;AACE;;AAEA;AACA;AACE;;;AAGI;AACA;AACE;;AAEJ;AACF;AACF;AACA;;AAEA;AAEI;;AACe;AACb;AACR;AACA;;AAKQ;;;AAGI;AACF;AACF;;AAGA;AACE;AACF;;AAGF;AACA;AAAA;;AAEE;AAAqC;AACnCA;AACF;AACF;AACA;AAAA;;;AAMN;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactQueryStreamedHydration.legacy.js","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport
|
|
1
|
+
{"version":3,"file":"ReactQueryStreamedHydration.legacy.js","sources":["../../src/ReactQueryStreamedHydration.tsx"],"sourcesContent":["'use client'\n\nimport {\n defaultShouldDehydrateQuery,\n dehydrate,\n hydrate,\n useQueryClient,\n} from '@tanstack/react-query'\nimport * as React from 'react'\nimport { createHydrationStreamProvider } from './HydrationStreamProvider'\nimport type { HydrationStreamProviderProps } from './HydrationStreamProvider'\nimport type {\n DehydrateOptions,\n DehydratedState,\n HydrateOptions,\n QueryClient,\n} from '@tanstack/react-query'\n\nconst stream = createHydrationStreamProvider<DehydratedState>()\n\n/**\n * This component is responsible for:\n * - hydrating the query client on the server\n * - dehydrating the query client on the server\n */\nexport function ReactQueryStreamedHydration(props: {\n children: React.ReactNode\n queryClient?: QueryClient\n options?: {\n hydrate?: HydrateOptions\n dehydrate?: DehydrateOptions\n }\n transformer?: HydrationStreamProviderProps<DehydratedState>['transformer']\n}) {\n const queryClient = useQueryClient(props.queryClient)\n\n /**\n * We need to track which queries were added/updated during the render\n */\n const [trackedKeys] = React.useState(() => new Set<string>())\n\n // <server only>\n if (typeof window === 'undefined') {\n // Do we need to care about unsubscribing? I don't think so to be honest\n queryClient.getQueryCache().subscribe((event) => {\n switch (event.type) {\n case 'added':\n case 'updated':\n // console.log('tracking', event.query.queryHash, 'b/c of a', event.type)\n trackedKeys.add(event.query.queryHash)\n }\n })\n }\n // </server only>\n\n return (\n <stream.Provider\n // Happens on server:\n onFlush={() => {\n /**\n * Dehydrated state of the client where we only include the queries that were added/updated since the last flush\n */\n const shouldDehydrate =\n props.options?.dehydrate?.shouldDehydrateQuery ??\n defaultShouldDehydrateQuery\n\n const dehydratedState = dehydrate(queryClient, {\n ...props.options?.dehydrate,\n shouldDehydrateQuery(query) {\n return trackedKeys.has(query.queryHash) && shouldDehydrate(query)\n },\n })\n trackedKeys.clear()\n\n if (!dehydratedState.queries.length) {\n return []\n }\n\n return [dehydratedState]\n }}\n // Happens in browser:\n onEntries={(entries) => {\n for (const hydratedState of entries) {\n hydrate(queryClient, hydratedState, props.options?.hydrate)\n }\n }}\n // Handle BigInts etc using superjson\n transformer={props.transformer}\n >\n {props.children}\n </stream.Provider>\n )\n}\n"],"names":["hydrate"],"mappings":";;;;;AAkBA;;AAEA;AACA;AACA;AACA;AACA;AACO;AASL;;AAEA;AACF;AACA;AACE;;AAEA;AACA;AACE;;;AAGI;AACA;AACE;;AAEJ;AACF;AACF;AACA;;AAEA;AAEI;;AACe;AACb;AACR;AACA;;AAKQ;;;AAGI;AACF;AACF;;AAGA;AACE;AACF;;AAGF;AACA;AAAA;;AAEE;AAAqC;AACnCA;AACF;AACF;AACA;AAAA;;;AAMN;;"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tanstack/react-query-next-experimental",
|
|
3
|
-
"version": "5.0.0-alpha.
|
|
3
|
+
"version": "5.0.0-alpha.84",
|
|
4
4
|
"description": "Hydration utils for React Query in the NextJs app directory",
|
|
5
5
|
"author": "tannerlinsley",
|
|
6
6
|
"license": "MIT",
|
|
@@ -35,13 +35,13 @@
|
|
|
35
35
|
"react": "^18.2.0",
|
|
36
36
|
"react-dom": "^18.2.0",
|
|
37
37
|
"react-error-boundary": "^3.1.4",
|
|
38
|
-
"@tanstack/react-query": "5.0.0-alpha.
|
|
38
|
+
"@tanstack/react-query": "5.0.0-alpha.84"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
41
|
"next": "^13.0.0",
|
|
42
42
|
"react": "^18.0.0",
|
|
43
43
|
"react-dom": "^18.0.0",
|
|
44
|
-
"@tanstack/react-query": "5.0.0-alpha.
|
|
44
|
+
"@tanstack/react-query": "5.0.0-alpha.84"
|
|
45
45
|
},
|
|
46
46
|
"scripts": {
|
|
47
47
|
"clean": "rimraf ./build && rimraf ./coverage",
|
|
@@ -1,11 +1,5 @@
|
|
|
1
1
|
'use client'
|
|
2
2
|
|
|
3
|
-
import type {
|
|
4
|
-
DehydratedState,
|
|
5
|
-
DehydrateOptions,
|
|
6
|
-
HydrateOptions,
|
|
7
|
-
QueryClient,
|
|
8
|
-
} from '@tanstack/react-query'
|
|
9
3
|
import {
|
|
10
4
|
defaultShouldDehydrateQuery,
|
|
11
5
|
dehydrate,
|
|
@@ -13,8 +7,14 @@ import {
|
|
|
13
7
|
useQueryClient,
|
|
14
8
|
} from '@tanstack/react-query'
|
|
15
9
|
import * as React from 'react'
|
|
16
|
-
import type { HydrationStreamProviderProps } from './HydrationStreamProvider'
|
|
17
10
|
import { createHydrationStreamProvider } from './HydrationStreamProvider'
|
|
11
|
+
import type { HydrationStreamProviderProps } from './HydrationStreamProvider'
|
|
12
|
+
import type {
|
|
13
|
+
DehydrateOptions,
|
|
14
|
+
DehydratedState,
|
|
15
|
+
HydrateOptions,
|
|
16
|
+
QueryClient,
|
|
17
|
+
} from '@tanstack/react-query'
|
|
18
18
|
|
|
19
19
|
const stream = createHydrationStreamProvider<DehydratedState>()
|
|
20
20
|
|