From b5d99d7bc94422aaf2a23a79a92227dd130a69e5 Mon Sep 17 00:00:00 2001
From: Fran Dios
Date: Fri, 25 Feb 2022 18:38:39 +0900
Subject: [PATCH 01/15] Update to latest React 18 experimental
---
.../template-hydrogen-default/package.json | 4 +--
packages/hydrogen/package.json | 4 +--
.../playground/server-components/package.json | 4 +--
yarn.lock | 29 +++++++++----------
4 files changed, 19 insertions(+), 22 deletions(-)
diff --git a/examples/template-hydrogen-default/package.json b/examples/template-hydrogen-default/package.json
index bb23303eaa..73de8fc070 100644
--- a/examples/template-hydrogen-default/package.json
+++ b/examples/template-hydrogen-default/package.json
@@ -39,8 +39,8 @@
"compression": "^1.7.4",
"graphql-tag": "^2.12.4",
"path-to-regexp": "^6.2.0",
- "react": "0.0.0-experimental-529dc3ce8-20220124",
- "react-dom": "0.0.0-experimental-529dc3ce8-20220124",
+ "react": "0.0.0-experimental-8c4cd65cf-20220224",
+ "react-dom": "0.0.0-experimental-8c4cd65cf-20220224",
"serve-static": "^1.14.1"
}
}
diff --git a/packages/hydrogen/package.json b/packages/hydrogen/package.json
index 31b345274a..3d91b32cdf 100644
--- a/packages/hydrogen/package.json
+++ b/packages/hydrogen/package.json
@@ -81,8 +81,8 @@
"peerDependencies": {
"body-parser": "^1.19.1",
"compression": "^1.7.4",
- "react": "0.0.0-experimental-529dc3ce8-20220124",
- "react-dom": "0.0.0-experimental-529dc3ce8-20220124",
+ "react": "0.0.0-experimental-8c4cd65cf-20220224",
+ "react-dom": "0.0.0-experimental-8c4cd65cf-20220224",
"serve-static": "^1.14.1",
"vite": "^2.8.0"
},
diff --git a/packages/playground/server-components/package.json b/packages/playground/server-components/package.json
index cc63b7aad5..3de405b067 100644
--- a/packages/playground/server-components/package.json
+++ b/packages/playground/server-components/package.json
@@ -19,7 +19,7 @@
"@cloudflare/kv-asset-handler": "*",
"@shopify/hydrogen": "^0.11.0",
"miniflare": "^1.3.3",
- "react": "0.0.0-experimental-529dc3ce8-20220124",
- "react-dom": "0.0.0-experimental-529dc3ce8-20220124"
+ "react": "0.0.0-experimental-8c4cd65cf-20220224",
+ "react-dom": "0.0.0-experimental-8c4cd65cf-20220224"
}
}
diff --git a/yarn.lock b/yarn.lock
index 077ba5f419..95e4382907 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9455,14 +9455,13 @@ rc@^1.2.8:
minimist "^1.2.0"
strip-json-comments "~2.0.1"
-react-dom@0.0.0-experimental-529dc3ce8-20220124:
- version "0.0.0-experimental-529dc3ce8-20220124"
- resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-0.0.0-experimental-529dc3ce8-20220124.tgz#62408979d684b43a5bea27934fda15fa31a80f2a"
- integrity sha512-FNqeU2sPoynTu7Sh1IY880Bxg/xX22tlsTHoh67J+PTY7aFBAYMgE5PkxZon54DpQkv2p8gWVIIzSObi4U7ZjQ==
+react-dom@0.0.0-experimental-8c4cd65cf-20220224:
+ version "0.0.0-experimental-8c4cd65cf-20220224"
+ resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-0.0.0-experimental-8c4cd65cf-20220224.tgz#73f18a61123a0ae3c728e7688d284248a46f83a8"
+ integrity sha512-kHfqFaC276cW9wwODEJ29w5nQnmHugNavgmJp4VByQahopVCln2xQcbut6zNAB6PV83Qes6X1W9qHQHwqe66DQ==
dependencies:
loose-envify "^1.1.0"
- object-assign "^4.1.1"
- scheduler "0.0.0-experimental-529dc3ce8-20220124"
+ scheduler "0.0.0-experimental-8c4cd65cf-20220224"
react-error-boundary@^3.1.3:
version "3.1.4"
@@ -9511,13 +9510,12 @@ react-refresh@^0.11.0:
resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046"
integrity sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==
-react@0.0.0-experimental-529dc3ce8-20220124:
- version "0.0.0-experimental-529dc3ce8-20220124"
- resolved "https://registry.yarnpkg.com/react/-/react-0.0.0-experimental-529dc3ce8-20220124.tgz#843efb350b3034c5cb5d3d657ece78a8057b7a2b"
- integrity sha512-EGC2hJU4tjaVgcLHE090M592h+AfO6Y88cnS1XtPMHWBgsNpO4t3rZfLFU4bMor3wRSKPEIzmEcpaPWCrJWctA==
+react@0.0.0-experimental-8c4cd65cf-20220224:
+ version "0.0.0-experimental-8c4cd65cf-20220224"
+ resolved "https://registry.yarnpkg.com/react/-/react-0.0.0-experimental-8c4cd65cf-20220224.tgz#3c381ae8b59d35460d34132e653fc4221f1dd01e"
+ integrity sha512-LSx6wbMqzsjPTitKoFaAjEWk2c23G1W9p4LhCjX0J69rxQh0pj+Cwp+IDbfBGvEy9dRTmy+ytzB3EQaJFy8YvA==
dependencies:
loose-envify "^1.1.0"
- object-assign "^4.1.1"
read-pkg-up@^7.0.1:
version "7.0.1"
@@ -10110,13 +10108,12 @@ saxes@^5.0.1:
dependencies:
xmlchars "^2.2.0"
-scheduler@0.0.0-experimental-529dc3ce8-20220124:
- version "0.0.0-experimental-529dc3ce8-20220124"
- resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.0.0-experimental-529dc3ce8-20220124.tgz#4c3da241ae995e2790688e2a775e7db2e26f9d0f"
- integrity sha512-mp0MaDWUfFuByyQS3syKFF3pqk7m6NcIsTNFsu/7jdy0GCqk7jy3T2YgHF3S1Y0qNhV9TYCgGwLTZSNaae2uUQ==
+scheduler@0.0.0-experimental-8c4cd65cf-20220224:
+ version "0.0.0-experimental-8c4cd65cf-20220224"
+ resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.0.0-experimental-8c4cd65cf-20220224.tgz#56be59abd7f10306c247c713c249fc47ac7c120f"
+ integrity sha512-tKWOYNBIIKOnXC87wWOItdnijE6xsb+s+ckdeia6f4OjPHbZnl7hIJ7K9Gn+71mC8RBw1rgHz+XtnwEAQnXFdQ==
dependencies:
loose-envify "^1.1.0"
- object-assign "^4.1.1"
scheduler@^0.20.2:
version "0.20.2"
From 713bd6ebf3db068bc945adfe706628811ea922a4 Mon Sep 17 00:00:00 2001
From: Fran Dios
Date: Fri, 25 Feb 2022 18:44:11 +0900
Subject: [PATCH 02/15] Update RSC Vite plugin
---
...-vite-writer.browser.development.server.js | 74 +++----
...te-writer.browser.production.min.server.js | 180 ++++++++--------
...dom-vite-writer.node.development.server.js | 74 +++----
...-vite-writer.node.production.min.server.js | 202 +++++++++---------
.../cjs/react-server-dom-vite.development.js | 43 +---
.../react-server-dom-vite.production.min.js | 119 +++++------
...t-server-dom-vite-writer.browser.server.js | 78 +++----
...eact-server-dom-vite-writer.node.server.js | 74 +++----
.../esm/react-server-dom-vite.js | 43 +---
.../vendor/react-server-dom-vite/package.json | 1 -
10 files changed, 346 insertions(+), 542 deletions(-)
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.development.server.js b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.development.server.js
index 174845d232..5680c4c7c8 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.development.server.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.development.server.js
@@ -65,7 +65,7 @@ if (process.env.NODE_ENV !== 'production') {
function scheduleWork(callback) {
callback();
}
- function writeChunk(destination, chunk) {
+ function writeChunkAndReturn(destination, chunk) {
destination.enqueue(chunk);
return destination.desiredSize > 0;
}
@@ -140,46 +140,12 @@ if (process.env.NODE_ENV !== 'production') {
// ATTENTION
// When adding new symbols to this file,
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
- // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
- // nor polyfill, then a plain number is used for performance.
- var REACT_ELEMENT_TYPE = 0xeac7;
- var REACT_PORTAL_TYPE = 0xeaca;
- var REACT_FRAGMENT_TYPE = 0xeacb;
- var REACT_STRICT_MODE_TYPE = 0xeacc;
- var REACT_PROFILER_TYPE = 0xead2;
- var REACT_PROVIDER_TYPE = 0xeacd;
- var REACT_CONTEXT_TYPE = 0xeace;
- var REACT_FORWARD_REF_TYPE = 0xead0;
- var REACT_SUSPENSE_TYPE = 0xead1;
- var REACT_SUSPENSE_LIST_TYPE = 0xead8;
- var REACT_MEMO_TYPE = 0xead3;
- var REACT_LAZY_TYPE = 0xead4;
- var REACT_SCOPE_TYPE = 0xead7;
- var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
- var REACT_OFFSCREEN_TYPE = 0xeae2;
- var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
- var REACT_CACHE_TYPE = 0xeae4;
-
- if (typeof Symbol === 'function' && Symbol.for) {
- var symbolFor = Symbol.for;
- REACT_ELEMENT_TYPE = symbolFor('react.element');
- REACT_PORTAL_TYPE = symbolFor('react.portal');
- REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
- REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
- REACT_PROFILER_TYPE = symbolFor('react.profiler');
- REACT_PROVIDER_TYPE = symbolFor('react.provider');
- REACT_CONTEXT_TYPE = symbolFor('react.context');
- REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
- REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
- REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
- REACT_MEMO_TYPE = symbolFor('react.memo');
- REACT_LAZY_TYPE = symbolFor('react.lazy');
- REACT_SCOPE_TYPE = symbolFor('react.scope');
- REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
- REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
- REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
- REACT_CACHE_TYPE = symbolFor('react.cache');
- }
+ // The Symbol used to tag the ReactElement-like types.
+ var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+ var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
+ var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
+ var REACT_MEMO_TYPE = Symbol.for('react.memo');
+ var REACT_LAZY_TYPE = Symbol.for('react.lazy');
var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
@@ -540,7 +506,7 @@ if (process.env.NODE_ENV !== 'production') {
x.then(ping, ping);
return serializeByRefID(newSegment.id);
} else {
- reportError(request, x); // Something errored. We'll still send everything we have up until this point.
+ logRecoverableError(request, x); // Something errored. We'll still send everything we have up until this point.
// We'll replace this element with a lazy reference that throws on the client
// once it gets rendered.
@@ -737,7 +703,7 @@ if (process.env.NODE_ENV !== 'production') {
);
}
- function reportError(request, error) {
+ function logRecoverableError(request, error) {
var onError = request.onError;
onError(error);
}
@@ -823,7 +789,7 @@ if (process.env.NODE_ENV !== 'production') {
x.then(ping, ping);
return;
} else {
- reportError(request, x); // This errored, we need to serialize this error to the
+ logRecoverableError(request, x); // This errored, we need to serialize this error to the
emitErrorChunk(request, segment.id, x);
}
@@ -849,7 +815,7 @@ if (process.env.NODE_ENV !== 'production') {
flushCompletedChunks(request, request.destination);
}
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
} finally {
ReactCurrentDispatcher.current = prevDispatcher;
@@ -867,8 +833,9 @@ if (process.env.NODE_ENV !== 'production') {
for (; i < moduleChunks.length; i++) {
request.pendingChunks--;
var chunk = moduleChunks[i];
+ var keepWriting = writeChunkAndReturn(destination, chunk);
- if (!writeChunk(destination, chunk)) {
+ if (!keepWriting) {
request.destination = null;
i++;
break;
@@ -884,7 +851,9 @@ if (process.env.NODE_ENV !== 'production') {
request.pendingChunks--;
var _chunk = jsonChunks[i];
- if (!writeChunk(destination, _chunk)) {
+ var _keepWriting = writeChunkAndReturn(destination, _chunk);
+
+ if (!_keepWriting) {
request.destination = null;
i++;
break;
@@ -902,7 +871,9 @@ if (process.env.NODE_ENV !== 'production') {
request.pendingChunks--;
var _chunk2 = errorChunks[i];
- if (!writeChunk(destination, _chunk2)) {
+ var _keepWriting2 = writeChunkAndReturn(destination, _chunk2);
+
+ if (!_keepWriting2) {
request.destination = null;
i++;
break;
@@ -935,12 +906,17 @@ if (process.env.NODE_ENV !== 'production') {
return;
}
+ if (request.destination !== null) {
+ // We're already flowing.
+ return;
+ }
+
request.destination = destination;
try {
flushCompletedChunks(request, destination);
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
}
}
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.production.min.server.js b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.production.min.server.js
index fd881bfeb5..58f9c6f808 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.production.min.server.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.browser.production.min.server.js
@@ -9,7 +9,7 @@
*/
'use strict';
var h = require('react');
-function n(a, d) {
+function p(a, d) {
a.enqueue(d);
return 0 < a.desiredSize;
}
@@ -19,26 +19,18 @@ function r(a, d) {
}
var t = JSON.stringify,
u = Symbol.for('react.module.reference'),
- v = 60103,
- w = 60107,
- x = 60112,
- y = 60115,
- z = 60116;
-if ('function' === typeof Symbol && Symbol.for) {
- var A = Symbol.for;
- v = A('react.element');
- w = A('react.fragment');
- x = A('react.forward_ref');
- y = A('react.memo');
- z = A('react.lazy');
-}
-var B = Array.isArray,
- C =
+ v = Symbol.for('react.element'),
+ w = Symbol.for('react.fragment'),
+ x = Symbol.for('react.forward_ref'),
+ y = Symbol.for('react.memo'),
+ z = Symbol.for('react.lazy'),
+ A = Array.isArray,
+ B =
h.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher;
-function G(a) {
+function F(a) {
console.error(a);
}
-function H(a, d, c) {
+function G(a, d, c) {
var b = [],
e = {
status: 0,
@@ -54,17 +46,17 @@ function H(a, d, c) {
completedErrorChunks: [],
writtenSymbols: new Map(),
writtenModules: new Map(),
- onError: void 0 === c ? G : c,
+ onError: void 0 === c ? F : c,
toJSON: function (a, b) {
- return I(e, this, a, b);
+ return H(e, this, a, b);
},
};
e.pendingChunks++;
- a = J(e, a);
+ a = I(e, a);
b.push(a);
return e;
}
-function K(a, d, c, b) {
+function J(a, d, c, b) {
if (null !== c && void 0 !== c)
throw Error(
'Refs cannot be used in server components, nor passed to client components.'
@@ -78,12 +70,12 @@ function K(a, d, c, b) {
case x:
return (a = a.render), a(b, void 0);
case y:
- return K(a.type, d, c, b);
+ return J(a.type, d, c, b);
}
}
- throw Error('Unsupported server component type: ' + L(a));
+ throw Error('Unsupported server component type: ' + K(a));
}
-function J(a, d) {
+function I(a, d) {
var c = {
id: a.nextChunkId++,
model: d,
@@ -106,12 +98,12 @@ function O(a) {
var d = JSON.stringify(a);
return '"' + a + '"' === d ? a : d;
}
-function L(a) {
+function K(a) {
switch (typeof a) {
case 'string':
return JSON.stringify(10 >= a.length ? a : a.substr(0, 10) + '...');
case 'object':
- if (B(a)) return '[...]';
+ if (A(a)) return '[...]';
a = N(a);
return 'Object' === a ? '{...}' : a;
case 'function':
@@ -121,7 +113,7 @@ function L(a) {
}
}
function P(a, d) {
- if (B(a)) {
+ if (A(a)) {
for (var c = '[', b = 0; b < a.length; b++) {
0 < b && (c += ', ');
if (6 < b) {
@@ -132,7 +124,7 @@ function P(a, d) {
c =
'' + b === d && 'object' === typeof e && null !== e
? c + P(e)
- : c + L(e);
+ : c + K(e);
}
return c + ']';
}
@@ -147,11 +139,11 @@ function P(a, d) {
var f = b[e];
c += O(f) + ': ';
var k = a[f];
- c = f === d && 'object' === typeof k && null !== k ? c + P(k) : c + L(k);
+ c = f === d && 'object' === typeof k && null !== k ? c + P(k) : c + K(k);
}
return c + '}';
}
-function I(a, d, c, b) {
+function H(a, d, c, b) {
switch (b) {
case v:
return '$';
@@ -161,20 +153,20 @@ function I(a, d, c, b) {
for (; 'object' === typeof b && null !== b && b.$$typeof === v; ) {
var e = b;
try {
- b = K(e.type, e.key, e.ref, e.props);
+ b = J(e.type, e.key, e.ref, e.props);
} catch (m) {
if ('object' === typeof m && null !== m && 'function' === typeof m.then)
return (
a.pendingChunks++,
- (a = J(a, b)),
+ (a = I(a, b)),
(d = a.ping),
m.then(d, d),
'@' + a.id.toString(16)
);
- R(a, m);
+ Q(a, m);
a.pendingChunks++;
d = a.nextChunkId++;
- S(a, d, m);
+ R(a, d, m);
return '@' + d.toString(16);
}
}
@@ -192,10 +184,10 @@ function I(a, d, c, b) {
var l = {id: b.filepath, name: b.name};
a.pendingChunks++;
var g = a.nextChunkId++,
- D = t(l),
- E = 'M' + g.toString(16) + ':' + D + '\n';
- var F = q.encode(E);
- a.completedModuleChunks.push(F);
+ C = t(l),
+ D = 'M' + g.toString(16) + ':' + C + '\n';
+ var E = q.encode(D);
+ a.completedModuleChunks.push(E);
f.set(e, g);
return d[0] === v && '1' === c
? '@' + g.toString(16)
@@ -204,7 +196,7 @@ function I(a, d, c, b) {
return (
a.pendingChunks++,
(d = a.nextChunkId++),
- S(a, d, m),
+ R(a, d, m),
'$' + d.toString(16)
);
}
@@ -271,16 +263,16 @@ function I(a, d, c, b) {
(O(c) + ' from this object, or avoid the entire object: ' + P(d))
);
}
-function R(a, d) {
+function Q(a, d) {
a = a.onError;
a(d);
}
-function T(a, d) {
+function S(a, d) {
null !== a.destination
? ((a.status = 2), r(a.destination, d))
: ((a.status = 1), (a.fatalError = d));
}
-function S(a, d, c) {
+function R(a, d, c) {
var b = '';
try {
if (c instanceof Error) {
@@ -296,10 +288,10 @@ function S(a, d, c) {
a.completedErrorChunks.push(d);
}
function M(a) {
- var d = C.current,
- c = U;
- C.current = V;
- U = a.cache;
+ var d = B.current,
+ c = T;
+ B.current = U;
+ T = a.cache;
try {
var b = a.pingedSegments;
a.pingedSegments = [];
@@ -314,34 +306,34 @@ function M(a) {
) {
var g = l;
f.model = l;
- l = K(g.type, g.key, g.ref, g.props);
+ l = J(g.type, g.key, g.ref, g.props);
}
- var D = f.id,
- E = t(l, k.toJSON),
- F = 'J' + D.toString(16) + ':' + E + '\n';
- var m = q.encode(F);
+ var C = f.id,
+ D = t(l, k.toJSON),
+ E = 'J' + C.toString(16) + ':' + D + '\n';
+ var m = q.encode(E);
k.completedJSONChunks.push(m);
- } catch (p) {
+ } catch (n) {
if (
- 'object' === typeof p &&
- null !== p &&
- 'function' === typeof p.then
+ 'object' === typeof n &&
+ null !== n &&
+ 'function' === typeof n.then
) {
- var Q = f.ping;
- p.then(Q, Q);
- } else R(k, p), S(k, f.id, p);
+ var L = f.ping;
+ n.then(L, L);
+ } else Q(k, n), R(k, f.id, n);
}
}
- null !== a.destination && W(a, a.destination);
- } catch (p) {
- R(a, p), T(a, p);
+ null !== a.destination && V(a, a.destination);
+ } catch (n) {
+ Q(a, n), S(a, n);
} finally {
- (C.current = d), (U = c);
+ (B.current = d), (T = c);
}
}
-function W(a, d) {
+function V(a, d) {
for (var c = a.completedModuleChunks, b = 0; b < c.length; b++)
- if ((a.pendingChunks--, !n(d, c[b]))) {
+ if ((a.pendingChunks--, !p(d, c[b]))) {
a.destination = null;
b++;
break;
@@ -349,7 +341,7 @@ function W(a, d) {
c.splice(0, b);
c = a.completedJSONChunks;
for (b = 0; b < c.length; b++)
- if ((a.pendingChunks--, !n(d, c[b]))) {
+ if ((a.pendingChunks--, !p(d, c[b]))) {
a.destination = null;
b++;
break;
@@ -357,7 +349,7 @@ function W(a, d) {
c.splice(0, b);
c = a.completedErrorChunks;
for (b = 0; b < c.length; b++)
- if ((a.pendingChunks--, !n(d, c[b]))) {
+ if ((a.pendingChunks--, !p(d, c[b]))) {
a.destination = null;
b++;
break;
@@ -365,15 +357,15 @@ function W(a, d) {
c.splice(0, b);
0 === a.pendingChunks && d.close();
}
-function X() {
+function W() {
throw Error('This Hook is not supported in Server Components.');
}
-function Y() {
- if (!U)
+function X() {
+ if (!T)
throw Error('Refreshing the cache is not supported in Server Components.');
}
-var U = null,
- V = {
+var T = null,
+ U = {
useMemo: function (a) {
return a();
},
@@ -381,33 +373,33 @@ var U = null,
return a;
},
useDebugValue: function () {},
- useDeferredValue: X,
- useTransition: X,
+ useDeferredValue: W,
+ useTransition: W,
getCacheForType: function (a) {
- if (!U)
+ if (!T)
throw Error('Reading the cache is only supported while rendering.');
- var d = U.get(a);
- void 0 === d && ((d = a()), U.set(a, d));
+ var d = T.get(a);
+ void 0 === d && ((d = a()), T.set(a, d));
return d;
},
- readContext: X,
- useContext: X,
- useReducer: X,
- useRef: X,
- useState: X,
- useInsertionEffect: X,
- useLayoutEffect: X,
- useImperativeHandle: X,
- useEffect: X,
- useId: X,
- useMutableSource: X,
- useSyncExternalStore: X,
+ readContext: W,
+ useContext: W,
+ useReducer: W,
+ useRef: W,
+ useState: W,
+ useInsertionEffect: W,
+ useLayoutEffect: W,
+ useImperativeHandle: W,
+ useEffect: W,
+ useId: W,
+ useMutableSource: W,
+ useSyncExternalStore: W,
useCacheRefresh: function () {
- return Y;
+ return X;
},
};
exports.renderToReadableStream = function (a, d) {
- var c = H(a, {}, d ? d.onError : void 0),
+ var c = G(a, {}, d ? d.onError : void 0),
b = new ReadableStream({
start: function () {
M(c);
@@ -415,12 +407,12 @@ exports.renderToReadableStream = function (a, d) {
pull: function (a) {
if (b.locked)
if (1 === c.status) (c.status = 2), r(a, c.fatalError);
- else if (2 !== c.status) {
+ else if (2 !== c.status && null === c.destination) {
c.destination = a;
try {
- W(c, a);
+ V(c, a);
} catch (f) {
- R(c, f), T(c, f);
+ Q(c, f), S(c, f);
}
}
},
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.development.server.js b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.development.server.js
index 1c758ecc79..993077cbd1 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.development.server.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.development.server.js
@@ -80,7 +80,7 @@ if (process.env.NODE_ENV !== 'production') {
destination.cork();
}
}
- function writeChunk(destination, chunk) {
+ function writeChunkAndReturn(destination, chunk) {
var nodeBuffer = chunk; // close enough
return destination.write(nodeBuffer);
@@ -151,46 +151,12 @@ if (process.env.NODE_ENV !== 'production') {
// ATTENTION
// When adding new symbols to this file,
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
- // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
- // nor polyfill, then a plain number is used for performance.
- var REACT_ELEMENT_TYPE = 0xeac7;
- var REACT_PORTAL_TYPE = 0xeaca;
- var REACT_FRAGMENT_TYPE = 0xeacb;
- var REACT_STRICT_MODE_TYPE = 0xeacc;
- var REACT_PROFILER_TYPE = 0xead2;
- var REACT_PROVIDER_TYPE = 0xeacd;
- var REACT_CONTEXT_TYPE = 0xeace;
- var REACT_FORWARD_REF_TYPE = 0xead0;
- var REACT_SUSPENSE_TYPE = 0xead1;
- var REACT_SUSPENSE_LIST_TYPE = 0xead8;
- var REACT_MEMO_TYPE = 0xead3;
- var REACT_LAZY_TYPE = 0xead4;
- var REACT_SCOPE_TYPE = 0xead7;
- var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
- var REACT_OFFSCREEN_TYPE = 0xeae2;
- var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
- var REACT_CACHE_TYPE = 0xeae4;
-
- if (typeof Symbol === 'function' && Symbol.for) {
- var symbolFor = Symbol.for;
- REACT_ELEMENT_TYPE = symbolFor('react.element');
- REACT_PORTAL_TYPE = symbolFor('react.portal');
- REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
- REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
- REACT_PROFILER_TYPE = symbolFor('react.profiler');
- REACT_PROVIDER_TYPE = symbolFor('react.provider');
- REACT_CONTEXT_TYPE = symbolFor('react.context');
- REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
- REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
- REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
- REACT_MEMO_TYPE = symbolFor('react.memo');
- REACT_LAZY_TYPE = symbolFor('react.lazy');
- REACT_SCOPE_TYPE = symbolFor('react.scope');
- REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
- REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
- REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
- REACT_CACHE_TYPE = symbolFor('react.cache');
- }
+ // The Symbol used to tag the ReactElement-like types.
+ var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+ var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
+ var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
+ var REACT_MEMO_TYPE = Symbol.for('react.memo');
+ var REACT_LAZY_TYPE = Symbol.for('react.lazy');
var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
@@ -551,7 +517,7 @@ if (process.env.NODE_ENV !== 'production') {
x.then(ping, ping);
return serializeByRefID(newSegment.id);
} else {
- reportError(request, x); // Something errored. We'll still send everything we have up until this point.
+ logRecoverableError(request, x); // Something errored. We'll still send everything we have up until this point.
// We'll replace this element with a lazy reference that throws on the client
// once it gets rendered.
@@ -748,7 +714,7 @@ if (process.env.NODE_ENV !== 'production') {
);
}
- function reportError(request, error) {
+ function logRecoverableError(request, error) {
var onError = request.onError;
onError(error);
}
@@ -834,7 +800,7 @@ if (process.env.NODE_ENV !== 'production') {
x.then(ping, ping);
return;
} else {
- reportError(request, x); // This errored, we need to serialize this error to the
+ logRecoverableError(request, x); // This errored, we need to serialize this error to the
emitErrorChunk(request, segment.id, x);
}
@@ -860,7 +826,7 @@ if (process.env.NODE_ENV !== 'production') {
flushCompletedChunks(request, request.destination);
}
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
} finally {
ReactCurrentDispatcher.current = prevDispatcher;
@@ -880,8 +846,9 @@ if (process.env.NODE_ENV !== 'production') {
for (; i < moduleChunks.length; i++) {
request.pendingChunks--;
var chunk = moduleChunks[i];
+ var keepWriting = writeChunkAndReturn(destination, chunk);
- if (!writeChunk(destination, chunk)) {
+ if (!keepWriting) {
request.destination = null;
i++;
break;
@@ -897,7 +864,9 @@ if (process.env.NODE_ENV !== 'production') {
request.pendingChunks--;
var _chunk = jsonChunks[i];
- if (!writeChunk(destination, _chunk)) {
+ var _keepWriting = writeChunkAndReturn(destination, _chunk);
+
+ if (!_keepWriting) {
request.destination = null;
i++;
break;
@@ -915,7 +884,9 @@ if (process.env.NODE_ENV !== 'production') {
request.pendingChunks--;
var _chunk2 = errorChunks[i];
- if (!writeChunk(destination, _chunk2)) {
+ var _keepWriting2 = writeChunkAndReturn(destination, _chunk2);
+
+ if (!_keepWriting2) {
request.destination = null;
i++;
break;
@@ -951,12 +922,17 @@ if (process.env.NODE_ENV !== 'production') {
return;
}
+ if (request.destination !== null) {
+ // We're already flowing.
+ return;
+ }
+
request.destination = destination;
try {
flushCompletedChunks(request, destination);
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
}
}
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.production.min.server.js b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.production.min.server.js
index da0ef29700..3b4ba67531 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.production.min.server.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite-writer.node.production.min.server.js
@@ -9,28 +9,20 @@
*/
'use strict';
var h = require('react'),
- n = JSON.stringify,
+ p = JSON.stringify,
q = Symbol.for('react.module.reference'),
- r = 60103,
- t = 60107,
- u = 60112,
- v = 60115,
- w = 60116;
-if ('function' === typeof Symbol && Symbol.for) {
- var x = Symbol.for;
- r = x('react.element');
- t = x('react.fragment');
- u = x('react.forward_ref');
- v = x('react.memo');
- w = x('react.lazy');
-}
-var y = Array.isArray,
- z =
+ r = Symbol.for('react.element'),
+ t = Symbol.for('react.fragment'),
+ u = Symbol.for('react.forward_ref'),
+ v = Symbol.for('react.memo'),
+ w = Symbol.for('react.lazy'),
+ x = Array.isArray,
+ y =
h.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher;
-function A(a) {
+function z(a) {
console.error(a);
}
-function D(a, c, d) {
+function C(a, c, d) {
var b = [],
e = {
status: 0,
@@ -46,17 +38,17 @@ function D(a, c, d) {
completedErrorChunks: [],
writtenSymbols: new Map(),
writtenModules: new Map(),
- onError: void 0 === d ? A : d,
+ onError: void 0 === d ? z : d,
toJSON: function (a, b) {
- return E(e, this, a, b);
+ return D(e, this, a, b);
},
};
e.pendingChunks++;
- a = F(e, a);
+ a = E(e, a);
b.push(a);
return e;
}
-function G(a, c, d, b) {
+function F(a, c, d, b) {
if (null !== d && void 0 !== d)
throw Error(
'Refs cannot be used in server components, nor passed to client components.'
@@ -70,10 +62,10 @@ function G(a, c, d, b) {
case u:
return (a = a.render), a(b, void 0);
case v:
- return G(a.type, c, d, b);
+ return F(a.type, c, d, b);
}
}
- throw Error('Unsupported server component type: ' + H(a));
+ throw Error('Unsupported server component type: ' + G(a));
}
function I(a, c) {
var d = a.pingedSegments;
@@ -83,7 +75,7 @@ function I(a, c) {
return J(a);
});
}
-function F(a, c) {
+function E(a, c) {
var d = {
id: a.nextChunkId++,
model: c,
@@ -104,12 +96,12 @@ function L(a) {
var c = JSON.stringify(a);
return '"' + a + '"' === c ? a : c;
}
-function H(a) {
+function G(a) {
switch (typeof a) {
case 'string':
return JSON.stringify(10 >= a.length ? a : a.substr(0, 10) + '...');
case 'object':
- if (y(a)) return '[...]';
+ if (x(a)) return '[...]';
a = K(a);
return 'Object' === a ? '{...}' : a;
case 'function':
@@ -118,8 +110,8 @@ function H(a) {
return String(a);
}
}
-function N(a, c) {
- if (y(a)) {
+function M(a, c) {
+ if (x(a)) {
for (var d = '[', b = 0; b < a.length; b++) {
0 < b && (d += ', ');
if (6 < b) {
@@ -129,8 +121,8 @@ function N(a, c) {
var e = a[b];
d =
'' + b === c && 'object' === typeof e && null !== e
- ? d + N(e)
- : d + H(e);
+ ? d + M(e)
+ : d + G(e);
}
return d + ']';
}
@@ -145,11 +137,11 @@ function N(a, c) {
var f = b[e];
d += L(f) + ': ';
var k = a[f];
- d = f === c && 'object' === typeof k && null !== k ? d + N(k) : d + H(k);
+ d = f === c && 'object' === typeof k && null !== k ? d + M(k) : d + G(k);
}
return d + '}';
}
-function E(a, c, d, b) {
+function D(a, c, d, b) {
switch (b) {
case r:
return '$';
@@ -159,20 +151,20 @@ function E(a, c, d, b) {
for (; 'object' === typeof b && null !== b && b.$$typeof === r; ) {
var e = b;
try {
- b = G(e.type, e.key, e.ref, e.props);
+ b = F(e.type, e.key, e.ref, e.props);
} catch (m) {
if ('object' === typeof m && null !== m && 'function' === typeof m.then)
return (
a.pendingChunks++,
- (a = F(a, b)),
+ (a = E(a, b)),
(c = a.ping),
m.then(c, c),
'@' + a.id.toString(16)
);
- O(a, m);
+ N(a, m);
a.pendingChunks++;
c = a.nextChunkId++;
- P(a, c, m);
+ O(a, c, m);
return '@' + c.toString(16);
}
}
@@ -190,9 +182,9 @@ function E(a, c, d, b) {
var l = {id: b.filepath, name: b.name};
a.pendingChunks++;
var g = a.nextChunkId++,
- B = n(l);
- var C = 'M' + g.toString(16) + ':' + B + '\n';
- a.completedModuleChunks.push(C);
+ A = p(l);
+ var B = 'M' + g.toString(16) + ':' + A + '\n';
+ a.completedModuleChunks.push(B);
f.set(e, g);
return c[0] === r && '1' === d
? '@' + g.toString(16)
@@ -201,7 +193,7 @@ function E(a, c, d, b) {
return (
a.pendingChunks++,
(c = a.nextChunkId++),
- P(a, c, m),
+ O(a, c, m),
'$' + c.toString(16)
);
}
@@ -222,7 +214,7 @@ function E(a, c, d, b) {
'Event handlers cannot be passed to client component props. Remove ' +
(L(d) +
' from these props if possible: ' +
- N(c) +
+ M(c) +
'\nIf you need interactivity, consider converting part of this to a client component.')
);
throw Error(
@@ -231,7 +223,7 @@ function E(a, c, d, b) {
' (' +
(b.displayName || b.name || 'function') +
') from this object, or avoid the entire object: ' +
- N(c))
+ M(c))
);
}
if ('symbol' === typeof b) {
@@ -243,11 +235,11 @@ function E(a, c, d, b) {
throw Error(
'Only global symbols received from Symbol.for(...) can be passed to client components. The symbol Symbol.for(' +
(b.description + ') cannot be found among global symbols. Remove ') +
- (L(d) + ' from this object, or avoid the entire object: ' + N(c))
+ (L(d) + ' from this object, or avoid the entire object: ' + M(c))
);
a.pendingChunks++;
c = a.nextChunkId++;
- d = n(g);
+ d = p(g);
d = 'S' + c.toString(16) + ':' + d + '\n';
a.completedModuleChunks.push(d);
l.set(b, c);
@@ -258,25 +250,25 @@ function E(a, c, d, b) {
'BigInt (' +
b +
') is not yet supported in client component props. Remove ' +
- (L(d) + ' from this object or use a plain number instead: ' + N(c))
+ (L(d) + ' from this object or use a plain number instead: ' + M(c))
);
throw Error(
'Type ' +
typeof b +
' is not supported in client component props. Remove ' +
- (L(d) + ' from this object, or avoid the entire object: ' + N(c))
+ (L(d) + ' from this object, or avoid the entire object: ' + M(c))
);
}
-function O(a, c) {
+function N(a, c) {
a = a.onError;
a(c);
}
-function Q(a, c) {
+function P(a, c) {
null !== a.destination
? ((a.status = 2), a.destination.destroy(c))
: ((a.status = 1), (a.fatalError = c));
}
-function P(a, c, d) {
+function O(a, c, d) {
var b = '';
try {
if (d instanceof Error) {
@@ -287,14 +279,14 @@ function P(a, c, d) {
e = 'An error occurred but serializing the error message failed.';
}
d = {message: e, stack: b};
- c = 'E' + c.toString(16) + ':' + n(d) + '\n';
+ c = 'E' + c.toString(16) + ':' + p(d) + '\n';
a.completedErrorChunks.push(c);
}
function J(a) {
- var c = z.current,
- d = R;
- z.current = S;
- R = a.cache;
+ var c = y.current,
+ d = Q;
+ y.current = R;
+ Q = a.cache;
try {
var b = a.pingedSegments;
a.pingedSegments = [];
@@ -309,31 +301,31 @@ function J(a) {
) {
var g = l;
f.model = l;
- l = G(g.type, g.key, g.ref, g.props);
+ l = F(g.type, g.key, g.ref, g.props);
}
- var B = f.id,
- C = n(l, k.toJSON);
- var m = 'J' + B.toString(16) + ':' + C + '\n';
+ var A = f.id,
+ B = p(l, k.toJSON);
+ var m = 'J' + A.toString(16) + ':' + B + '\n';
k.completedJSONChunks.push(m);
- } catch (p) {
+ } catch (n) {
if (
- 'object' === typeof p &&
- null !== p &&
- 'function' === typeof p.then
+ 'object' === typeof n &&
+ null !== n &&
+ 'function' === typeof n.then
) {
- var M = f.ping;
- p.then(M, M);
- } else O(k, p), P(k, f.id, p);
+ var H = f.ping;
+ n.then(H, H);
+ } else N(k, n), O(k, f.id, n);
}
}
- null !== a.destination && T(a, a.destination);
- } catch (p) {
- O(a, p), Q(a, p);
+ null !== a.destination && S(a, a.destination);
+ } catch (n) {
+ N(a, n), P(a, n);
} finally {
- (z.current = c), (R = d);
+ (y.current = c), (Q = d);
}
}
-function T(a, c) {
+function S(a, c) {
'function' === typeof c.cork && c.cork();
try {
for (var d = a.completedModuleChunks, b = 0; b < d.length; b++)
@@ -365,31 +357,31 @@ function T(a, c) {
'function' === typeof c.flush && c.flush();
0 === a.pendingChunks && c.end();
}
-function U(a) {
+function T(a) {
setImmediate(function () {
return J(a);
});
}
-function V(a, c) {
+function U(a, c) {
if (1 === a.status) (a.status = 2), c.destroy(a.fatalError);
- else if (2 !== a.status) {
+ else if (2 !== a.status && null === a.destination) {
a.destination = c;
try {
- T(a, c);
+ S(a, c);
} catch (d) {
- O(a, d), Q(a, d);
+ N(a, d), P(a, d);
}
}
}
-function W() {
+function V() {
throw Error('This Hook is not supported in Server Components.');
}
-function X() {
- if (!R)
+function W() {
+ if (!Q)
throw Error('Refreshing the cache is not supported in Server Components.');
}
-var R = null,
- S = {
+var Q = null,
+ R = {
useMemo: function (a) {
return a();
},
@@ -397,40 +389,40 @@ var R = null,
return a;
},
useDebugValue: function () {},
- useDeferredValue: W,
- useTransition: W,
+ useDeferredValue: V,
+ useTransition: V,
getCacheForType: function (a) {
- if (!R)
+ if (!Q)
throw Error('Reading the cache is only supported while rendering.');
- var c = R.get(a);
- void 0 === c && ((c = a()), R.set(a, c));
+ var c = Q.get(a);
+ void 0 === c && ((c = a()), Q.set(a, c));
return c;
},
- readContext: W,
- useContext: W,
- useReducer: W,
- useRef: W,
- useState: W,
- useInsertionEffect: W,
- useLayoutEffect: W,
- useImperativeHandle: W,
- useEffect: W,
- useId: W,
- useMutableSource: W,
- useSyncExternalStore: W,
+ readContext: V,
+ useContext: V,
+ useReducer: V,
+ useRef: V,
+ useState: V,
+ useInsertionEffect: V,
+ useLayoutEffect: V,
+ useImperativeHandle: V,
+ useEffect: V,
+ useId: V,
+ useMutableSource: V,
+ useSyncExternalStore: V,
useCacheRefresh: function () {
- return X;
+ return W;
},
};
-function Y(a, c) {
+function X(a, c) {
return function () {
- return V(c, a);
+ return U(c, a);
};
}
exports.renderToPipeableStream = function (a, c) {
- var d = D(a, {}, c ? c.onError : void 0),
+ var d = C(a, {}, c ? c.onError : void 0),
b = !1;
- U(d);
+ T(d);
return {
pipe: function (a) {
if (b)
@@ -438,8 +430,8 @@ exports.renderToPipeableStream = function (a, c) {
'React currently only supports piping to one writable stream.'
);
b = !0;
- V(d, a);
- a.on('drain', Y(a, d));
+ U(d, a);
+ a.on('drain', X(a, d));
return a;
},
};
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.development.js b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.development.js
index 3a84c2aadc..912dbc5621 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.development.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.development.js
@@ -94,46 +94,9 @@ if (process.env.NODE_ENV !== 'production') {
// ATTENTION
// When adding new symbols to this file,
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
- // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
- // nor polyfill, then a plain number is used for performance.
- var REACT_ELEMENT_TYPE = 0xeac7;
- var REACT_PORTAL_TYPE = 0xeaca;
- var REACT_FRAGMENT_TYPE = 0xeacb;
- var REACT_STRICT_MODE_TYPE = 0xeacc;
- var REACT_PROFILER_TYPE = 0xead2;
- var REACT_PROVIDER_TYPE = 0xeacd;
- var REACT_CONTEXT_TYPE = 0xeace;
- var REACT_FORWARD_REF_TYPE = 0xead0;
- var REACT_SUSPENSE_TYPE = 0xead1;
- var REACT_SUSPENSE_LIST_TYPE = 0xead8;
- var REACT_MEMO_TYPE = 0xead3;
- var REACT_LAZY_TYPE = 0xead4;
- var REACT_SCOPE_TYPE = 0xead7;
- var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
- var REACT_OFFSCREEN_TYPE = 0xeae2;
- var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
- var REACT_CACHE_TYPE = 0xeae4;
-
- if (typeof Symbol === 'function' && Symbol.for) {
- var symbolFor = Symbol.for;
- REACT_ELEMENT_TYPE = symbolFor('react.element');
- REACT_PORTAL_TYPE = symbolFor('react.portal');
- REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
- REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
- REACT_PROFILER_TYPE = symbolFor('react.profiler');
- REACT_PROVIDER_TYPE = symbolFor('react.provider');
- REACT_CONTEXT_TYPE = symbolFor('react.context');
- REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
- REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
- REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
- REACT_MEMO_TYPE = symbolFor('react.memo');
- REACT_LAZY_TYPE = symbolFor('react.lazy');
- REACT_SCOPE_TYPE = symbolFor('react.scope');
- REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
- REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
- REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
- REACT_CACHE_TYPE = symbolFor('react.cache');
- }
+ // The Symbol used to tag the ReactElement-like types.
+ var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+ var REACT_LAZY_TYPE = Symbol.for('react.lazy');
var PENDING = 0;
var RESOLVED_MODEL = 1;
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.production.min.js b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.production.min.js
index 0b7d3cce1c..ed23fa79a3 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.production.min.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/cjs/react-server-dom-vite.production.min.js
@@ -11,7 +11,7 @@
var g = {stream: !0},
h = {__INJECTED_CLIENT_IMPORTERS__: null};
'undefined' !== typeof jest && (global.allClientComponents = h);
-function k(a) {
+function l(a) {
var b = h[a];
return b
? 'function' === typeof b
@@ -26,26 +26,21 @@ function n(a) {
return a;
}
var c = a.id;
- m.has(c) || ((a = k(c)), b(a), a.then(b, b));
+ m.has(c) || ((a = l(c)), b(a), a.then(b, b));
}
-var p = 60103,
- q = 60116;
-if ('function' === typeof Symbol && Symbol.for) {
- var r = Symbol.for;
- p = r('react.element');
- q = r('react.lazy');
-}
-function u(a, b, c) {
+var p = Symbol.for('react.element'),
+ q = Symbol.for('react.lazy');
+function r(a, b, c) {
this._status = a;
this._value = b;
this._response = c;
}
-u.prototype.then = function (a) {
+r.prototype.then = function (a) {
0 === this._status
? (null === this._value && (this._value = []), this._value.push(a))
: a();
};
-function v(a) {
+function u(a) {
switch (a._status) {
case 3:
return a._value;
@@ -67,56 +62,56 @@ function v(a) {
throw a._value;
}
}
-function w() {
- var a = x(this, 0);
- return v(a);
+function v() {
+ var a = w(this, 0);
+ return u(a);
}
-function y(a, b) {
- return new u(3, b, a);
+function x(a, b) {
+ return new r(3, b, a);
}
-function z(a) {
+function y(a) {
if (null !== a) for (var b = 0; b < a.length; b++) (0, a[b])();
}
-function A(a, b) {
+function z(a, b) {
if (0 === a._status) {
var c = a._value;
a._status = 4;
a._value = b;
- z(c);
+ y(c);
}
}
-function B(a, b) {
+function A(a, b) {
a._chunks.forEach(function (a) {
- A(a, b);
+ z(a, b);
});
}
-function x(a, b) {
+function w(a, b) {
var c = a._chunks,
d = c.get(b);
- d || ((d = new u(0, null, a)), c.set(b, d));
+ d || ((d = new r(0, null, a)), c.set(b, d));
return d;
}
-function C(a, b, c) {
+function B(a, b, c) {
switch (c[0]) {
case '$':
if ('$' === c) return p;
if ('$' === c[1] || '@' === c[1]) return c.substring(1);
b = parseInt(c.substring(1), 16);
- a = x(a, b);
- return v(a);
+ a = w(a, b);
+ return u(a);
case '@':
return (
(b = parseInt(c.substring(1), 16)),
- (a = x(a, b)),
- {$$typeof: q, _payload: a, _init: v}
+ (a = w(a, b)),
+ {$$typeof: q, _payload: a, _init: u}
);
}
return c;
}
-function D(a) {
- B(a, Error('Connection closed.'));
+function C(a) {
+ A(a, Error('Connection closed.'));
}
-function E(a, b) {
+function D(a, b) {
if ('' !== b) {
var c = b[0],
d = b.indexOf(':', 1),
@@ -127,8 +122,8 @@ function E(a, b) {
d = a._chunks;
(c = d.get(e))
? 0 === c._status &&
- ((a = c._value), (c._status = 1), (c._value = b), z(a))
- : d.set(e, new u(1, b, a));
+ ((a = c._value), (c._status = 1), (c._value = b), y(a))
+ : d.set(e, new r(1, b, a));
break;
case 'M':
d = a._chunks;
@@ -137,19 +132,19 @@ function E(a, b) {
n(b);
c
? 0 === c._status &&
- ((a = c._value), (c._status = 2), (c._value = b), z(a))
- : d.set(e, new u(2, b, a));
+ ((a = c._value), (c._status = 2), (c._value = b), y(a))
+ : d.set(e, new r(2, b, a));
break;
case 'S':
b = JSON.parse(b);
- a._chunks.set(e, y(a, Symbol.for(b)));
+ a._chunks.set(e, x(a, Symbol.for(b)));
break;
case 'E':
c = JSON.parse(b);
b = Error(c.message);
b.stack = c.stack;
c = a._chunks;
- (d = c.get(e)) ? A(d, b) : c.set(e, new u(4, b, a));
+ (d = c.get(e)) ? z(d, b) : c.set(e, new r(4, b, a));
break;
default:
throw Error(
@@ -158,10 +153,10 @@ function E(a, b) {
}
}
}
-function F(a) {
+function E(a) {
return function (b, c) {
return 'string' === typeof c
- ? C(a, this, c)
+ ? B(a, this, c)
: 'object' === typeof c && null !== c
? ((b =
c[0] === p
@@ -178,60 +173,60 @@ function F(a) {
: c;
};
}
-function G() {
+function F() {
var a = new TextDecoder();
- a = {_chunks: new Map(), readRoot: w, _partialRow: '', _stringDecoder: a};
- a._fromJSON = F(a);
+ a = {_chunks: new Map(), readRoot: v, _partialRow: '', _stringDecoder: a};
+ a._fromJSON = E(a);
return a;
}
-function H(a, b) {
+function G(a, b) {
function c(b) {
- var l = b.value;
- if (b.done) D(a);
+ var k = b.value;
+ if (b.done) C(a);
else {
- b = l;
- l = a._stringDecoder;
+ b = k;
+ k = a._stringDecoder;
for (var f = b.indexOf(10); -1 < f; ) {
- var I = a._partialRow;
+ var H = a._partialRow;
var t = b.subarray(0, f);
- t = l.decode(t);
- E(a, I + t);
+ t = k.decode(t);
+ D(a, H + t);
a._partialRow = '';
b = b.subarray(f + 1);
f = b.indexOf(10);
}
- a._partialRow += l.decode(b, g);
+ a._partialRow += k.decode(b, g);
return e.read().then(c, d);
}
}
function d(b) {
- B(a, b);
+ A(a, b);
}
var e = b.getReader();
e.read().then(c, d);
}
exports.createFromFetch = function (a) {
- var b = G();
+ var b = F();
a.then(
function (a) {
- H(b, a.body);
+ G(b, a.body);
},
function (a) {
- B(b, a);
+ A(b, a);
}
);
return b;
};
exports.createFromReadableStream = function (a) {
- var b = G();
- H(b, a);
+ var b = F();
+ G(b, a);
return b;
};
exports.createFromXHR = function (a) {
function b() {
for (var b = a.responseText, c = e, f = b.indexOf('\n', c); -1 < f; )
(c = d._partialRow + b.substring(c, f)),
- E(d, c),
+ D(d, c),
(d._partialRow = ''),
(c = f + 1),
(f = b.indexOf('\n', c));
@@ -239,14 +234,14 @@ exports.createFromXHR = function (a) {
e = b.length;
}
function c() {
- B(d, new TypeError('Network error'));
+ A(d, new TypeError('Network error'));
}
- var d = G(),
+ var d = F(),
e = 0;
a.addEventListener('progress', b);
a.addEventListener('load', function () {
b();
- D(d);
+ C(d);
});
a.addEventListener('error', c);
a.addEventListener('abort', c);
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.browser.server.js b/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.browser.server.js
index 31349a3b2d..baa739ff54 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.browser.server.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.browser.server.js
@@ -57,7 +57,7 @@ function printWarning(level, format, args) {
function scheduleWork(callback) {
callback();
}
-function writeChunk(destination, chunk) {
+function writeChunkAndReturn(destination, chunk) {
destination.enqueue(chunk);
return destination.desiredSize > 0;
}
@@ -132,46 +132,12 @@ function resolveModuleMetaData(config, moduleReference) {
// ATTENTION
// When adding new symbols to this file,
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
-// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
-// nor polyfill, then a plain number is used for performance.
-var REACT_ELEMENT_TYPE = 0xeac7;
-var REACT_PORTAL_TYPE = 0xeaca;
-var REACT_FRAGMENT_TYPE = 0xeacb;
-var REACT_STRICT_MODE_TYPE = 0xeacc;
-var REACT_PROFILER_TYPE = 0xead2;
-var REACT_PROVIDER_TYPE = 0xeacd;
-var REACT_CONTEXT_TYPE = 0xeace;
-var REACT_FORWARD_REF_TYPE = 0xead0;
-var REACT_SUSPENSE_TYPE = 0xead1;
-var REACT_SUSPENSE_LIST_TYPE = 0xead8;
-var REACT_MEMO_TYPE = 0xead3;
-var REACT_LAZY_TYPE = 0xead4;
-var REACT_SCOPE_TYPE = 0xead7;
-var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
-var REACT_OFFSCREEN_TYPE = 0xeae2;
-var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
-var REACT_CACHE_TYPE = 0xeae4;
-
-if (typeof Symbol === 'function' && Symbol.for) {
- var symbolFor = Symbol.for;
- REACT_ELEMENT_TYPE = symbolFor('react.element');
- REACT_PORTAL_TYPE = symbolFor('react.portal');
- REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
- REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
- REACT_PROFILER_TYPE = symbolFor('react.profiler');
- REACT_PROVIDER_TYPE = symbolFor('react.provider');
- REACT_CONTEXT_TYPE = symbolFor('react.context');
- REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
- REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
- REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
- REACT_MEMO_TYPE = symbolFor('react.memo');
- REACT_LAZY_TYPE = symbolFor('react.lazy');
- REACT_SCOPE_TYPE = symbolFor('react.scope');
- REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
- REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
- REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
- REACT_CACHE_TYPE = symbolFor('react.cache');
-}
+// The Symbol used to tag the ReactElement-like types.
+var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
+var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
+var REACT_MEMO_TYPE = Symbol.for('react.memo');
+var REACT_LAZY_TYPE = Symbol.for('react.lazy');
var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
@@ -527,7 +493,7 @@ function resolveModelToJSON(request, parent, key, value) {
x.then(ping, ping);
return serializeByRefID(newSegment.id);
} else {
- reportError(request, x); // Something errored. We'll still send everything we have up until this point.
+ logRecoverableError(request, x); // Something errored. We'll still send everything we have up until this point.
// We'll replace this element with a lazy reference that throws on the client
// once it gets rendered.
@@ -724,7 +690,7 @@ function resolveModelToJSON(request, parent, key, value) {
);
}
-function reportError(request, error) {
+function logRecoverableError(request, error) {
var onError = request.onError;
onError(error);
}
@@ -806,7 +772,7 @@ function retrySegment(request, segment) {
x.then(ping, ping);
return;
} else {
- reportError(request, x); // This errored, we need to serialize this error to the
+ logRecoverableError(request, x); // This errored, we need to serialize this error to the
emitErrorChunk(request, segment.id, x);
}
@@ -832,7 +798,7 @@ function performWork(request) {
flushCompletedChunks(request, request.destination);
}
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
} finally {
ReactCurrentDispatcher.current = prevDispatcher;
@@ -840,10 +806,7 @@ function performWork(request) {
}
}
-let reentrant = false;
function flushCompletedChunks(request, destination) {
- if (reentrant) return;
- reentrant = true;
try {
// We emit module chunks first in the stream so that
// they can be preloaded as early as possible.
@@ -853,8 +816,9 @@ function flushCompletedChunks(request, destination) {
for (; i < moduleChunks.length; i++) {
request.pendingChunks--;
var chunk = moduleChunks[i];
+ var keepWriting = writeChunkAndReturn(destination, chunk);
- if (!writeChunk(destination, chunk)) {
+ if (!keepWriting) {
request.destination = null;
i++;
break;
@@ -870,7 +834,9 @@ function flushCompletedChunks(request, destination) {
request.pendingChunks--;
var _chunk = jsonChunks[i];
- if (!writeChunk(destination, _chunk)) {
+ var _keepWriting = writeChunkAndReturn(destination, _chunk);
+
+ if (!_keepWriting) {
request.destination = null;
i++;
break;
@@ -888,7 +854,9 @@ function flushCompletedChunks(request, destination) {
request.pendingChunks--;
var _chunk2 = errorChunks[i];
- if (!writeChunk(destination, _chunk2)) {
+ var _keepWriting2 = writeChunkAndReturn(destination, _chunk2);
+
+ if (!_keepWriting2) {
request.destination = null;
i++;
break;
@@ -897,7 +865,6 @@ function flushCompletedChunks(request, destination) {
errorChunks.splice(0, i);
} finally {
- reentrant = false;
}
if (request.pendingChunks === 0) {
@@ -922,12 +889,17 @@ function startFlowing(request, destination) {
return;
}
+ if (request.destination !== null) {
+ // We're already flowing.
+ return;
+ }
+
request.destination = destination;
try {
flushCompletedChunks(request, destination);
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
}
}
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.node.server.js b/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.node.server.js
index d0ed73d9ce..8805d890e3 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.node.server.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite-writer.node.server.js
@@ -72,7 +72,7 @@ function beginWriting(destination) {
destination.cork();
}
}
-function writeChunk(destination, chunk) {
+function writeChunkAndReturn(destination, chunk) {
var nodeBuffer = chunk; // close enough
return destination.write(nodeBuffer);
@@ -143,46 +143,12 @@ function resolveModuleMetaData(config, moduleReference) {
// ATTENTION
// When adding new symbols to this file,
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
-// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
-// nor polyfill, then a plain number is used for performance.
-var REACT_ELEMENT_TYPE = 0xeac7;
-var REACT_PORTAL_TYPE = 0xeaca;
-var REACT_FRAGMENT_TYPE = 0xeacb;
-var REACT_STRICT_MODE_TYPE = 0xeacc;
-var REACT_PROFILER_TYPE = 0xead2;
-var REACT_PROVIDER_TYPE = 0xeacd;
-var REACT_CONTEXT_TYPE = 0xeace;
-var REACT_FORWARD_REF_TYPE = 0xead0;
-var REACT_SUSPENSE_TYPE = 0xead1;
-var REACT_SUSPENSE_LIST_TYPE = 0xead8;
-var REACT_MEMO_TYPE = 0xead3;
-var REACT_LAZY_TYPE = 0xead4;
-var REACT_SCOPE_TYPE = 0xead7;
-var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
-var REACT_OFFSCREEN_TYPE = 0xeae2;
-var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
-var REACT_CACHE_TYPE = 0xeae4;
-
-if (typeof Symbol === 'function' && Symbol.for) {
- var symbolFor = Symbol.for;
- REACT_ELEMENT_TYPE = symbolFor('react.element');
- REACT_PORTAL_TYPE = symbolFor('react.portal');
- REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
- REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
- REACT_PROFILER_TYPE = symbolFor('react.profiler');
- REACT_PROVIDER_TYPE = symbolFor('react.provider');
- REACT_CONTEXT_TYPE = symbolFor('react.context');
- REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
- REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
- REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
- REACT_MEMO_TYPE = symbolFor('react.memo');
- REACT_LAZY_TYPE = symbolFor('react.lazy');
- REACT_SCOPE_TYPE = symbolFor('react.scope');
- REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
- REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
- REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
- REACT_CACHE_TYPE = symbolFor('react.cache');
-}
+// The Symbol used to tag the ReactElement-like types.
+var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_FRAGMENT_TYPE = Symbol.for('react.fragment');
+var REACT_FORWARD_REF_TYPE = Symbol.for('react.forward_ref');
+var REACT_MEMO_TYPE = Symbol.for('react.memo');
+var REACT_LAZY_TYPE = Symbol.for('react.lazy');
var isArrayImpl = Array.isArray; // eslint-disable-next-line no-redeclare
@@ -538,7 +504,7 @@ function resolveModelToJSON(request, parent, key, value) {
x.then(ping, ping);
return serializeByRefID(newSegment.id);
} else {
- reportError(request, x); // Something errored. We'll still send everything we have up until this point.
+ logRecoverableError(request, x); // Something errored. We'll still send everything we have up until this point.
// We'll replace this element with a lazy reference that throws on the client
// once it gets rendered.
@@ -735,7 +701,7 @@ function resolveModelToJSON(request, parent, key, value) {
);
}
-function reportError(request, error) {
+function logRecoverableError(request, error) {
var onError = request.onError;
onError(error);
}
@@ -817,7 +783,7 @@ function retrySegment(request, segment) {
x.then(ping, ping);
return;
} else {
- reportError(request, x); // This errored, we need to serialize this error to the
+ logRecoverableError(request, x); // This errored, we need to serialize this error to the
emitErrorChunk(request, segment.id, x);
}
@@ -843,7 +809,7 @@ function performWork(request) {
flushCompletedChunks(request, request.destination);
}
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
} finally {
ReactCurrentDispatcher.current = prevDispatcher;
@@ -863,8 +829,9 @@ function flushCompletedChunks(request, destination) {
for (; i < moduleChunks.length; i++) {
request.pendingChunks--;
var chunk = moduleChunks[i];
+ var keepWriting = writeChunkAndReturn(destination, chunk);
- if (!writeChunk(destination, chunk)) {
+ if (!keepWriting) {
request.destination = null;
i++;
break;
@@ -880,7 +847,9 @@ function flushCompletedChunks(request, destination) {
request.pendingChunks--;
var _chunk = jsonChunks[i];
- if (!writeChunk(destination, _chunk)) {
+ var _keepWriting = writeChunkAndReturn(destination, _chunk);
+
+ if (!_keepWriting) {
request.destination = null;
i++;
break;
@@ -898,7 +867,9 @@ function flushCompletedChunks(request, destination) {
request.pendingChunks--;
var _chunk2 = errorChunks[i];
- if (!writeChunk(destination, _chunk2)) {
+ var _keepWriting2 = writeChunkAndReturn(destination, _chunk2);
+
+ if (!_keepWriting2) {
request.destination = null;
i++;
break;
@@ -934,12 +905,17 @@ function startFlowing(request, destination) {
return;
}
+ if (request.destination !== null) {
+ // We're already flowing.
+ return;
+ }
+
request.destination = destination;
try {
flushCompletedChunks(request, destination);
} catch (error) {
- reportError(request, error);
+ logRecoverableError(request, error);
fatalError(request, error);
}
}
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite.js b/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite.js
index f497a78175..544ba72043 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite.js
+++ b/packages/hydrogen/vendor/react-server-dom-vite/esm/react-server-dom-vite.js
@@ -88,46 +88,9 @@ function requireModule(_ref2) {
// ATTENTION
// When adding new symbols to this file,
// Please consider also adding to 'react-devtools-shared/src/backend/ReactSymbols'
-// The Symbol used to tag the ReactElement-like types. If there is no native Symbol
-// nor polyfill, then a plain number is used for performance.
-var REACT_ELEMENT_TYPE = 0xeac7;
-var REACT_PORTAL_TYPE = 0xeaca;
-var REACT_FRAGMENT_TYPE = 0xeacb;
-var REACT_STRICT_MODE_TYPE = 0xeacc;
-var REACT_PROFILER_TYPE = 0xead2;
-var REACT_PROVIDER_TYPE = 0xeacd;
-var REACT_CONTEXT_TYPE = 0xeace;
-var REACT_FORWARD_REF_TYPE = 0xead0;
-var REACT_SUSPENSE_TYPE = 0xead1;
-var REACT_SUSPENSE_LIST_TYPE = 0xead8;
-var REACT_MEMO_TYPE = 0xead3;
-var REACT_LAZY_TYPE = 0xead4;
-var REACT_SCOPE_TYPE = 0xead7;
-var REACT_DEBUG_TRACING_MODE_TYPE = 0xeae1;
-var REACT_OFFSCREEN_TYPE = 0xeae2;
-var REACT_LEGACY_HIDDEN_TYPE = 0xeae3;
-var REACT_CACHE_TYPE = 0xeae4;
-
-if (typeof Symbol === 'function' && Symbol.for) {
- var symbolFor = Symbol.for;
- REACT_ELEMENT_TYPE = symbolFor('react.element');
- REACT_PORTAL_TYPE = symbolFor('react.portal');
- REACT_FRAGMENT_TYPE = symbolFor('react.fragment');
- REACT_STRICT_MODE_TYPE = symbolFor('react.strict_mode');
- REACT_PROFILER_TYPE = symbolFor('react.profiler');
- REACT_PROVIDER_TYPE = symbolFor('react.provider');
- REACT_CONTEXT_TYPE = symbolFor('react.context');
- REACT_FORWARD_REF_TYPE = symbolFor('react.forward_ref');
- REACT_SUSPENSE_TYPE = symbolFor('react.suspense');
- REACT_SUSPENSE_LIST_TYPE = symbolFor('react.suspense_list');
- REACT_MEMO_TYPE = symbolFor('react.memo');
- REACT_LAZY_TYPE = symbolFor('react.lazy');
- REACT_SCOPE_TYPE = symbolFor('react.scope');
- REACT_DEBUG_TRACING_MODE_TYPE = symbolFor('react.debug_trace_mode');
- REACT_OFFSCREEN_TYPE = symbolFor('react.offscreen');
- REACT_LEGACY_HIDDEN_TYPE = symbolFor('react.legacy_hidden');
- REACT_CACHE_TYPE = symbolFor('react.cache');
-}
+// The Symbol used to tag the ReactElement-like types.
+var REACT_ELEMENT_TYPE = Symbol.for('react.element');
+var REACT_LAZY_TYPE = Symbol.for('react.lazy');
var PENDING = 0;
var RESOLVED_MODEL = 1;
diff --git a/packages/hydrogen/vendor/react-server-dom-vite/package.json b/packages/hydrogen/vendor/react-server-dom-vite/package.json
index accfb9d4fc..a2c26cfe0b 100644
--- a/packages/hydrogen/vendor/react-server-dom-vite/package.json
+++ b/packages/hydrogen/vendor/react-server-dom-vite/package.json
@@ -11,7 +11,6 @@
"files": [
"LICENSE",
"README.md",
- "build-info.json",
"index.js",
"plugin.js",
"writer.browser.server.js",
From 510808c287ea181b9409c20ebabefdc8ce9ae3e1 Mon Sep 17 00:00:00 2001
From: Fran Dios
Date: Fri, 25 Feb 2022 21:23:51 +0900
Subject: [PATCH 03/15] Remove old React patches
---
.../plugins/vite-plugin-hydrogen-config.ts | 13 -------------
1 file changed, 13 deletions(-)
diff --git a/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts b/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts
index be120edf88..e4b829af56 100644
--- a/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts
+++ b/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts
@@ -88,19 +88,6 @@ export default () => {
/\((\w+)\.locked\)/gm,
'($1 && $1.locked)'
);
-
- // `renderToReadableStream` is bugged in React.
- // This adds a workaround until these issues are fixed:
- // https://github.com/facebook/react/issues/22772
- // https://github.com/facebook/react/issues/23113
- workerBundle.code = workerBundle.code.replace(
- /var \w+\s*=\s*(\w+)\.completedRootSegment;/g,
- 'if($1.status===5)return\n$1.status=5;\n$&'
- );
- workerBundle.code = workerBundle.code.replace(
- /(\w+)\.allPendingTasks\s*={2,3}\s*0\s*\&\&\s*\w+\.pingedTasks\.length/g,
- '$1.status=0;\n$&'
- );
}
}
: undefined,
From 34da7171d11c6963407fc2d6b04062a6017ac8c6 Mon Sep 17 00:00:00 2001
From: Fran Dios
Date: Fri, 25 Feb 2022 23:43:10 +0900
Subject: [PATCH 04/15] Update streaming logic to latest experimental
---
packages/hydrogen/src/entry-server.tsx | 208 +++++++++++-----------
packages/hydrogen/src/streaming.server.ts | 12 +-
2 files changed, 112 insertions(+), 108 deletions(-)
diff --git a/packages/hydrogen/src/entry-server.tsx b/packages/hydrogen/src/entry-server.tsx
index 0dc48c8ecb..9b51229dc7 100644
--- a/packages/hydrogen/src/entry-server.tsx
+++ b/packages/hydrogen/src/entry-server.tsx
@@ -55,6 +55,8 @@ declare global {
var __WORKER__: boolean;
}
+const DOCTYPE = '';
+const CONTENT_TYPE = 'Content-Type';
const HTML_CONTENT_TYPE = 'text/html; charset=UTF-8';
interface RequestHandlerOptions {
@@ -188,9 +190,15 @@ async function render(
{template}
);
+ function onErrorShell(error: Error) {
+ log.error(error);
+ componentResponse.writeHead({status: 500});
+ return template;
+ }
+
let [html, flight] = await Promise.all([
- renderToBufferedString(AppSSR, {log, nonce}),
- bufferReadableStream(rscReadable.getReader()),
+ renderToBufferedString(AppSSR, {log, nonce}).catch(onErrorShell),
+ bufferReadableStream(rscReadable.getReader()).catch(() => null),
]);
const {headers, status, statusText} = getResponseOptions(componentResponse);
@@ -213,7 +221,7 @@ async function render(
});
}
- headers['Content-type'] = HTML_CONTENT_TYPE;
+ headers[CONTENT_TYPE] = HTML_CONTENT_TYPE;
const {bodyAttributes, htmlAttributes, ...head} = extractHeadElements(
request.ctx.head
);
@@ -299,88 +307,88 @@ async function stream(
let didError: Error | undefined;
if (__WORKER__) {
- const deferredShouldReturnApp = defer();
+ const onCompleteAll = defer();
const encoder = new TextEncoder();
const transform = new TransformStream();
const writable = transform.writable.getWriter();
const responseOptions = {} as ResponseOptions;
- const ssrReadable = ssrRenderToReadableStream(AppSSR, {
- nonce,
- bootstrapScripts,
- bootstrapModules,
- onCompleteShell() {
- log.trace('worker ready to stream');
+ let ssrReadable: ReadableStream;
- Object.assign(
- responseOptions,
- getResponseOptions(componentResponse, didError)
- );
+ try {
+ ssrReadable = await ssrRenderToReadableStream(AppSSR, {
+ nonce,
+ bootstrapScripts,
+ bootstrapModules,
+ onCompleteAll() {
+ log.trace('worker complete stream');
+ onCompleteAll.resolve(true);
+ },
+ onError(error) {
+ didError = error;
- /**
- * TODO: This assumes `response.cache()` has been called _before_ any
- * queries which might be caught behind Suspense. Clarify this or add
- * additional checks downstream?
- */
- responseOptions.headers[getCacheControlHeader({dev})] =
- componentResponse.cacheControlHeader;
+ if (dev && !writable.closed && !!responseOptions.status) {
+ writable.write(getErrorMarkup(error));
+ }
- if (isRedirect(responseOptions)) {
- // Return redirects early without further rendering/streaming
- return deferredShouldReturnApp.resolve(false);
+ log.error(error);
+ },
+ });
+ } catch (error: unknown) {
+ log.error(error);
+
+ return new Response(
+ template + (dev ? getErrorMarkup(error as Error) : ''),
+ {
+ status: 500,
+ headers: {[CONTENT_TYPE]: HTML_CONTENT_TYPE},
}
+ );
+ }
- if (!componentResponse.canStream()) return;
-
- startWritingHtmlToStream(
- responseOptions,
- writable,
- encoder,
- dev ? didError : undefined
- );
+ log.trace('worker ready to stream');
- deferredShouldReturnApp.resolve(true);
- },
- async onCompleteAll() {
- log.trace('worker complete stream');
- if (componentResponse.canStream()) return;
+ async function prepareForStreaming(flush: boolean) {
+ Object.assign(
+ responseOptions,
+ getResponseOptions(componentResponse, didError)
+ );
- Object.assign(
- responseOptions,
- getResponseOptions(componentResponse, didError)
- );
+ /**
+ * TODO: This assumes `response.cache()` has been called _before_ any
+ * queries which might be caught behind Suspense. Clarify this or add
+ * additional checks downstream?
+ */
+ responseOptions.headers[getCacheControlHeader({dev})] =
+ componentResponse.cacheControlHeader;
- if (isRedirect(responseOptions)) {
- // Redirects found after any async code
- return deferredShouldReturnApp.resolve(false);
- }
+ if (isRedirect(responseOptions)) {
+ return false;
+ }
+ if (flush) {
if (componentResponse.customBody) {
writable.write(encoder.encode(await componentResponse.customBody));
- return deferredShouldReturnApp.resolve(false);
+ return false;
}
- startWritingHtmlToStream(
- responseOptions,
- writable,
- encoder,
- dev ? didError : undefined
- );
-
- deferredShouldReturnApp.resolve(true);
- },
- onError(error) {
- didError = error;
+ responseOptions.headers[CONTENT_TYPE] = HTML_CONTENT_TYPE;
+ writable.write(encoder.encode(DOCTYPE));
- if (dev && deferredShouldReturnApp.status === 'pending') {
- writable.write(getErrorMarkup(error));
+ if (didError) {
+ // This error was delayed until the headers were properly sent.
+ writable.write(encoder.encode(getErrorMarkup(didError)));
}
- log.error(error);
- },
- });
+ return true;
+ }
+ }
- if (await deferredShouldReturnApp.promise) {
+ const shouldReturnApp =
+ (await prepareForStreaming(componentResponse.canStream())) ??
+ (await onCompleteAll.promise.then(prepareForStreaming));
+
+ if (shouldReturnApp) {
let bufferedSsr = '';
let isPendingSsrWrite = false;
const writingSSR = bufferReadableStream(
@@ -522,6 +530,17 @@ async function stream(
}
);
},
+ onErrorShell(error: any) {
+ log.error(error);
+
+ if (!response.writableEnded) {
+ writeHeadToServerResponse(response, componentResponse, log, error);
+ startWritingHtmlToServerResponse(response, dev ? error : undefined);
+
+ response.write(template);
+ response.end();
+ }
+ },
onError(error: any) {
didError = error;
@@ -698,27 +717,27 @@ async function renderToBufferedString(
): Promise {
return new Promise(async (resolve, reject) => {
if (__WORKER__) {
- const deferred = defer();
- const readable = ssrRenderToReadableStream(ReactApp, {
- nonce,
- onCompleteAll() {
- /**
- * We want to wait until `onCompleteAll` has been called before fetching the
- * stream body. Otherwise, React 18's streaming JS script/template tags
- * will be included in the output and cause issues when loading
- * the Client Components in the browser.
- */
- deferred.resolve(null);
- },
- onError(error: any) {
- log.error(error);
- deferred.reject(error);
- },
- });
+ const onCompleteAll = defer();
- await deferred.promise.catch(reject);
+ try {
+ const ssrReadable = await ssrRenderToReadableStream(ReactApp, {
+ nonce,
+ onCompleteAll: () => onCompleteAll.resolve(null),
+ onError: (error) => log.error(error),
+ });
- resolve(await bufferReadableStream(readable.getReader()));
+ /**
+ * We want to wait until `onCompleteAll` has been called before fetching the
+ * stream body. Otherwise, React 18's streaming JS script/template tags
+ * will be included in the output and cause issues when loading
+ * the Client Components in the browser.
+ */
+ await onCompleteAll.promise;
+
+ resolve(bufferReadableStream(ssrReadable.getReader()));
+ } catch (error: unknown) {
+ reject(error);
+ }
} else {
const writer = await createNodeWriter();
@@ -736,10 +755,8 @@ async function renderToBufferedString(
// Tell React to start writing to the writer
pipe(writer);
},
- onError(error: any) {
- log.error(error);
- reject(error);
- },
+ onErrorShell: reject,
+ onError: (error) => log.error(error),
});
}
});
@@ -752,8 +769,8 @@ function startWritingHtmlToServerResponse(
error?: Error
) {
if (!response.headersSent) {
- response.setHeader('Content-type', HTML_CONTENT_TYPE);
- response.write('');
+ response.setHeader(CONTENT_TYPE, HTML_CONTENT_TYPE);
+ response.write(DOCTYPE);
}
if (error) {
@@ -762,21 +779,6 @@ function startWritingHtmlToServerResponse(
}
}
-function startWritingHtmlToStream(
- responseOptions: ResponseOptions,
- writable: WritableStreamDefaultWriter,
- encoder: TextEncoder,
- error?: Error
-) {
- responseOptions.headers['Content-type'] = HTML_CONTENT_TYPE;
- writable.write(encoder.encode(''));
-
- if (error) {
- // This error was delayed until the headers were properly sent.
- writable.write(encoder.encode(getErrorMarkup(error)));
- }
-}
-
type ResponseOptions = {
headers: Record;
status: number;
diff --git a/packages/hydrogen/src/streaming.server.ts b/packages/hydrogen/src/streaming.server.ts
index 4e51a993d2..37a02b9b7a 100644
--- a/packages/hydrogen/src/streaming.server.ts
+++ b/packages/hydrogen/src/streaming.server.ts
@@ -22,22 +22,24 @@ export const createFromReadableStream = _createFromReadableStream as (
type StreamOptions = {
nonce?: string;
- onCompleteShell?: () => void;
- onCompleteAll?: () => void;
- onError?: (error: Error) => void;
bootstrapScripts?: string[];
bootstrapModules?: string[];
+ onCompleteAll?: () => void;
+ onError?: (error: Error) => void;
};
export const ssrRenderToPipeableStream = _ssrRenderToPipeableStream as (
App: JSX.Element,
- options: StreamOptions
+ options: StreamOptions & {
+ onCompleteShell?: () => void;
+ onErrorShell?: (error: Error) => void;
+ }
) => {pipe: Writable['pipe']};
export const ssrRenderToReadableStream = _ssrRenderToReadableStream as (
App: JSX.Element,
options: StreamOptions
-) => ReadableStream;
+) => Promise>;
export function supportsReadableStream() {
try {
From 9bb15a0ebc360013ba951796a16e01f036c08997 Mon Sep 17 00:00:00 2001
From: Fran Dios
Date: Thu, 3 Mar 2022 21:19:36 +0900
Subject: [PATCH 05/15] Latest and greatest React 18 experimental
---
.../template-hydrogen-default/package.json | 4 +--
packages/hydrogen/package.json | 4 +--
packages/hydrogen/src/entry-client.tsx | 2 +-
.../plugins/vite-plugin-hydrogen-config.ts | 2 +-
.../playground/server-components/package.json | 4 +--
yarn.lock | 26 +++++++++----------
6 files changed, 21 insertions(+), 21 deletions(-)
diff --git a/examples/template-hydrogen-default/package.json b/examples/template-hydrogen-default/package.json
index 73de8fc070..6167ce73cb 100644
--- a/examples/template-hydrogen-default/package.json
+++ b/examples/template-hydrogen-default/package.json
@@ -39,8 +39,8 @@
"compression": "^1.7.4",
"graphql-tag": "^2.12.4",
"path-to-regexp": "^6.2.0",
- "react": "0.0.0-experimental-8c4cd65cf-20220224",
- "react-dom": "0.0.0-experimental-8c4cd65cf-20220224",
+ "react": "0.0.0-experimental-f0dd459e0-20220301",
+ "react-dom": "0.0.0-experimental-f0dd459e0-20220301",
"serve-static": "^1.14.1"
}
}
diff --git a/packages/hydrogen/package.json b/packages/hydrogen/package.json
index 3d91b32cdf..79d4edff18 100644
--- a/packages/hydrogen/package.json
+++ b/packages/hydrogen/package.json
@@ -81,8 +81,8 @@
"peerDependencies": {
"body-parser": "^1.19.1",
"compression": "^1.7.4",
- "react": "0.0.0-experimental-8c4cd65cf-20220224",
- "react-dom": "0.0.0-experimental-8c4cd65cf-20220224",
+ "react": "0.0.0-experimental-f0dd459e0-20220301",
+ "react-dom": "0.0.0-experimental-f0dd459e0-20220301",
"serve-static": "^1.14.1",
"vite": "^2.8.0"
},
diff --git a/packages/hydrogen/src/entry-client.tsx b/packages/hydrogen/src/entry-client.tsx
index 8ae6bb781f..a02e9299a3 100644
--- a/packages/hydrogen/src/entry-client.tsx
+++ b/packages/hydrogen/src/entry-client.tsx
@@ -1,6 +1,6 @@
import React, {Suspense, useState} from 'react';
// @ts-ignore
-import {hydrateRoot} from 'react-dom';
+import {hydrateRoot} from 'react-dom/client';
import type {ClientHandler} from './types';
import {ErrorBoundary} from 'react-error-boundary';
import {useServerResponse} from './framework/Hydration/rsc';
diff --git a/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts b/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts
index e4b829af56..cbe32b303c 100644
--- a/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts
+++ b/packages/hydrogen/src/framework/plugins/vite-plugin-hydrogen-config.ts
@@ -60,7 +60,7 @@ export default () => {
* at server start to avoid posterior page reloads and issues (#429 #430).
*/
'react',
- 'react-dom',
+ 'react-dom/client',
'react-server-dom-vite/client-proxy',
],
},
diff --git a/packages/playground/server-components/package.json b/packages/playground/server-components/package.json
index 3de405b067..c7e3b3f309 100644
--- a/packages/playground/server-components/package.json
+++ b/packages/playground/server-components/package.json
@@ -19,7 +19,7 @@
"@cloudflare/kv-asset-handler": "*",
"@shopify/hydrogen": "^0.11.0",
"miniflare": "^1.3.3",
- "react": "0.0.0-experimental-8c4cd65cf-20220224",
- "react-dom": "0.0.0-experimental-8c4cd65cf-20220224"
+ "react": "0.0.0-experimental-f0dd459e0-20220301",
+ "react-dom": "0.0.0-experimental-f0dd459e0-20220301"
}
}
diff --git a/yarn.lock b/yarn.lock
index 95e4382907..40e8380c26 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9455,13 +9455,13 @@ rc@^1.2.8:
minimist "^1.2.0"
strip-json-comments "~2.0.1"
-react-dom@0.0.0-experimental-8c4cd65cf-20220224:
- version "0.0.0-experimental-8c4cd65cf-20220224"
- resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-0.0.0-experimental-8c4cd65cf-20220224.tgz#73f18a61123a0ae3c728e7688d284248a46f83a8"
- integrity sha512-kHfqFaC276cW9wwODEJ29w5nQnmHugNavgmJp4VByQahopVCln2xQcbut6zNAB6PV83Qes6X1W9qHQHwqe66DQ==
+react-dom@0.0.0-experimental-f0dd459e0-20220301:
+ version "0.0.0-experimental-f0dd459e0-20220301"
+ resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-0.0.0-experimental-f0dd459e0-20220301.tgz#b0a32a2c1ea339cc8bd528f632d7541d35df2070"
+ integrity sha512-F1xl14aJ0tcexzeluyktLIUT7KIeOI1MZfJ8OZSsb0lprtWkCYRBVIqzYVSdSkB0nAz3QvIKok2eFltJhKZ8dw==
dependencies:
loose-envify "^1.1.0"
- scheduler "0.0.0-experimental-8c4cd65cf-20220224"
+ scheduler "0.0.0-experimental-f0dd459e0-20220301"
react-error-boundary@^3.1.3:
version "3.1.4"
@@ -9510,10 +9510,10 @@ react-refresh@^0.11.0:
resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.11.0.tgz#77198b944733f0f1f1a90e791de4541f9f074046"
integrity sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==
-react@0.0.0-experimental-8c4cd65cf-20220224:
- version "0.0.0-experimental-8c4cd65cf-20220224"
- resolved "https://registry.yarnpkg.com/react/-/react-0.0.0-experimental-8c4cd65cf-20220224.tgz#3c381ae8b59d35460d34132e653fc4221f1dd01e"
- integrity sha512-LSx6wbMqzsjPTitKoFaAjEWk2c23G1W9p4LhCjX0J69rxQh0pj+Cwp+IDbfBGvEy9dRTmy+ytzB3EQaJFy8YvA==
+react@0.0.0-experimental-f0dd459e0-20220301:
+ version "0.0.0-experimental-f0dd459e0-20220301"
+ resolved "https://registry.yarnpkg.com/react/-/react-0.0.0-experimental-f0dd459e0-20220301.tgz#bd80bd02d95ba94e3eac00c047d1eb9f29ac2f77"
+ integrity sha512-YVs3vtbdLlQofwIVnc6IiiYM3GU9nwNjoIpJfJPTgR0NNjEaoOLzYIkc5HvDdw7DQqcLWb3sBrdQhOvDKUNUUQ==
dependencies:
loose-envify "^1.1.0"
@@ -10108,10 +10108,10 @@ saxes@^5.0.1:
dependencies:
xmlchars "^2.2.0"
-scheduler@0.0.0-experimental-8c4cd65cf-20220224:
- version "0.0.0-experimental-8c4cd65cf-20220224"
- resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.0.0-experimental-8c4cd65cf-20220224.tgz#56be59abd7f10306c247c713c249fc47ac7c120f"
- integrity sha512-tKWOYNBIIKOnXC87wWOItdnijE6xsb+s+ckdeia6f4OjPHbZnl7hIJ7K9Gn+71mC8RBw1rgHz+XtnwEAQnXFdQ==
+scheduler@0.0.0-experimental-f0dd459e0-20220301:
+ version "0.0.0-experimental-f0dd459e0-20220301"
+ resolved "https://registry.yarnpkg.com/scheduler/-/scheduler-0.0.0-experimental-f0dd459e0-20220301.tgz#7fe7335a59173193f627f4b6001838534ecbd242"
+ integrity sha512-Zuc0UVEQY6X84xRzLbT5M4CKYKcuVJ/Ut0cbK3XE1GHu5R6N0a1Ep5xWcmpoM/3cjoLHmiGerC1eFW4MxWfnRw==
dependencies:
loose-envify "^1.1.0"
From 453e2efc7c8fccd77f3aaa6f6bff3c6b2c6231a6 Mon Sep 17 00:00:00 2001
From: Fran Dios
Date: Thu, 3 Mar 2022 21:20:46 +0900
Subject: [PATCH 06/15] Fix suspense boundary update in Router
---
packages/hydrogen/src/foundation/Router/Router.client.tsx | 5 +++--
1 file changed, 3 insertions(+), 2 deletions(-)
diff --git a/packages/hydrogen/src/foundation/Router/Router.client.tsx b/packages/hydrogen/src/foundation/Router/Router.client.tsx
index d881a48a49..a18aea967e 100644
--- a/packages/hydrogen/src/foundation/Router/Router.client.tsx
+++ b/packages/hydrogen/src/foundation/Router/Router.client.tsx
@@ -17,19 +17,20 @@ type RouterContextValue = {
const RouterContext = createContext({});
+let isFirstLoad = true;
+
export const Router: FC<{history?: BrowserHistory}> = ({
history: pHistory,
children,
}) => {
const history = useMemo(() => pHistory || createBrowserHistory(), [pHistory]);
- const [firstLoad, setFirstLoad] = useState(true);
const [location, setLocation] = useState(history.location);
const {pending, setServerState} = useServerState();
useEffect(() => {
// The app has just loaded
- if (firstLoad) setFirstLoad(false);
+ if (isFirstLoad) isFirstLoad = false;
// A navigation event has just happened
else if (!pending) {
window.scrollTo(0, 0);
From bcce76ad59fdf24f4434f0931daca5e8eef32ce8 Mon Sep 17 00:00:00 2001
From: Fran Dios
Date: Thu, 3 Mar 2022 21:39:38 +0900
Subject: [PATCH 07/15] Add more suspense boundaries to fix hydration
---
.../src/components/Layout.server.jsx | 2 +-
.../src/components/NotFound.server.jsx | 13 ++++++++-----
.../src/components/ProductCard.jsx | 9 +++++++--
3 files changed, 16 insertions(+), 8 deletions(-)
diff --git a/examples/template-hydrogen-default/src/components/Layout.server.jsx b/examples/template-hydrogen-default/src/components/Layout.server.jsx
index ff65816e21..ebbdd9b49a 100644
--- a/examples/template-hydrogen-default/src/components/Layout.server.jsx
+++ b/examples/template-hydrogen-default/src/components/Layout.server.jsx
@@ -47,7 +47,7 @@ export default function Layout({children, hero}) {
{hero}
- {children}
+ {children}
diff --git a/examples/template-hydrogen-default/src/components/NotFound.server.jsx b/examples/template-hydrogen-default/src/components/NotFound.server.jsx
index 62df4ca420..dd425e6428 100644
--- a/examples/template-hydrogen-default/src/components/NotFound.server.jsx
+++ b/examples/template-hydrogen-default/src/components/NotFound.server.jsx
@@ -1,3 +1,4 @@
+import {Suspense} from 'react';
import {
useShopQuery,
ProductProviderFragment,
@@ -23,11 +24,13 @@ function NotFoundHero() {
We couldn’t find the page you’re looking for. Try checking the URL or
heading back to the home page.
-
+
+
+
);
diff --git a/examples/template-hydrogen-default/src/components/ProductCard.jsx b/examples/template-hydrogen-default/src/components/ProductCard.jsx
index 9c0abf202c..38cbb4e325 100644
--- a/examples/template-hydrogen-default/src/components/ProductCard.jsx
+++ b/examples/template-hydrogen-default/src/components/ProductCard.jsx
@@ -1,3 +1,4 @@
+import {Suspense} from 'react';
import {Image, Link} from '@shopify/hydrogen';
import MoneyCompareAtPrice from './MoneyCompareAtPrice.client';
@@ -40,9 +41,13 @@ export default function ProductCard({product}) {