houdini-react 0.0.0-20240411054045 → 0.0.0-20240422193548
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 +27 -7
- package/build/plugin-esm/index.js +27 -7
- package/build/runtime/routing/Router.d.ts +0 -1
- package/build/runtime-cjs/clientPlugin.js +1 -1
- package/build/runtime-cjs/hooks/useDocumentHandle.js +4 -17
- package/build/runtime-cjs/routing/Router.d.ts +0 -1
- package/build/runtime-cjs/routing/Router.js +18 -46
- package/build/runtime-esm/clientPlugin.js +1 -1
- package/build/runtime-esm/hooks/useDocumentHandle.js +5 -18
- package/build/runtime-esm/routing/Router.d.ts +0 -1
- package/build/runtime-esm/routing/Router.js +18 -46
- 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,7 +79891,6 @@ var vite_default = {
|
|
|
79870
79891
|
observer.send({
|
|
79871
79892
|
setup: true,
|
|
79872
79893
|
variables,
|
|
79873
|
-
session: window.__houdini__initial__session__,
|
|
79874
79894
|
})
|
|
79875
79895
|
|
|
79876
79896
|
// 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,7 +79881,6 @@ var vite_default = {
|
|
|
79860
79881
|
observer.send({
|
|
79861
79882
|
setup: true,
|
|
79862
79883
|
variables,
|
|
79863
|
-
session: window.__houdini__initial__session__,
|
|
79864
79884
|
})
|
|
79865
79885
|
|
|
79866
79886
|
// save it in the cache
|
|
@@ -22,7 +22,6 @@ 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;
|
|
26
25
|
};
|
|
27
26
|
export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, ssr_signals, last_variables, session: ssrSession, }: {
|
|
28
27
|
children: React.ReactElement;
|
|
@@ -39,7 +39,6 @@ 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)();
|
|
43
42
|
const [session] = (0, import_Router.useSession)();
|
|
44
43
|
const client = (0, import_Router.useClient)();
|
|
45
44
|
const paginationObserver = import_react.default.useMemo(() => {
|
|
@@ -57,22 +56,10 @@ function useDocumentHandle({
|
|
|
57
56
|
return result;
|
|
58
57
|
};
|
|
59
58
|
};
|
|
60
|
-
const fetchQuery = (args) => {
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
location.params[fieldName]
|
|
65
|
-
])
|
|
66
|
-
);
|
|
67
|
-
return observer.send({
|
|
68
|
-
...args,
|
|
69
|
-
variables: {
|
|
70
|
-
...usedVariables,
|
|
71
|
-
...args?.variables
|
|
72
|
-
},
|
|
73
|
-
session
|
|
74
|
-
});
|
|
75
|
-
};
|
|
59
|
+
const fetchQuery = (args) => observer.send({
|
|
60
|
+
...args,
|
|
61
|
+
session
|
|
62
|
+
});
|
|
76
63
|
if (artifact.kind !== import_types.ArtifactKind.Query || !artifact.refetch?.paginated) {
|
|
77
64
|
return {
|
|
78
65
|
artifact,
|
|
@@ -22,7 +22,6 @@ 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;
|
|
26
25
|
};
|
|
27
26
|
export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, ssr_signals, last_variables, session: ssrSession, }: {
|
|
28
27
|
children: React.ReactElement;
|
|
@@ -73,7 +73,7 @@ function Router({
|
|
|
73
73
|
assetPrefix,
|
|
74
74
|
injectToStream
|
|
75
75
|
});
|
|
76
|
-
const { component_cache
|
|
76
|
+
const { component_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,36 +92,21 @@ function Router({
|
|
|
92
92
|
window.removeEventListener("popstate", onChange);
|
|
93
93
|
};
|
|
94
94
|
}, []);
|
|
95
|
-
const goto = (url) => {
|
|
96
|
-
data_cache.clear();
|
|
97
|
-
setCurrentURL(url);
|
|
98
|
-
};
|
|
99
95
|
useLinkBehavior({
|
|
100
|
-
goto
|
|
96
|
+
goto: (val) => {
|
|
97
|
+
setCurrentURL(val);
|
|
98
|
+
},
|
|
101
99
|
preload(url, which) {
|
|
102
100
|
const [page2, variables2] = (0, import_match.find_match)(import_config.default, manifest, url);
|
|
103
|
-
if (
|
|
104
|
-
return;
|
|
105
|
-
}
|
|
106
|
-
if (["page", "component"].includes(which)) {
|
|
101
|
+
if (["both", "component"].includes(which)) {
|
|
107
102
|
loadComponent(page2);
|
|
108
103
|
}
|
|
109
|
-
if (["
|
|
104
|
+
if (["both", "data"].includes(which)) {
|
|
110
105
|
loadData(page2, variables2);
|
|
111
106
|
}
|
|
112
107
|
}
|
|
113
108
|
});
|
|
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
|
-
) });
|
|
109
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(VariableContext.Provider, { value: variables, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LocationContext.Provider, { value: { pathname: currentURL, params: variables ?? {} }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PageComponent, { url: currentURL }, page.id) }) });
|
|
125
110
|
}
|
|
126
111
|
const useLocation = () => (0, import_react2.useContext)(LocationContext);
|
|
127
112
|
function usePageData({
|
|
@@ -140,13 +125,9 @@ function usePageData({
|
|
|
140
125
|
last_variables
|
|
141
126
|
} = useRouterContext();
|
|
142
127
|
const [session] = useSession();
|
|
143
|
-
function load_query({
|
|
144
|
-
id,
|
|
145
|
-
artifact,
|
|
146
|
-
variables: variables2
|
|
147
|
-
}) {
|
|
128
|
+
function load_query({ id, artifact }) {
|
|
148
129
|
for (const artifact2 of Object.keys(page.documents)) {
|
|
149
|
-
last_variables.set(artifact2,
|
|
130
|
+
last_variables.set(artifact2, variables);
|
|
150
131
|
}
|
|
151
132
|
if (ssr_signals.has(id)) {
|
|
152
133
|
return ssr_signals.get(id);
|
|
@@ -160,7 +141,7 @@ function usePageData({
|
|
|
160
141
|
resolve = res;
|
|
161
142
|
reject = rej;
|
|
162
143
|
observer.send({
|
|
163
|
-
variables
|
|
144
|
+
variables,
|
|
164
145
|
session
|
|
165
146
|
}).then(async () => {
|
|
166
147
|
data_cache.set(id, observer);
|
|
@@ -196,7 +177,7 @@ function usePageData({
|
|
|
196
177
|
variables: ${JSON.stringify(
|
|
197
178
|
(0, import_scalars.marshalInputs)({
|
|
198
179
|
artifact: observer.artifact,
|
|
199
|
-
input:
|
|
180
|
+
input: variables,
|
|
200
181
|
config: import_config.default
|
|
201
182
|
})
|
|
202
183
|
)}
|
|
@@ -237,7 +218,7 @@ function usePageData({
|
|
|
237
218
|
variables: ${JSON.stringify(
|
|
238
219
|
(0, import_scalars.marshalInputs)({
|
|
239
220
|
artifact: observer.artifact,
|
|
240
|
-
input:
|
|
221
|
+
input: variables,
|
|
241
222
|
config: import_config.default
|
|
242
223
|
})
|
|
243
224
|
)}
|
|
@@ -262,9 +243,6 @@ function usePageData({
|
|
|
262
243
|
return resolvable;
|
|
263
244
|
}
|
|
264
245
|
function loadData(targetPage, variables2) {
|
|
265
|
-
if (!targetPage) {
|
|
266
|
-
return;
|
|
267
|
-
}
|
|
268
246
|
for (const [artifact, { variables: pageVariables }] of Object.entries(
|
|
269
247
|
targetPage.documents
|
|
270
248
|
)) {
|
|
@@ -297,14 +275,14 @@ function usePageData({
|
|
|
297
275
|
injectToStream?.(`
|
|
298
276
|
<script type="module" src="${assetPrefix}/artifacts/${artifact.name}.js" async=""><\/script>
|
|
299
277
|
`);
|
|
300
|
-
load_query({ id: artifact.name, artifact
|
|
278
|
+
load_query({ id: artifact.name, artifact });
|
|
301
279
|
}).catch((err) => {
|
|
302
280
|
console.log(err);
|
|
303
281
|
});
|
|
304
282
|
}
|
|
305
283
|
for (const artifact of Object.values(found_artifacts)) {
|
|
306
284
|
if (!data_cache.has(artifact.name)) {
|
|
307
|
-
load_query({ id: artifact.name, artifact
|
|
285
|
+
load_query({ id: artifact.name, artifact });
|
|
308
286
|
}
|
|
309
287
|
}
|
|
310
288
|
}
|
|
@@ -412,9 +390,7 @@ function useCurrentVariables() {
|
|
|
412
390
|
const VariableContext = import_react.default.createContext(null);
|
|
413
391
|
const LocationContext = import_react.default.createContext({
|
|
414
392
|
pathname: "",
|
|
415
|
-
params: {}
|
|
416
|
-
goto: () => {
|
|
417
|
-
}
|
|
393
|
+
params: {}
|
|
418
394
|
});
|
|
419
395
|
function useQueryResult(name) {
|
|
420
396
|
const { data_cache, artifact_cache } = useRouterContext();
|
|
@@ -475,14 +451,10 @@ function usePreload({ preload }) {
|
|
|
475
451
|
import_react.default.useEffect(() => {
|
|
476
452
|
const mouseMove = (e) => {
|
|
477
453
|
const target = e.target;
|
|
478
|
-
if (!(target instanceof
|
|
479
|
-
return;
|
|
480
|
-
}
|
|
481
|
-
const anchor = target.closest("a");
|
|
482
|
-
if (!anchor) {
|
|
454
|
+
if (!(target instanceof HTMLAnchorElement)) {
|
|
483
455
|
return;
|
|
484
456
|
}
|
|
485
|
-
let preloadWhichRaw =
|
|
457
|
+
let preloadWhichRaw = target.attributes.getNamedItem("data-houdini-preload")?.value;
|
|
486
458
|
let preloadWhich = !preloadWhichRaw || preloadWhichRaw === "true" ? "page" : preloadWhichRaw;
|
|
487
459
|
if (!PreloadWhich[preloadWhich]) {
|
|
488
460
|
console.log(
|
|
@@ -494,7 +466,7 @@ function usePreload({ preload }) {
|
|
|
494
466
|
clearTimeout(timeoutRef.current);
|
|
495
467
|
}
|
|
496
468
|
timeoutRef.current = setTimeout(() => {
|
|
497
|
-
const url =
|
|
469
|
+
const url = target.attributes.getNamedItem("href")?.value;
|
|
498
470
|
if (!url) {
|
|
499
471
|
return;
|
|
500
472
|
}
|
|
@@ -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,
|
|
5
|
+
import { useClient, useSession } from "../routing/Router";
|
|
6
6
|
function useDocumentHandle({
|
|
7
7
|
artifact,
|
|
8
8
|
observer,
|
|
@@ -10,7 +10,6 @@ function useDocumentHandle({
|
|
|
10
10
|
}) {
|
|
11
11
|
const [forwardPending, setForwardPending] = React.useState(false);
|
|
12
12
|
const [backwardPending, setBackwardPending] = React.useState(false);
|
|
13
|
-
const location = useLocation();
|
|
14
13
|
const [session] = useSession();
|
|
15
14
|
const client = useClient();
|
|
16
15
|
const paginationObserver = React.useMemo(() => {
|
|
@@ -28,22 +27,10 @@ function useDocumentHandle({
|
|
|
28
27
|
return result;
|
|
29
28
|
};
|
|
30
29
|
};
|
|
31
|
-
const fetchQuery = (args) => {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
location.params[fieldName]
|
|
36
|
-
])
|
|
37
|
-
);
|
|
38
|
-
return observer.send({
|
|
39
|
-
...args,
|
|
40
|
-
variables: {
|
|
41
|
-
...usedVariables,
|
|
42
|
-
...args?.variables
|
|
43
|
-
},
|
|
44
|
-
session
|
|
45
|
-
});
|
|
46
|
-
};
|
|
30
|
+
const fetchQuery = (args) => observer.send({
|
|
31
|
+
...args,
|
|
32
|
+
session
|
|
33
|
+
});
|
|
47
34
|
if (artifact.kind !== ArtifactKind.Query || !artifact.refetch?.paginated) {
|
|
48
35
|
return {
|
|
49
36
|
artifact,
|
|
@@ -22,7 +22,6 @@ 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;
|
|
26
25
|
};
|
|
27
26
|
export declare function RouterContextProvider({ children, client, cache, artifact_cache, component_cache, data_cache, ssr_signals, last_variables, session: ssrSession, }: {
|
|
28
27
|
children: React.ReactElement;
|
|
@@ -32,7 +32,7 @@ function Router({
|
|
|
32
32
|
assetPrefix,
|
|
33
33
|
injectToStream
|
|
34
34
|
});
|
|
35
|
-
const { component_cache
|
|
35
|
+
const { component_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,36 +51,21 @@ function Router({
|
|
|
51
51
|
window.removeEventListener("popstate", onChange);
|
|
52
52
|
};
|
|
53
53
|
}, []);
|
|
54
|
-
const goto = (url) => {
|
|
55
|
-
data_cache.clear();
|
|
56
|
-
setCurrentURL(url);
|
|
57
|
-
};
|
|
58
54
|
useLinkBehavior({
|
|
59
|
-
goto
|
|
55
|
+
goto: (val) => {
|
|
56
|
+
setCurrentURL(val);
|
|
57
|
+
},
|
|
60
58
|
preload(url, which) {
|
|
61
59
|
const [page2, variables2] = find_match(configFile, manifest, url);
|
|
62
|
-
if (
|
|
63
|
-
return;
|
|
64
|
-
}
|
|
65
|
-
if (["page", "component"].includes(which)) {
|
|
60
|
+
if (["both", "component"].includes(which)) {
|
|
66
61
|
loadComponent(page2);
|
|
67
62
|
}
|
|
68
|
-
if (["
|
|
63
|
+
if (["both", "data"].includes(which)) {
|
|
69
64
|
loadData(page2, variables2);
|
|
70
65
|
}
|
|
71
66
|
}
|
|
72
67
|
});
|
|
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
|
-
) });
|
|
68
|
+
return /* @__PURE__ */ jsx(VariableContext.Provider, { value: variables, children: /* @__PURE__ */ jsx(LocationContext.Provider, { value: { pathname: currentURL, params: variables ?? {} }, children: /* @__PURE__ */ jsx(PageComponent, { url: currentURL }, page.id) }) });
|
|
84
69
|
}
|
|
85
70
|
const useLocation = () => useContext(LocationContext);
|
|
86
71
|
function usePageData({
|
|
@@ -99,13 +84,9 @@ function usePageData({
|
|
|
99
84
|
last_variables
|
|
100
85
|
} = useRouterContext();
|
|
101
86
|
const [session] = useSession();
|
|
102
|
-
function load_query({
|
|
103
|
-
id,
|
|
104
|
-
artifact,
|
|
105
|
-
variables: variables2
|
|
106
|
-
}) {
|
|
87
|
+
function load_query({ id, artifact }) {
|
|
107
88
|
for (const artifact2 of Object.keys(page.documents)) {
|
|
108
|
-
last_variables.set(artifact2,
|
|
89
|
+
last_variables.set(artifact2, variables);
|
|
109
90
|
}
|
|
110
91
|
if (ssr_signals.has(id)) {
|
|
111
92
|
return ssr_signals.get(id);
|
|
@@ -119,7 +100,7 @@ function usePageData({
|
|
|
119
100
|
resolve = res;
|
|
120
101
|
reject = rej;
|
|
121
102
|
observer.send({
|
|
122
|
-
variables
|
|
103
|
+
variables,
|
|
123
104
|
session
|
|
124
105
|
}).then(async () => {
|
|
125
106
|
data_cache.set(id, observer);
|
|
@@ -155,7 +136,7 @@ function usePageData({
|
|
|
155
136
|
variables: ${JSON.stringify(
|
|
156
137
|
marshalInputs({
|
|
157
138
|
artifact: observer.artifact,
|
|
158
|
-
input:
|
|
139
|
+
input: variables,
|
|
159
140
|
config: configFile
|
|
160
141
|
})
|
|
161
142
|
)}
|
|
@@ -196,7 +177,7 @@ function usePageData({
|
|
|
196
177
|
variables: ${JSON.stringify(
|
|
197
178
|
marshalInputs({
|
|
198
179
|
artifact: observer.artifact,
|
|
199
|
-
input:
|
|
180
|
+
input: variables,
|
|
200
181
|
config: configFile
|
|
201
182
|
})
|
|
202
183
|
)}
|
|
@@ -221,9 +202,6 @@ function usePageData({
|
|
|
221
202
|
return resolvable;
|
|
222
203
|
}
|
|
223
204
|
function loadData(targetPage, variables2) {
|
|
224
|
-
if (!targetPage) {
|
|
225
|
-
return;
|
|
226
|
-
}
|
|
227
205
|
for (const [artifact, { variables: pageVariables }] of Object.entries(
|
|
228
206
|
targetPage.documents
|
|
229
207
|
)) {
|
|
@@ -256,14 +234,14 @@ function usePageData({
|
|
|
256
234
|
injectToStream?.(`
|
|
257
235
|
<script type="module" src="${assetPrefix}/artifacts/${artifact.name}.js" async=""><\/script>
|
|
258
236
|
`);
|
|
259
|
-
load_query({ id: artifact.name, artifact
|
|
237
|
+
load_query({ id: artifact.name, artifact });
|
|
260
238
|
}).catch((err) => {
|
|
261
239
|
console.log(err);
|
|
262
240
|
});
|
|
263
241
|
}
|
|
264
242
|
for (const artifact of Object.values(found_artifacts)) {
|
|
265
243
|
if (!data_cache.has(artifact.name)) {
|
|
266
|
-
load_query({ id: artifact.name, artifact
|
|
244
|
+
load_query({ id: artifact.name, artifact });
|
|
267
245
|
}
|
|
268
246
|
}
|
|
269
247
|
}
|
|
@@ -371,9 +349,7 @@ function useCurrentVariables() {
|
|
|
371
349
|
const VariableContext = React.createContext(null);
|
|
372
350
|
const LocationContext = React.createContext({
|
|
373
351
|
pathname: "",
|
|
374
|
-
params: {}
|
|
375
|
-
goto: () => {
|
|
376
|
-
}
|
|
352
|
+
params: {}
|
|
377
353
|
});
|
|
378
354
|
function useQueryResult(name) {
|
|
379
355
|
const { data_cache, artifact_cache } = useRouterContext();
|
|
@@ -434,14 +410,10 @@ function usePreload({ preload }) {
|
|
|
434
410
|
React.useEffect(() => {
|
|
435
411
|
const mouseMove = (e) => {
|
|
436
412
|
const target = e.target;
|
|
437
|
-
if (!(target instanceof
|
|
438
|
-
return;
|
|
439
|
-
}
|
|
440
|
-
const anchor = target.closest("a");
|
|
441
|
-
if (!anchor) {
|
|
413
|
+
if (!(target instanceof HTMLAnchorElement)) {
|
|
442
414
|
return;
|
|
443
415
|
}
|
|
444
|
-
let preloadWhichRaw =
|
|
416
|
+
let preloadWhichRaw = target.attributes.getNamedItem("data-houdini-preload")?.value;
|
|
445
417
|
let preloadWhich = !preloadWhichRaw || preloadWhichRaw === "true" ? "page" : preloadWhichRaw;
|
|
446
418
|
if (!PreloadWhich[preloadWhich]) {
|
|
447
419
|
console.log(
|
|
@@ -453,7 +425,7 @@ function usePreload({ preload }) {
|
|
|
453
425
|
clearTimeout(timeoutRef.current);
|
|
454
426
|
}
|
|
455
427
|
timeoutRef.current = setTimeout(() => {
|
|
456
|
-
const url =
|
|
428
|
+
const url = target.attributes.getNamedItem("href")?.value;
|
|
457
429
|
if (!url) {
|
|
458
430
|
return;
|
|
459
431
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "houdini-react",
|
|
3
|
-
"version": "0.0.0-
|
|
3
|
+
"version": "0.0.0-20240422193548",
|
|
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": "^0.0.0-
|
|
46
|
+
"houdini": "^0.0.0-20240422193548"
|
|
47
47
|
},
|
|
48
48
|
"files": [
|
|
49
49
|
"build"
|