houdini-react 1.2.46 → 1.2.47
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/plugin-cjs/index.js +28 -6
- package/build/plugin-esm/index.js +28 -6
- package/build/runtime/routing/Router.d.ts +1 -0
- package/build/runtime-cjs/clientPlugin.js +1 -1
- package/build/runtime-cjs/hooks/useDocumentHandle.js +17 -4
- package/build/runtime-cjs/routing/Router.d.ts +1 -0
- package/build/runtime-cjs/routing/Router.js +46 -18
- package/build/runtime-esm/clientPlugin.js +1 -1
- package/build/runtime-esm/hooks/useDocumentHandle.js +18 -5
- package/build/runtime-esm/routing/Router.d.ts +1 -0
- package/build/runtime-esm/routing/Router.js +46 -18
- package/package.json +2 -2
|
@@ -76800,9 +76800,12 @@ var InMemorySubscriptions = class {
|
|
|
76800
76800
|
removeSubscribers(id, fieldName, specs) {
|
|
76801
76801
|
let targets = [];
|
|
76802
76802
|
const subscriber = this.subscribers.get(id);
|
|
76803
|
-
|
|
76803
|
+
if (!subscriber) {
|
|
76804
|
+
return;
|
|
76805
|
+
}
|
|
76806
|
+
const subscriberField = subscriber.get(fieldName);
|
|
76804
76807
|
for (const spec of specs) {
|
|
76805
|
-
const counts = subscriber
|
|
76808
|
+
const counts = subscriber.get(fieldName)?.referenceCounts;
|
|
76806
76809
|
if (!counts?.has(spec.set)) {
|
|
76807
76810
|
continue;
|
|
76808
76811
|
}
|
|
@@ -76812,12 +76815,18 @@ var InMemorySubscriptions = class {
|
|
|
76812
76815
|
targets.push(spec.set);
|
|
76813
76816
|
counts.delete(spec.set);
|
|
76814
76817
|
}
|
|
76818
|
+
if (counts.size === 0) {
|
|
76819
|
+
subscriber.delete(fieldName);
|
|
76820
|
+
}
|
|
76815
76821
|
}
|
|
76816
76822
|
if (subscriberField) {
|
|
76817
76823
|
subscriberField.selections = this.get(id, fieldName).filter(
|
|
76818
76824
|
([{ set }]) => !targets.includes(set)
|
|
76819
76825
|
);
|
|
76820
76826
|
}
|
|
76827
|
+
if (subscriber.size === 0) {
|
|
76828
|
+
this.subscribers.delete(id);
|
|
76829
|
+
}
|
|
76821
76830
|
}
|
|
76822
76831
|
removeAllSubscribers(id, targets, visited = []) {
|
|
76823
76832
|
visited.push(id);
|
|
@@ -76838,6 +76847,15 @@ var InMemorySubscriptions = class {
|
|
|
76838
76847
|
}
|
|
76839
76848
|
}
|
|
76840
76849
|
}
|
|
76850
|
+
get size() {
|
|
76851
|
+
let size = 0;
|
|
76852
|
+
for (const [, nodeCounts] of this.subscribers) {
|
|
76853
|
+
for (const [, { referenceCounts }] of nodeCounts) {
|
|
76854
|
+
size += [...referenceCounts.values()].reduce((size2, count) => size2 + count, 0);
|
|
76855
|
+
}
|
|
76856
|
+
}
|
|
76857
|
+
return size;
|
|
76858
|
+
}
|
|
76841
76859
|
};
|
|
76842
76860
|
var Cache = class {
|
|
76843
76861
|
_internal_unstable;
|
|
@@ -76884,6 +76902,9 @@ var Cache = class {
|
|
|
76884
76902
|
};
|
|
76885
76903
|
}
|
|
76886
76904
|
subscribe(spec, variables = {}) {
|
|
76905
|
+
if (this._internal_unstable.disabled) {
|
|
76906
|
+
return;
|
|
76907
|
+
}
|
|
76887
76908
|
return this._internal_unstable.subscriptions.add({
|
|
76888
76909
|
parent: spec.parentID || rootID,
|
|
76889
76910
|
spec,
|
|
@@ -77023,7 +77044,7 @@ var Cache = class {
|
|
|
77023
77044
|
}
|
|
77024
77045
|
};
|
|
77025
77046
|
var CacheInternal = class {
|
|
77026
|
-
|
|
77047
|
+
disabled = false;
|
|
77027
77048
|
_config;
|
|
77028
77049
|
storage;
|
|
77029
77050
|
subscriptions;
|
|
@@ -77054,10 +77075,10 @@ var CacheInternal = class {
|
|
|
77054
77075
|
this._config = config;
|
|
77055
77076
|
this.componentCache = componentCache ?? {};
|
|
77056
77077
|
this.createComponent = createComponent ?? (() => ({}));
|
|
77057
|
-
this.
|
|
77078
|
+
this.disabled = disabled;
|
|
77058
77079
|
try {
|
|
77059
77080
|
if (process.env.HOUDINI_TEST === "true") {
|
|
77060
|
-
this.
|
|
77081
|
+
this.disabled = false;
|
|
77061
77082
|
}
|
|
77062
77083
|
} catch {
|
|
77063
77084
|
}
|
|
@@ -77079,7 +77100,7 @@ var CacheInternal = class {
|
|
|
77079
77100
|
forceNotify,
|
|
77080
77101
|
forceStale
|
|
77081
77102
|
}) {
|
|
77082
|
-
if (this.
|
|
77103
|
+
if (this.disabled) {
|
|
77083
77104
|
return [];
|
|
77084
77105
|
}
|
|
77085
77106
|
let targetSelection = getFieldsForType(
|
|
@@ -79870,6 +79891,7 @@ var vite_default = {
|
|
|
79870
79891
|
observer.send({
|
|
79871
79892
|
setup: true,
|
|
79872
79893
|
variables,
|
|
79894
|
+
session: window.__houdini__initial__session__,
|
|
79873
79895
|
})
|
|
79874
79896
|
|
|
79875
79897
|
// save it in the cache
|
|
@@ -76790,9 +76790,12 @@ var InMemorySubscriptions = class {
|
|
|
76790
76790
|
removeSubscribers(id, fieldName, specs) {
|
|
76791
76791
|
let targets = [];
|
|
76792
76792
|
const subscriber = this.subscribers.get(id);
|
|
76793
|
-
|
|
76793
|
+
if (!subscriber) {
|
|
76794
|
+
return;
|
|
76795
|
+
}
|
|
76796
|
+
const subscriberField = subscriber.get(fieldName);
|
|
76794
76797
|
for (const spec of specs) {
|
|
76795
|
-
const counts = subscriber
|
|
76798
|
+
const counts = subscriber.get(fieldName)?.referenceCounts;
|
|
76796
76799
|
if (!counts?.has(spec.set)) {
|
|
76797
76800
|
continue;
|
|
76798
76801
|
}
|
|
@@ -76802,12 +76805,18 @@ var InMemorySubscriptions = class {
|
|
|
76802
76805
|
targets.push(spec.set);
|
|
76803
76806
|
counts.delete(spec.set);
|
|
76804
76807
|
}
|
|
76808
|
+
if (counts.size === 0) {
|
|
76809
|
+
subscriber.delete(fieldName);
|
|
76810
|
+
}
|
|
76805
76811
|
}
|
|
76806
76812
|
if (subscriberField) {
|
|
76807
76813
|
subscriberField.selections = this.get(id, fieldName).filter(
|
|
76808
76814
|
([{ set }]) => !targets.includes(set)
|
|
76809
76815
|
);
|
|
76810
76816
|
}
|
|
76817
|
+
if (subscriber.size === 0) {
|
|
76818
|
+
this.subscribers.delete(id);
|
|
76819
|
+
}
|
|
76811
76820
|
}
|
|
76812
76821
|
removeAllSubscribers(id, targets, visited = []) {
|
|
76813
76822
|
visited.push(id);
|
|
@@ -76828,6 +76837,15 @@ var InMemorySubscriptions = class {
|
|
|
76828
76837
|
}
|
|
76829
76838
|
}
|
|
76830
76839
|
}
|
|
76840
|
+
get size() {
|
|
76841
|
+
let size = 0;
|
|
76842
|
+
for (const [, nodeCounts] of this.subscribers) {
|
|
76843
|
+
for (const [, { referenceCounts }] of nodeCounts) {
|
|
76844
|
+
size += [...referenceCounts.values()].reduce((size2, count) => size2 + count, 0);
|
|
76845
|
+
}
|
|
76846
|
+
}
|
|
76847
|
+
return size;
|
|
76848
|
+
}
|
|
76831
76849
|
};
|
|
76832
76850
|
var Cache = class {
|
|
76833
76851
|
_internal_unstable;
|
|
@@ -76874,6 +76892,9 @@ var Cache = class {
|
|
|
76874
76892
|
};
|
|
76875
76893
|
}
|
|
76876
76894
|
subscribe(spec, variables = {}) {
|
|
76895
|
+
if (this._internal_unstable.disabled) {
|
|
76896
|
+
return;
|
|
76897
|
+
}
|
|
76877
76898
|
return this._internal_unstable.subscriptions.add({
|
|
76878
76899
|
parent: spec.parentID || rootID,
|
|
76879
76900
|
spec,
|
|
@@ -77013,7 +77034,7 @@ var Cache = class {
|
|
|
77013
77034
|
}
|
|
77014
77035
|
};
|
|
77015
77036
|
var CacheInternal = class {
|
|
77016
|
-
|
|
77037
|
+
disabled = false;
|
|
77017
77038
|
_config;
|
|
77018
77039
|
storage;
|
|
77019
77040
|
subscriptions;
|
|
@@ -77044,10 +77065,10 @@ var CacheInternal = class {
|
|
|
77044
77065
|
this._config = config;
|
|
77045
77066
|
this.componentCache = componentCache ?? {};
|
|
77046
77067
|
this.createComponent = createComponent ?? (() => ({}));
|
|
77047
|
-
this.
|
|
77068
|
+
this.disabled = disabled;
|
|
77048
77069
|
try {
|
|
77049
77070
|
if (process.env.HOUDINI_TEST === "true") {
|
|
77050
|
-
this.
|
|
77071
|
+
this.disabled = false;
|
|
77051
77072
|
}
|
|
77052
77073
|
} catch {
|
|
77053
77074
|
}
|
|
@@ -77069,7 +77090,7 @@ var CacheInternal = class {
|
|
|
77069
77090
|
forceNotify,
|
|
77070
77091
|
forceStale
|
|
77071
77092
|
}) {
|
|
77072
|
-
if (this.
|
|
77093
|
+
if (this.disabled) {
|
|
77073
77094
|
return [];
|
|
77074
77095
|
}
|
|
77075
77096
|
let targetSelection = getFieldsForType(
|
|
@@ -79860,6 +79881,7 @@ var vite_default = {
|
|
|
79860
79881
|
observer.send({
|
|
79861
79882
|
setup: true,
|
|
79862
79883
|
variables,
|
|
79884
|
+
session: window.__houdini__initial__session__,
|
|
79863
79885
|
})
|
|
79864
79886
|
|
|
79865
79887
|
// save it in the cache
|
|
@@ -22,6 +22,7 @@ export declare function Router({ manifest, initialURL, assetPrefix, injectToStre
|
|
|
22
22
|
export declare const useLocation: () => {
|
|
23
23
|
pathname: string;
|
|
24
24
|
params: Record<string, any>;
|
|
25
|
+
goto: (url: string) => void;
|
|
25
26
|
};
|
|
26
27
|
export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, ssr_signals, last_variables, session: ssrSession, }: {
|
|
27
28
|
children: React.ReactElement;
|
|
@@ -39,6 +39,7 @@ function useDocumentHandle({
|
|
|
39
39
|
}) {
|
|
40
40
|
const [forwardPending, setForwardPending] = import_react.default.useState(false);
|
|
41
41
|
const [backwardPending, setBackwardPending] = import_react.default.useState(false);
|
|
42
|
+
const location = (0, import_Router.useLocation)();
|
|
42
43
|
const [session] = (0, import_Router.useSession)();
|
|
43
44
|
const client = (0, import_Router.useClient)();
|
|
44
45
|
const paginationObserver = import_react.default.useMemo(() => {
|
|
@@ -56,10 +57,22 @@ function useDocumentHandle({
|
|
|
56
57
|
return result;
|
|
57
58
|
};
|
|
58
59
|
};
|
|
59
|
-
const fetchQuery = (args) =>
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
60
|
+
const fetchQuery = (args) => {
|
|
61
|
+
const usedVariables = Object.fromEntries(
|
|
62
|
+
Object.keys(observer.artifact.input?.fields ?? {}).map((fieldName) => [
|
|
63
|
+
fieldName,
|
|
64
|
+
location.params[fieldName]
|
|
65
|
+
])
|
|
66
|
+
);
|
|
67
|
+
return observer.send({
|
|
68
|
+
...args,
|
|
69
|
+
variables: {
|
|
70
|
+
...usedVariables,
|
|
71
|
+
...args?.variables
|
|
72
|
+
},
|
|
73
|
+
session
|
|
74
|
+
});
|
|
75
|
+
};
|
|
63
76
|
if (artifact.kind !== import_types.ArtifactKind.Query || !artifact.refetch?.paginated) {
|
|
64
77
|
return {
|
|
65
78
|
artifact,
|
|
@@ -22,6 +22,7 @@ export declare function Router({ manifest, initialURL, assetPrefix, injectToStre
|
|
|
22
22
|
export declare const useLocation: () => {
|
|
23
23
|
pathname: string;
|
|
24
24
|
params: Record<string, any>;
|
|
25
|
+
goto: (url: string) => void;
|
|
25
26
|
};
|
|
26
27
|
export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, ssr_signals, last_variables, session: ssrSession, }: {
|
|
27
28
|
children: React.ReactElement;
|
|
@@ -73,7 +73,7 @@ function Router({
|
|
|
73
73
|
assetPrefix,
|
|
74
74
|
injectToStream
|
|
75
75
|
});
|
|
76
|
-
const { component_cache } = useRouterContext();
|
|
76
|
+
const { component_cache, data_cache } = useRouterContext();
|
|
77
77
|
const PageComponent = component_cache.get(page.id);
|
|
78
78
|
import_react.default.useEffect(() => {
|
|
79
79
|
if (globalThis.window && window.location.pathname !== currentURL) {
|
|
@@ -92,21 +92,36 @@ function Router({
|
|
|
92
92
|
window.removeEventListener("popstate", onChange);
|
|
93
93
|
};
|
|
94
94
|
}, []);
|
|
95
|
+
const goto = (url) => {
|
|
96
|
+
data_cache.clear();
|
|
97
|
+
setCurrentURL(url);
|
|
98
|
+
};
|
|
95
99
|
useLinkBehavior({
|
|
96
|
-
goto
|
|
97
|
-
setCurrentURL(val);
|
|
98
|
-
},
|
|
100
|
+
goto,
|
|
99
101
|
preload(url, which) {
|
|
100
102
|
const [page2, variables2] = (0, import_match.find_match)(import_config.default, manifest, url);
|
|
101
|
-
if (
|
|
103
|
+
if (!page2) {
|
|
104
|
+
return;
|
|
105
|
+
}
|
|
106
|
+
if (["page", "component"].includes(which)) {
|
|
102
107
|
loadComponent(page2);
|
|
103
108
|
}
|
|
104
|
-
if (["
|
|
109
|
+
if (["page", "data"].includes(which)) {
|
|
105
110
|
loadData(page2, variables2);
|
|
106
111
|
}
|
|
107
112
|
}
|
|
108
113
|
});
|
|
109
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(VariableContext.Provider, { value: variables, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
114
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(VariableContext.Provider, { value: variables, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
115
|
+
LocationContext.Provider,
|
|
116
|
+
{
|
|
117
|
+
value: {
|
|
118
|
+
pathname: currentURL,
|
|
119
|
+
goto,
|
|
120
|
+
params: variables ?? {}
|
|
121
|
+
},
|
|
122
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PageComponent, { url: currentURL }, page.id)
|
|
123
|
+
}
|
|
124
|
+
) });
|
|
110
125
|
}
|
|
111
126
|
const useLocation = () => (0, import_react2.useContext)(LocationContext);
|
|
112
127
|
function usePageData({
|
|
@@ -125,9 +140,13 @@ function usePageData({
|
|
|
125
140
|
last_variables
|
|
126
141
|
} = useRouterContext();
|
|
127
142
|
const [session] = useSession();
|
|
128
|
-
function load_query({
|
|
143
|
+
function load_query({
|
|
144
|
+
id,
|
|
145
|
+
artifact,
|
|
146
|
+
variables: variables2
|
|
147
|
+
}) {
|
|
129
148
|
for (const artifact2 of Object.keys(page.documents)) {
|
|
130
|
-
last_variables.set(artifact2,
|
|
149
|
+
last_variables.set(artifact2, variables2);
|
|
131
150
|
}
|
|
132
151
|
if (ssr_signals.has(id)) {
|
|
133
152
|
return ssr_signals.get(id);
|
|
@@ -141,7 +160,7 @@ function usePageData({
|
|
|
141
160
|
resolve = res;
|
|
142
161
|
reject = rej;
|
|
143
162
|
observer.send({
|
|
144
|
-
variables,
|
|
163
|
+
variables: variables2,
|
|
145
164
|
session
|
|
146
165
|
}).then(async () => {
|
|
147
166
|
data_cache.set(id, observer);
|
|
@@ -177,7 +196,7 @@ function usePageData({
|
|
|
177
196
|
variables: ${JSON.stringify(
|
|
178
197
|
(0, import_scalars.marshalInputs)({
|
|
179
198
|
artifact: observer.artifact,
|
|
180
|
-
input:
|
|
199
|
+
input: variables2,
|
|
181
200
|
config: import_config.default
|
|
182
201
|
})
|
|
183
202
|
)}
|
|
@@ -218,7 +237,7 @@ function usePageData({
|
|
|
218
237
|
variables: ${JSON.stringify(
|
|
219
238
|
(0, import_scalars.marshalInputs)({
|
|
220
239
|
artifact: observer.artifact,
|
|
221
|
-
input:
|
|
240
|
+
input: variables2,
|
|
222
241
|
config: import_config.default
|
|
223
242
|
})
|
|
224
243
|
)}
|
|
@@ -243,6 +262,9 @@ function usePageData({
|
|
|
243
262
|
return resolvable;
|
|
244
263
|
}
|
|
245
264
|
function loadData(targetPage, variables2) {
|
|
265
|
+
if (!targetPage) {
|
|
266
|
+
return;
|
|
267
|
+
}
|
|
246
268
|
for (const [artifact, { variables: pageVariables }] of Object.entries(
|
|
247
269
|
targetPage.documents
|
|
248
270
|
)) {
|
|
@@ -275,14 +297,14 @@ function usePageData({
|
|
|
275
297
|
injectToStream?.(`
|
|
276
298
|
<script type="module" src="${assetPrefix}/artifacts/${artifact.name}.js" async=""><\/script>
|
|
277
299
|
`);
|
|
278
|
-
load_query({ id: artifact.name, artifact });
|
|
300
|
+
load_query({ id: artifact.name, artifact, variables: variables2 });
|
|
279
301
|
}).catch((err) => {
|
|
280
302
|
console.log(err);
|
|
281
303
|
});
|
|
282
304
|
}
|
|
283
305
|
for (const artifact of Object.values(found_artifacts)) {
|
|
284
306
|
if (!data_cache.has(artifact.name)) {
|
|
285
|
-
load_query({ id: artifact.name, artifact });
|
|
307
|
+
load_query({ id: artifact.name, artifact, variables: variables2 });
|
|
286
308
|
}
|
|
287
309
|
}
|
|
288
310
|
}
|
|
@@ -390,7 +412,9 @@ function useCurrentVariables() {
|
|
|
390
412
|
const VariableContext = import_react.default.createContext(null);
|
|
391
413
|
const LocationContext = import_react.default.createContext({
|
|
392
414
|
pathname: "",
|
|
393
|
-
params: {}
|
|
415
|
+
params: {},
|
|
416
|
+
goto: () => {
|
|
417
|
+
}
|
|
394
418
|
});
|
|
395
419
|
function useQueryResult(name) {
|
|
396
420
|
const { data_cache, artifact_cache } = useRouterContext();
|
|
@@ -451,10 +475,14 @@ function usePreload({ preload }) {
|
|
|
451
475
|
import_react.default.useEffect(() => {
|
|
452
476
|
const mouseMove = (e) => {
|
|
453
477
|
const target = e.target;
|
|
454
|
-
if (!(target instanceof
|
|
478
|
+
if (!(target instanceof HTMLElement)) {
|
|
479
|
+
return;
|
|
480
|
+
}
|
|
481
|
+
const anchor = target.closest("a");
|
|
482
|
+
if (!anchor) {
|
|
455
483
|
return;
|
|
456
484
|
}
|
|
457
|
-
let preloadWhichRaw =
|
|
485
|
+
let preloadWhichRaw = anchor.attributes.getNamedItem("data-houdini-preload")?.value;
|
|
458
486
|
let preloadWhich = !preloadWhichRaw || preloadWhichRaw === "true" ? "page" : preloadWhichRaw;
|
|
459
487
|
if (!PreloadWhich[preloadWhich]) {
|
|
460
488
|
console.log(
|
|
@@ -466,7 +494,7 @@ function usePreload({ preload }) {
|
|
|
466
494
|
clearTimeout(timeoutRef.current);
|
|
467
495
|
}
|
|
468
496
|
timeoutRef.current = setTimeout(() => {
|
|
469
|
-
const url =
|
|
497
|
+
const url = anchor.attributes.getNamedItem("href")?.value;
|
|
470
498
|
if (!url) {
|
|
471
499
|
return;
|
|
472
500
|
}
|
|
@@ -2,7 +2,7 @@ import { extractPageInfo } from "$houdini/runtime/lib/pageInfo";
|
|
|
2
2
|
import { cursorHandlers, offsetHandlers } from "$houdini/runtime/lib/pagination";
|
|
3
3
|
import { ArtifactKind } from "$houdini/runtime/lib/types";
|
|
4
4
|
import React from "react";
|
|
5
|
-
import { useClient, useSession } from "../routing/Router";
|
|
5
|
+
import { useClient, useLocation, useSession } from "../routing/Router";
|
|
6
6
|
function useDocumentHandle({
|
|
7
7
|
artifact,
|
|
8
8
|
observer,
|
|
@@ -10,6 +10,7 @@ function useDocumentHandle({
|
|
|
10
10
|
}) {
|
|
11
11
|
const [forwardPending, setForwardPending] = React.useState(false);
|
|
12
12
|
const [backwardPending, setBackwardPending] = React.useState(false);
|
|
13
|
+
const location = useLocation();
|
|
13
14
|
const [session] = useSession();
|
|
14
15
|
const client = useClient();
|
|
15
16
|
const paginationObserver = React.useMemo(() => {
|
|
@@ -27,10 +28,22 @@ function useDocumentHandle({
|
|
|
27
28
|
return result;
|
|
28
29
|
};
|
|
29
30
|
};
|
|
30
|
-
const fetchQuery = (args) =>
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
31
|
+
const fetchQuery = (args) => {
|
|
32
|
+
const usedVariables = Object.fromEntries(
|
|
33
|
+
Object.keys(observer.artifact.input?.fields ?? {}).map((fieldName) => [
|
|
34
|
+
fieldName,
|
|
35
|
+
location.params[fieldName]
|
|
36
|
+
])
|
|
37
|
+
);
|
|
38
|
+
return observer.send({
|
|
39
|
+
...args,
|
|
40
|
+
variables: {
|
|
41
|
+
...usedVariables,
|
|
42
|
+
...args?.variables
|
|
43
|
+
},
|
|
44
|
+
session
|
|
45
|
+
});
|
|
46
|
+
};
|
|
34
47
|
if (artifact.kind !== ArtifactKind.Query || !artifact.refetch?.paginated) {
|
|
35
48
|
return {
|
|
36
49
|
artifact,
|
|
@@ -22,6 +22,7 @@ export declare function Router({ manifest, initialURL, assetPrefix, injectToStre
|
|
|
22
22
|
export declare const useLocation: () => {
|
|
23
23
|
pathname: string;
|
|
24
24
|
params: Record<string, any>;
|
|
25
|
+
goto: (url: string) => void;
|
|
25
26
|
};
|
|
26
27
|
export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, ssr_signals, last_variables, session: ssrSession, }: {
|
|
27
28
|
children: React.ReactElement;
|
|
@@ -32,7 +32,7 @@ function Router({
|
|
|
32
32
|
assetPrefix,
|
|
33
33
|
injectToStream
|
|
34
34
|
});
|
|
35
|
-
const { component_cache } = useRouterContext();
|
|
35
|
+
const { component_cache, data_cache } = useRouterContext();
|
|
36
36
|
const PageComponent = component_cache.get(page.id);
|
|
37
37
|
React.useEffect(() => {
|
|
38
38
|
if (globalThis.window && window.location.pathname !== currentURL) {
|
|
@@ -51,21 +51,36 @@ function Router({
|
|
|
51
51
|
window.removeEventListener("popstate", onChange);
|
|
52
52
|
};
|
|
53
53
|
}, []);
|
|
54
|
+
const goto = (url) => {
|
|
55
|
+
data_cache.clear();
|
|
56
|
+
setCurrentURL(url);
|
|
57
|
+
};
|
|
54
58
|
useLinkBehavior({
|
|
55
|
-
goto
|
|
56
|
-
setCurrentURL(val);
|
|
57
|
-
},
|
|
59
|
+
goto,
|
|
58
60
|
preload(url, which) {
|
|
59
61
|
const [page2, variables2] = find_match(configFile, manifest, url);
|
|
60
|
-
if (
|
|
62
|
+
if (!page2) {
|
|
63
|
+
return;
|
|
64
|
+
}
|
|
65
|
+
if (["page", "component"].includes(which)) {
|
|
61
66
|
loadComponent(page2);
|
|
62
67
|
}
|
|
63
|
-
if (["
|
|
68
|
+
if (["page", "data"].includes(which)) {
|
|
64
69
|
loadData(page2, variables2);
|
|
65
70
|
}
|
|
66
71
|
}
|
|
67
72
|
});
|
|
68
|
-
return /* @__PURE__ */ jsx(VariableContext.Provider, { value: variables, children: /* @__PURE__ */ jsx(
|
|
73
|
+
return /* @__PURE__ */ jsx(VariableContext.Provider, { value: variables, children: /* @__PURE__ */ jsx(
|
|
74
|
+
LocationContext.Provider,
|
|
75
|
+
{
|
|
76
|
+
value: {
|
|
77
|
+
pathname: currentURL,
|
|
78
|
+
goto,
|
|
79
|
+
params: variables ?? {}
|
|
80
|
+
},
|
|
81
|
+
children: /* @__PURE__ */ jsx(PageComponent, { url: currentURL }, page.id)
|
|
82
|
+
}
|
|
83
|
+
) });
|
|
69
84
|
}
|
|
70
85
|
const useLocation = () => useContext(LocationContext);
|
|
71
86
|
function usePageData({
|
|
@@ -84,9 +99,13 @@ function usePageData({
|
|
|
84
99
|
last_variables
|
|
85
100
|
} = useRouterContext();
|
|
86
101
|
const [session] = useSession();
|
|
87
|
-
function load_query({
|
|
102
|
+
function load_query({
|
|
103
|
+
id,
|
|
104
|
+
artifact,
|
|
105
|
+
variables: variables2
|
|
106
|
+
}) {
|
|
88
107
|
for (const artifact2 of Object.keys(page.documents)) {
|
|
89
|
-
last_variables.set(artifact2,
|
|
108
|
+
last_variables.set(artifact2, variables2);
|
|
90
109
|
}
|
|
91
110
|
if (ssr_signals.has(id)) {
|
|
92
111
|
return ssr_signals.get(id);
|
|
@@ -100,7 +119,7 @@ function usePageData({
|
|
|
100
119
|
resolve = res;
|
|
101
120
|
reject = rej;
|
|
102
121
|
observer.send({
|
|
103
|
-
variables,
|
|
122
|
+
variables: variables2,
|
|
104
123
|
session
|
|
105
124
|
}).then(async () => {
|
|
106
125
|
data_cache.set(id, observer);
|
|
@@ -136,7 +155,7 @@ function usePageData({
|
|
|
136
155
|
variables: ${JSON.stringify(
|
|
137
156
|
marshalInputs({
|
|
138
157
|
artifact: observer.artifact,
|
|
139
|
-
input:
|
|
158
|
+
input: variables2,
|
|
140
159
|
config: configFile
|
|
141
160
|
})
|
|
142
161
|
)}
|
|
@@ -177,7 +196,7 @@ function usePageData({
|
|
|
177
196
|
variables: ${JSON.stringify(
|
|
178
197
|
marshalInputs({
|
|
179
198
|
artifact: observer.artifact,
|
|
180
|
-
input:
|
|
199
|
+
input: variables2,
|
|
181
200
|
config: configFile
|
|
182
201
|
})
|
|
183
202
|
)}
|
|
@@ -202,6 +221,9 @@ function usePageData({
|
|
|
202
221
|
return resolvable;
|
|
203
222
|
}
|
|
204
223
|
function loadData(targetPage, variables2) {
|
|
224
|
+
if (!targetPage) {
|
|
225
|
+
return;
|
|
226
|
+
}
|
|
205
227
|
for (const [artifact, { variables: pageVariables }] of Object.entries(
|
|
206
228
|
targetPage.documents
|
|
207
229
|
)) {
|
|
@@ -234,14 +256,14 @@ function usePageData({
|
|
|
234
256
|
injectToStream?.(`
|
|
235
257
|
<script type="module" src="${assetPrefix}/artifacts/${artifact.name}.js" async=""><\/script>
|
|
236
258
|
`);
|
|
237
|
-
load_query({ id: artifact.name, artifact });
|
|
259
|
+
load_query({ id: artifact.name, artifact, variables: variables2 });
|
|
238
260
|
}).catch((err) => {
|
|
239
261
|
console.log(err);
|
|
240
262
|
});
|
|
241
263
|
}
|
|
242
264
|
for (const artifact of Object.values(found_artifacts)) {
|
|
243
265
|
if (!data_cache.has(artifact.name)) {
|
|
244
|
-
load_query({ id: artifact.name, artifact });
|
|
266
|
+
load_query({ id: artifact.name, artifact, variables: variables2 });
|
|
245
267
|
}
|
|
246
268
|
}
|
|
247
269
|
}
|
|
@@ -349,7 +371,9 @@ function useCurrentVariables() {
|
|
|
349
371
|
const VariableContext = React.createContext(null);
|
|
350
372
|
const LocationContext = React.createContext({
|
|
351
373
|
pathname: "",
|
|
352
|
-
params: {}
|
|
374
|
+
params: {},
|
|
375
|
+
goto: () => {
|
|
376
|
+
}
|
|
353
377
|
});
|
|
354
378
|
function useQueryResult(name) {
|
|
355
379
|
const { data_cache, artifact_cache } = useRouterContext();
|
|
@@ -410,10 +434,14 @@ function usePreload({ preload }) {
|
|
|
410
434
|
React.useEffect(() => {
|
|
411
435
|
const mouseMove = (e) => {
|
|
412
436
|
const target = e.target;
|
|
413
|
-
if (!(target instanceof
|
|
437
|
+
if (!(target instanceof HTMLElement)) {
|
|
438
|
+
return;
|
|
439
|
+
}
|
|
440
|
+
const anchor = target.closest("a");
|
|
441
|
+
if (!anchor) {
|
|
414
442
|
return;
|
|
415
443
|
}
|
|
416
|
-
let preloadWhichRaw =
|
|
444
|
+
let preloadWhichRaw = anchor.attributes.getNamedItem("data-houdini-preload")?.value;
|
|
417
445
|
let preloadWhich = !preloadWhichRaw || preloadWhichRaw === "true" ? "page" : preloadWhichRaw;
|
|
418
446
|
if (!PreloadWhich[preloadWhich]) {
|
|
419
447
|
console.log(
|
|
@@ -425,7 +453,7 @@ function usePreload({ preload }) {
|
|
|
425
453
|
clearTimeout(timeoutRef.current);
|
|
426
454
|
}
|
|
427
455
|
timeoutRef.current = setTimeout(() => {
|
|
428
|
-
const url =
|
|
456
|
+
const url = anchor.attributes.getNamedItem("href")?.value;
|
|
429
457
|
if (!url) {
|
|
430
458
|
return;
|
|
431
459
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "houdini-react",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.47",
|
|
4
4
|
"description": "The React plugin for houdini",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"typescript",
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"recast": "^0.23.1",
|
|
44
44
|
"rollup": "^3.7.4",
|
|
45
45
|
"use-deep-compare-effect": "^1.8.1",
|
|
46
|
-
"houdini": "^1.2.
|
|
46
|
+
"houdini": "^1.2.47"
|
|
47
47
|
},
|
|
48
48
|
"files": [
|
|
49
49
|
"build"
|