[image, link] fix ref merging for callback refs that return a cleanup function #68123

lubieowoce · 2024-07-24T19:02:35Z

What

Fix handling of user-provided refs in Image and Link to support refs with cleanup functions (new in React 19)

Why

React 19 allows a new form of callback ref, which returns a cleanup function:

(element: HTMLElement) => {
  console.log('hi ref!')
  return () => {
    console.log('bye ref!')
  }
}

Unfortunately, this can be a breaking change for code that attempts to combine ("merge") multiple callback refs into one. With old-style callback refs, we never had to care about the return values. But with the introduction of cleanup functions, ignoring the return value can lead to logic errors (because the cleanup will never be called)!

This was the case for Image and Link, both of which attempt to combine user-provided refs with their own callback refs, but were ignoring the return values, so they'd break if the user's ref returned a cleanup function.

How

This PR introduces a useMergedRef(refA, refB) hook that combines all forms of refs correctly (thanks @eps1lon for sketching it out!) and refactors Image and Link to use it.

ijjk · 2024-07-24T19:06:23Z

Tests Passed

lubieowoce · 2024-07-24T19:07:14Z

packages/next/src/client/image-component.tsx

the actual logic in the ownRef callback wasn't modified. i only removed the bits at the start that managed the user-provided forwardedRef, because useMergedRef handles that now.
(also note that the execution order remains the same)

lubieowoce · 2024-07-24T19:10:15Z

test/integration/link-ref/pages/child-ref-func-cleanup.js

tbh this feels more convoluted than it needs to be, but the existing tests here all rely on checking "console.error wasn't called" and i don't want to set up a whole new test just for this

ijjk · 2024-07-24T19:11:36Z

Stats from current PR

Default Build (Increase detected ⚠️)

General Overall increase ⚠️

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
buildDuration	19.1s	16s	N/A
buildDurationCached	9.2s	8s	N/A
nodeModulesSize	369 MB	369 MB	⚠️ +8.77 kB
nextStartRea..uration (ms)	420ms	428ms	N/A

Client Bundles (main, webpack) Overall increase ⚠️

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
1780.HASH.js gzip	167 B	167 B	✓
5453-HASH.js gzip	82.3 kB	82.2 kB	N/A
7514-HASH.js gzip	5.06 kB	5.18 kB	⚠️ +121 B
a7a62840-HASH.js gzip	51.7 kB	51.7 kB	N/A
framework-HASH.js gzip	56.7 kB	56.7 kB	N/A
main-app-HASH.js gzip	225 B	226 B	N/A
main-HASH.js gzip	32 kB	32 kB	N/A
webpack-HASH.js gzip	1.77 kB	1.77 kB	N/A
Overall change	5.23 kB	5.35 kB	⚠️ +121 B

Legacy Client Bundles (polyfills)

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
polyfills-HASH.js gzip	31 kB	31 kB	✓
Overall change	31 kB	31 kB	✓

Client Pages Overall increase ⚠️

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
_app-HASH.js gzip	193 B	193 B	✓
_error-HASH.js gzip	192 B	192 B	✓
amp-HASH.js gzip	508 B	510 B	N/A
css-HASH.js gzip	341 B	341 B	✓
dynamic-HASH.js gzip	2.52 kB	2.52 kB	✓
edge-ssr-HASH.js gzip	264 B	266 B	N/A
head-HASH.js gzip	362 B	363 B	N/A
hooks-HASH.js gzip	391 B	390 B	N/A
image-HASH.js gzip	4.26 kB	4.4 kB	⚠️ +138 B
index-HASH.js gzip	268 B	268 B	✓
link-HASH.js gzip	2.69 kB	2.81 kB	⚠️ +125 B
routerDirect..HASH.js gzip	326 B	325 B	N/A
script-HASH.js gzip	396 B	397 B	N/A
withRouter-HASH.js gzip	322 B	321 B	N/A
1afbb74e6ecf..834.css gzip	106 B	106 B	✓
Overall change	10.6 kB	10.8 kB	⚠️ +263 B

Client Build Manifests

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
_buildManifest.js gzip	747 B	749 B	N/A
Overall change	0 B	0 B	✓

Rendered Page Sizes

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
index.html gzip	520 B	523 B	N/A
link.html gzip	536 B	537 B	N/A
withRouter.html gzip	518 B	519 B	N/A
Overall change	0 B	0 B	✓

Edge SSR bundle Size

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
edge-ssr.js gzip	127 kB	127 kB	N/A
page.js gzip	194 kB	194 kB	N/A
Overall change	0 B	0 B	✓

Middleware size

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
middleware-b..fest.js gzip	670 B	671 B	N/A
middleware-r..fest.js gzip	156 B	155 B	N/A
middleware.js gzip	29.7 kB	29.7 kB	✓
edge-runtime..pack.js gzip	1.18 kB	1.18 kB	N/A
Overall change	29.7 kB	29.7 kB	✓

Next Runtimes

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
928-experime...dev.js gzip	310 B	310 B	✓
928-experime..prod.js gzip	310 B	310 B	✓
928-turbo-ex..prod.js gzip	312 B	312 B	✓
928-turbo.ru..prod.js gzip	304 B	304 B	✓
928.runtime.dev.js gzip	301 B	301 B	✓
928.runtime.prod.js gzip	302 B	302 B	✓
app-page-exp...dev.js gzip	233 kB	233 kB	✓
app-page-exp..prod.js gzip	142 kB	142 kB	✓
app-page-tur..prod.js gzip	153 kB	153 kB	✓
app-page-tur..prod.js gzip	149 kB	149 kB	✓
app-page.run...dev.js gzip	227 kB	227 kB	✓
app-page.run..prod.js gzip	138 kB	138 kB	✓
app-route-ex...dev.js gzip	23.4 kB	23.4 kB	✓
app-route-ex..prod.js gzip	18.8 kB	18.8 kB	✓
app-route-tu..prod.js gzip	18.8 kB	18.8 kB	✓
app-route-tu..prod.js gzip	18.6 kB	18.6 kB	✓
app-route.ru...dev.js gzip	24.6 kB	24.6 kB	✓
app-route.ru..prod.js gzip	18.6 kB	18.6 kB	✓
pages-api-tu..prod.js gzip	9.6 kB	9.6 kB	✓
pages-api.ru...dev.js gzip	9.87 kB	9.87 kB	✓
pages-api.ru..prod.js gzip	9.59 kB	9.59 kB	✓
pages-turbo...prod.js gzip	21.6 kB	21.6 kB	✓
pages.runtim...dev.js gzip	22.1 kB	22.1 kB	✓
pages.runtim..prod.js gzip	21.6 kB	21.6 kB	✓
server.runti..prod.js gzip	56.7 kB	56.7 kB	✓
Overall change	1.32 MB	1.32 MB	✓

build cache Overall increase ⚠️

	vercel/next.js canary	vercel/next.js fix-ref-merging	Change
0.pack gzip	2.04 MB	2.05 MB	⚠️ +5.34 kB
index.pack gzip	142 kB	143 kB	⚠️ +694 B
Overall change	2.18 MB	2.19 MB	⚠️ +6.04 kB

Diff details

Diff for page.js

@@ -15,7 +15,7 @@
       /***/
     },
 
-    /***/ 2108: /***/ (
+    /***/ 5436: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -30,7 +30,7 @@
         default: () => /* binding */ nHandler,
       });
 
-      // NAMESPACE OBJECT: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapp-edge-ssr%2Fpage&page=%2Fapp-edge-ssr%2Fpage&pagePath=private-next-app-dir%2Fapp-edge-ssr%2Fpage.js&appDir=%2Ftmp%2Fnext-statsxe1CI9%2Fstats-app%2Fapp&appPaths=%2Fapp-edge-ssr%2Fpage&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&basePath=&assetPrefix=&nextConfigOutput=&flyingShuttle=false&preferredRegion=&middlewareConfig=e30%3D!./app/app-edge-ssr/page.js?__next_edge_ssr_entry__
+      // NAMESPACE OBJECT: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapp-edge-ssr%2Fpage&page=%2Fapp-edge-ssr%2Fpage&pagePath=private-next-app-dir%2Fapp-edge-ssr%2Fpage.js&appDir=%2Ftmp%2Fnext-statsxe1CI9%2Fstats-app%2Fapp&appPaths=%2Fapp-edge-ssr%2Fpage&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&basePath=&assetPrefix=&nextConfigOutput=&flyingShuttle=false&preferredRegion=&middlewareConfig=e30%3D!./app/app-edge-ssr/page.js?__next_edge_ssr_entry__
       var page_next_edge_ssr_entry_namespaceObject = {};
       __webpack_require__.r(page_next_edge_ssr_entry_namespaceObject);
       __webpack_require__.d(page_next_edge_ssr_entry_namespaceObject, {
@@ -69,35 +69,35 @@
         tree: () => tree,
       });
 
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/web/globals.js
-      var globals = __webpack_require__(6497);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/web/adapter.js + 3 modules
-      var adapter = __webpack_require__(8627);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/build/webpack/loaders/next-edge-ssr-loader/render.js + 87 modules
-      var render = __webpack_require__(9932);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/lib/incremental-cache/index.js + 3 modules
-      var incremental_cache = __webpack_require__(547);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/app-render/app-render.js + 72 modules
-      var app_render = __webpack_require__(24);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/route-modules/app-page/module.compiled.js
-      var module_compiled = __webpack_require__(776);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/route-kind.js
-      var route_kind = __webpack_require__(7234);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/client/components/error-boundary.js
-      var error_boundary = __webpack_require__(8425);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/app-render/entry-base.js + 9 modules
-      var entry_base = __webpack_require__(6280); // CONCATENATED MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapp-edge-ssr%2Fpage&page=%2Fapp-edge-ssr%2Fpage&pagePath=private-next-app-dir%2Fapp-edge-ssr%2Fpage.js&appDir=%2Ftmp%2Fnext-statsxe1CI9%2Fstats-app%2Fapp&appPaths=%2Fapp-edge-ssr%2Fpage&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&basePath=&assetPrefix=&nextConfigOutput=&flyingShuttle=false&preferredRegion=&middlewareConfig=e30%3D!./app/app-edge-ssr/page.js?__next_edge_ssr_entry__
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/web/globals.js
+      var globals = __webpack_require__(3000);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/web/adapter.js + 3 modules
+      var adapter = __webpack_require__(1059);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/build/webpack/loaders/next-edge-ssr-loader/render.js + 87 modules
+      var render = __webpack_require__(9774);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/lib/incremental-cache/index.js + 3 modules
+      var incremental_cache = __webpack_require__(5621);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/app-render/app-render.js + 72 modules
+      var app_render = __webpack_require__(8919);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/route-modules/app-page/module.compiled.js
+      var module_compiled = __webpack_require__(8488);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/route-kind.js
+      var route_kind = __webpack_require__(8394);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/client/components/error-boundary.js
+      var error_boundary = __webpack_require__(5787);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/app-render/entry-base.js + 9 modules
+      var entry_base = __webpack_require__(1901); // CONCATENATED MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/build/webpack/loaders/next-app-loader.js?name=app%2Fapp-edge-ssr%2Fpage&page=%2Fapp-edge-ssr%2Fpage&pagePath=private-next-app-dir%2Fapp-edge-ssr%2Fpage.js&appDir=%2Ftmp%2Fnext-statsxe1CI9%2Fstats-app%2Fapp&appPaths=%2Fapp-edge-ssr%2Fpage&pageExtensions=tsx&pageExtensions=ts&pageExtensions=jsx&pageExtensions=js&basePath=&assetPrefix=&nextConfigOutput=&flyingShuttle=false&preferredRegion=&middlewareConfig=e30%3D!./app/app-edge-ssr/page.js?__next_edge_ssr_entry__
       const component0 = () =>
         Promise.resolve(/* import() eager */).then(
-          __webpack_require__.bind(__webpack_require__, 4401)
+          __webpack_require__.bind(__webpack_require__, 8535)
         );
       const component1 = () =>
         Promise.resolve(/* import() eager */).then(
-          __webpack_require__.bind(__webpack_require__, 5434)
+          __webpack_require__.bind(__webpack_require__, 2130)
         );
       const page2 = () =>
         Promise.resolve(/* import() eager */).then(
-          __webpack_require__.bind(__webpack_require__, 2439)
+          __webpack_require__.bind(__webpack_require__, 4781)
         );
 
       // We inject the tree and pages here so that we can use them in the route
@@ -163,12 +163,12 @@
       });
 
       //# sourceMappingURL=app-page.js.map
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/lib/page-types.js
-      var page_types = __webpack_require__(5373);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/app-render/encryption-utils.js
-      var encryption_utils = __webpack_require__(6590);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/esm/server/app-render/action-utils.js
-      var action_utils = __webpack_require__(9690); // CONCATENATED MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/dist/build/webpack/loaders/next-edge-ssr-loader/index.js?{"absolute500Path":"","absoluteAppPath":"next/dist/pages/_app","absoluteDocumentPath":"next/dist/pages/_document","absoluteErrorPath":"next/dist/pages/_error","absolutePagePath":"private-next-app-dir/app-edge-ssr/page.js","dev":false,"isServerComponent":true,"page":"/app-edge-ssr/page","stringifiedConfig":"eyJlbnYiOnt9LCJlc2xpbnQiOnsiaWdub3JlRHVyaW5nQnVpbGRzIjpmYWxzZX0sInR5cGVzY3JpcHQiOnsiaWdub3JlQnVpbGRFcnJvcnMiOmZhbHNlLCJ0c2NvbmZpZ1BhdGgiOiJ0c2NvbmZpZy5qc29uIn0sImRpc3REaXIiOiIubmV4dCIsImNsZWFuRGlzdERpciI6dHJ1ZSwiYXNzZXRQcmVmaXgiOiIiLCJjYWNoZU1heE1lbW9yeVNpemUiOjUyNDI4ODAwLCJjb25maWdPcmlnaW4iOiJuZXh0LmNvbmZpZy5qcyIsInVzZUZpbGVTeXN0ZW1QdWJsaWNSb3V0ZXMiOnRydWUsImdlbmVyYXRlRXRhZ3MiOnRydWUsInBhZ2VFeHRlbnNpb25zIjpbInRzeCIsInRzIiwianN4IiwianMiXSwicG93ZXJlZEJ5SGVhZGVyIjp0cnVlLCJjb21wcmVzcyI6dHJ1ZSwiaW1hZ2VzIjp7ImRldmljZVNpemVzIjpbNjQwLDc1MCw4MjgsMTA4MCwxMjAwLDE5MjAsMjA0OCwzODQwXSwiaW1hZ2VTaXplcyI6WzE2LDMyLDQ4LDY0LDk2LDEyOCwyNTYsMzg0XSwicGF0aCI6Ii9fbmV4dC9pbWFnZSIsImxvYWRlciI6ImRlZmF1bHQiLCJsb2FkZXJGaWxlIjoiIiwiZG9tYWlucyI6W10sImRpc2FibGVTdGF0aWNJbWFnZXMiOmZhbHNlLCJtaW5pbXVtQ2FjaGVUVEwiOjYwLCJmb3JtYXRzIjpbImltYWdlL3dlYnAiXSwiZGFuZ2Vyb3VzbHlBbGxvd1NWRyI6ZmFsc2UsImNvbnRlbnRTZWN1cml0eVBvbGljeSI6InNjcmlwdC1zcmMgJ25vbmUnOyBmcmFtZS1zcmMgJ25vbmUnOyBzYW5kYm94OyIsImNvbnRlbnREaXNwb3NpdGlvblR5cGUiOiJhdHRhY2htZW50IiwicmVtb3RlUGF0dGVybnMiOltdLCJ1bm9wdGltaXplZCI6ZmFsc2V9LCJkZXZJbmRpY2F0b3JzIjp7ImFwcElzclN0YXR1cyI6dHJ1ZSwiYnVpbGRBY3Rpdml0eSI6dHJ1ZSwiYnVpbGRBY3Rpdml0eVBvc2l0aW9uIjoiYm90dG9tLXJpZ2h0In0sIm9uRGVtYW5kRW50cmllcyI6eyJtYXhJbmFjdGl2ZUFnZSI6NjAwMDAsInBhZ2VzQnVmZmVyTGVuZ3RoIjo1fSwiYW1wIjp7ImNhbm9uaWNhbEJhc2UiOiIifSwiYmFzZVBhdGgiOiIiLCJzYXNzT3B0aW9ucyI6e30sInRyYWlsaW5nU2xhc2giOmZhbHNlLCJpMThuIjpudWxsLCJwcm9kdWN0aW9uQnJvd3NlclNvdXJjZU1hcHMiOmZhbHNlLCJvcHRpbWl6ZUZvbnRzIjp0cnVlLCJleGNsdWRlRGVmYXVsdE1vbWVudExvY2FsZXMiOnRydWUsInNlcnZlclJ1bnRpbWVDb25maWciOnt9LCJwdWJsaWNSdW50aW1lQ29uZmlnIjp7fSwicmVhY3RQcm9kdWN0aW9uUHJvZmlsaW5nIjpmYWxzZSwicmVhY3RTdHJpY3RNb2RlIjpudWxsLCJodHRwQWdlbnRPcHRpb25zIjp7ImtlZXBBbGl2ZSI6dHJ1ZX0sImxvZ2dpbmciOnt9LCJzdGF0aWNQYWdlR2VuZXJhdGlvblRpbWVvdXQiOjYwLCJtb2R1bGFyaXplSW1wb3J0cyI6eyJAbXVpL2ljb25zLW1hdGVyaWFsIjp7InRyYW5zZm9ybSI6IkBtdWkvaWNvbnMtbWF0ZXJpYWwve3ttZW1iZXJ9fSJ9LCJsb2Rhc2giOnsidHJhbnNmb3JtIjoibG9kYXNoL3t7bWVtYmVyfX0ifX0sImV4cGVyaW1lbnRhbCI6eyJhcHBOYXZGYWlsSGFuZGxpbmciOmZhbHNlLCJmbHlpbmdTaHV0dGxlIjpmYWxzZSwicHJlcmVuZGVyRWFybHlFeGl0Ijp0cnVlLCJzZXJ2ZXJNaW5pZmljYXRpb24iOnRydWUsInNlcnZlclNvdXJjZU1hcHMiOmZhbHNlLCJsaW5rTm9Ub3VjaFN0YXJ0IjpmYWxzZSwiY2FzZVNlbnNpdGl2ZVJvdXRlcyI6ZmFsc2UsInByZWxvYWRFbnRyaWVzT25TdGFydCI6dHJ1ZSwiY2xpZW50Um91dGVyRmlsdGVyIjp0cnVlLCJjbGllbnRSb3V0ZXJGaWx0ZXJSZWRpcmVjdHMiOmZhbHNlLCJmZXRjaENhY2hlS2V5UHJlZml4IjoiIiwibWlkZGxld2FyZVByZWZldGNoIjoiZmxleGlibGUiLCJvcHRpbWlzdGljQ2xpZW50Q2FjaGUiOnRydWUsIm1hbnVhbENsaWVudEJhc2VQYXRoIjpmYWxzZSwiY3B1cyI6MTksIm1lbW9yeUJhc2VkV29ya2Vyc0NvdW50IjpmYWxzZSwiaXNyRmx1c2hUb0Rpc2siOnRydWUsIndvcmtlclRocmVhZHMiOmZhbHNlLCJvcHRpbWl6ZUNzcyI6ZmFsc2UsIm5leHRTY3JpcHRXb3JrZXJzIjpmYWxzZSwic2Nyb2xsUmVzdG9yYXRpb24iOmZhbHNlLCJleHRlcm5hbERpciI6ZmFsc2UsImRpc2FibGVPcHRpbWl6ZWRMb2FkaW5nIjpmYWxzZSwiZ3ppcFNpemUiOnRydWUsImNyYUNvbXBhdCI6ZmFsc2UsImVzbUV4dGVybmFscyI6dHJ1ZSwiZnVsbHlTcGVjaWZpZWQiOmZhbHNlLCJvdXRwdXRGaWxlVHJhY2luZ1Jvb3QiOiIvdG1wL25leHQtc3RhdHN4ZTFDSTkvc3RhdHMtYXBwIiwic3djVHJhY2VQcm9maWxpbmciOmZhbHNlLCJmb3JjZVN3Y1RyYW5zZm9ybXMiOmZhbHNlLCJsYXJnZVBhZ2VEYXRhQnl0ZXMiOjEyODAwMCwiYWRqdXN0Rm9udEZhbGxiYWNrcyI6ZmFsc2UsImFkanVzdEZvbnRGYWxsYmFja3NXaXRoU2l6ZUFkanVzdCI6ZmFsc2UsInR5cGVkUm91dGVzIjpmYWxzZSwidHlwZWRFbnYiOmZhbHNlLCJpbnN0cnVtZW50YXRpb25Ib29rIjpmYWxzZSwicGFyYWxsZWxTZXJ2ZXJDb21waWxlcyI6ZmFsc2UsInBhcmFsbGVsU2VydmVyQnVpbGRUcmFjZXMiOmZhbHNlLCJwcHIiOmZhbHNlLCJ3ZWJwYWNrTWVtb3J5T3B0aW1pemF0aW9ucyI6ZmFsc2UsIm9wdGltaXplU2VydmVyUmVhY3QiOnRydWUsInVzZUVhcmx5SW1wb3J0IjpmYWxzZSwic3RhbGVUaW1lcyI6eyJkeW5hbWljIjowLCJzdGF0aWMiOjMwMH0sImFmdGVyIjpmYWxzZSwic2VydmVyQ29tcG9uZW50c0htckNhY2hlIjp0cnVlLCJvcHRpbWl6ZVBhY2thZ2VJbXBvcnRzIjpbImx1Y2lkZS1yZWFjdCIsImRhdGUtZm5zIiwibG9kYXNoLWVzIiwicmFtZGEiLCJhbnRkIiwicmVhY3QtYm9vdHN0cmFwIiwiYWhvb2tzIiwiQGFudC1kZXNpZ24vaWNvbnMiLCJAaGVhZGxlc3N1aS9yZWFjdCIsIkBoZWFkbGVzc3VpLWZsb2F0L3JlYWN0IiwiQGhlcm9pY29ucy9yZWFjdC8yMC9zb2xpZCIsIkBoZXJvaWNvbnMvcmVhY3QvMjQvc29saWQiLCJAaGVyb2ljb25zL3JlYWN0LzI0L291dGxpbmUiLCJAdmlzeC92aXN4IiwiQHRyZW1vci9yZWFjdCIsInJ4anMiLCJAbXVpL21hdGVyaWFsIiwiQG11aS9pY29ucy1tYXRlcmlhbCIsInJlY2hhcnRzIiwicmVhY3QtdXNlIiwiZWZmZWN0IiwiQGVmZmVjdC9zY2hlbWEiLCJAZWZmZWN0L3BsYXRmb3JtIiwiQGVmZmVjdC9wbGF0Zm9ybS1ub2RlIiwiQGVmZmVjdC9wbGF0Zm9ybS1icm93c2VyIiwiQGVmZmVjdC9wbGF0Zm9ybS1idW4iLCJAZWZmZWN0L3NxbCIsIkBlZmZlY3Qvc3FsLW1zc3FsIiwiQGVmZmVjdC9zcWwtbXlzcWwyIiwiQGVmZmVjdC9zcWwtcGciLCJAZWZmZWN0L3NxbC1zcXVsaXRlLW5vZGUiLCJAZWZmZWN0L3NxbC1zcXVsaXRlLWJ1biIsIkBlZmZlY3Qvc3FsLXNxdWxpdGUtd2FzbSIsIkBlZmZlY3Qvc3FsLXNxdWxpdGUtcmVhY3QtbmF0aXZlIiwiQGVmZmVjdC9ycGMiLCJAZWZmZWN0L3JwYy1odHRwIiwiQGVmZmVjdC90eXBlY2xhc3MiLCJAZWZmZWN0L2V4cGVyaW1lbnRhbCIsIkBlZmZlY3Qvb3BlbnRlbGVtZXRyeSIsIkBtYXRlcmlhbC11aS9jb3JlIiwiQG1hdGVyaWFsLXVpL2ljb25zIiwiQHRhYmxlci9pY29ucy1yZWFjdCIsIm11aS1jb3JlIiwicmVhY3QtaWNvbnMvYWkiLCJyZWFjdC1pY29ucy9iaSIsInJlYWN0LWljb25zL2JzIiwicmVhY3QtaWNvbnMvY2ciLCJyZWFjdC1pY29ucy9jaSIsInJlYWN0LWljb25zL2RpIiwicmVhY3QtaWNvbnMvZmEiLCJyZWFjdC1pY29ucy9mYTYiLCJyZWFjdC1pY29ucy9mYyIsInJlYWN0LWljb25zL2ZpIiwicmVhY3QtaWNvbnMvZ2kiLCJyZWFjdC1pY29ucy9nbyIsInJlYWN0LWljb25zL2dyIiwicmVhY3QtaWNvbnMvaGkiLCJyZWFjdC1pY29ucy9oaTIiLCJyZWFjdC1pY29ucy9pbSIsInJlYWN0LWljb25zL2lvIiwicmVhY3QtaWNvbnMvaW81IiwicmVhY3QtaWNvbnMvbGlhIiwicmVhY3QtaWNvbnMvbGliIiwicmVhY3QtaWNvbnMvbHUiLCJyZWFjdC1pY29ucy9tZCIsInJlYWN0LWljb25zL3BpIiwicmVhY3QtaWNvbnMvcmkiLCJyZWFjdC1pY29ucy9yeCIsInJlYWN0LWljb25zL3NpIiwicmVhY3QtaWNvbnMvc2wiLCJyZWFjdC1pY29ucy90YiIsInJlYWN0LWljb25zL3RmaSIsInJlYWN0LWljb25zL3RpIiwicmVhY3QtaWNvbnMvdnNjIiwicmVhY3QtaWNvbnMvd2kiXX0sImJ1bmRsZVBhZ2VzUm91dGVyRGVwZW5kZW5jaWVzIjpmYWxzZSwiY29uZmlnRmlsZSI6Ii90bXAvbmV4dC1zdGF0c3hlMUNJOS9zdGF0cy1hcHAvbmV4dC5jb25maWcuanMiLCJjb25maWdGaWxlTmFtZSI6Im5leHQuY29uZmlnLmpzIn0=","pagesType":"app","appDirLoader":"bmV4dC1hcHAtbG9hZGVyP25hbWU9YXBwJTJGYXBwLWVkZ2Utc3NyJTJGcGFnZSZwYWdlPSUyRmFwcC1lZGdlLXNzciUyRnBhZ2UmcGFnZVBhdGg9cHJpdmF0ZS1uZXh0LWFwcC1kaXIlMkZhcHAtZWRnZS1zc3IlMkZwYWdlLmpzJmFwcERpcj0lMkZ0bXAlMkZuZXh0LXN0YXRzeGUxQ0k5JTJGc3RhdHMtYXBwJTJGYXBwJmFwcFBhdGhzPSUyRmFwcC1lZGdlLXNzciUyRnBhZ2UmcGFnZUV4dGVuc2lvbnM9dHN4JnBhZ2VFeHRlbnNpb25zPXRzJnBhZ2VFeHRlbnNpb25zPWpzeCZwYWdlRXh0ZW5zaW9ucz1qcyZiYXNlUGF0aD0mYXNzZXRQcmVmaXg9Jm5leHRDb25maWdPdXRwdXQ9JmZseWluZ1NodXR0bGU9ZmFsc2UmcHJlZmVycmVkUmVnaW9uPSZtaWRkbGV3YXJlQ29uZmlnPWUzMCUzRCE=","sriEnabled":false,"middlewareConfig":"e30="}!
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/lib/page-types.js
+      var page_types = __webpack_require__(8268);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/app-render/encryption-utils.js
+      var encryption_utils = __webpack_require__(8125);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/esm/server/app-render/action-utils.js
+      var action_utils = __webpack_require__(5736); // CONCATENATED MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/dist/build/webpack/loaders/next-edge-ssr-loader/index.js?{"absolute500Path":"","absoluteAppPath":"next/dist/pages/_app","absoluteDocumentPath":"next/dist/pages/_document","absoluteErrorPath":"next/dist/pages/_error","absolutePagePath":"private-next-app-dir/app-edge-ssr/page.js","dev":false,"isServerComponent":true,"page":"/app-edge-ssr/page","stringifiedConfig":"eyJlbnYiOnt9LCJlc2xpbnQiOnsiaWdub3JlRHVyaW5nQnVpbGRzIjpmYWxzZX0sInR5cGVzY3JpcHQiOnsiaWdub3JlQnVpbGRFcnJvcnMiOmZhbHNlLCJ0c2NvbmZpZ1BhdGgiOiJ0c2NvbmZpZy5qc29uIn0sImRpc3REaXIiOiIubmV4dCIsImNsZWFuRGlzdERpciI6dHJ1ZSwiYXNzZXRQcmVmaXgiOiIiLCJjYWNoZU1heE1lbW9yeVNpemUiOjUyNDI4ODAwLCJjb25maWdPcmlnaW4iOiJuZXh0LmNvbmZpZy5qcyIsInVzZUZpbGVTeXN0ZW1QdWJsaWNSb3V0ZXMiOnRydWUsImdlbmVyYXRlRXRhZ3MiOnRydWUsInBhZ2VFeHRlbnNpb25zIjpbInRzeCIsInRzIiwianN4IiwianMiXSwicG93ZXJlZEJ5SGVhZGVyIjp0cnVlLCJjb21wcmVzcyI6dHJ1ZSwiaW1hZ2VzIjp7ImRldmljZVNpemVzIjpbNjQwLDc1MCw4MjgsMTA4MCwxMjAwLDE5MjAsMjA0OCwzODQwXSwiaW1hZ2VTaXplcyI6WzE2LDMyLDQ4LDY0LDk2LDEyOCwyNTYsMzg0XSwicGF0aCI6Ii9fbmV4dC9pbWFnZSIsImxvYWRlciI6ImRlZmF1bHQiLCJsb2FkZXJGaWxlIjoiIiwiZG9tYWlucyI6W10sImRpc2FibGVTdGF0aWNJbWFnZXMiOmZhbHNlLCJtaW5pbXVtQ2FjaGVUVEwiOjYwLCJmb3JtYXRzIjpbImltYWdlL3dlYnAiXSwiZGFuZ2Vyb3VzbHlBbGxvd1NWRyI6ZmFsc2UsImNvbnRlbnRTZWN1cml0eVBvbGljeSI6InNjcmlwdC1zcmMgJ25vbmUnOyBmcmFtZS1zcmMgJ25vbmUnOyBzYW5kYm94OyIsImNvbnRlbnREaXNwb3NpdGlvblR5cGUiOiJhdHRhY2htZW50IiwicmVtb3RlUGF0dGVybnMiOltdLCJ1bm9wdGltaXplZCI6ZmFsc2V9LCJkZXZJbmRpY2F0b3JzIjp7ImFwcElzclN0YXR1cyI6dHJ1ZSwiYnVpbGRBY3Rpdml0eSI6dHJ1ZSwiYnVpbGRBY3Rpdml0eVBvc2l0aW9uIjoiYm90dG9tLXJpZ2h0In0sIm9uRGVtYW5kRW50cmllcyI6eyJtYXhJbmFjdGl2ZUFnZSI6NjAwMDAsInBhZ2VzQnVmZmVyTGVuZ3RoIjo1fSwiYW1wIjp7ImNhbm9uaWNhbEJhc2UiOiIifSwiYmFzZVBhdGgiOiIiLCJzYXNzT3B0aW9ucyI6e30sInRyYWlsaW5nU2xhc2giOmZhbHNlLCJpMThuIjpudWxsLCJwcm9kdWN0aW9uQnJvd3NlclNvdXJjZU1hcHMiOmZhbHNlLCJvcHRpbWl6ZUZvbnRzIjp0cnVlLCJleGNsdWRlRGVmYXVsdE1vbWVudExvY2FsZXMiOnRydWUsInNlcnZlclJ1bnRpbWVDb25maWciOnt9LCJwdWJsaWNSdW50aW1lQ29uZmlnIjp7fSwicmVhY3RQcm9kdWN0aW9uUHJvZmlsaW5nIjpmYWxzZSwicmVhY3RTdHJpY3RNb2RlIjpudWxsLCJodHRwQWdlbnRPcHRpb25zIjp7ImtlZXBBbGl2ZSI6dHJ1ZX0sImxvZ2dpbmciOnt9LCJzdGF0aWNQYWdlR2VuZXJhdGlvblRpbWVvdXQiOjYwLCJtb2R1bGFyaXplSW1wb3J0cyI6eyJAbXVpL2ljb25zLW1hdGVyaWFsIjp7InRyYW5zZm9ybSI6IkBtdWkvaWNvbnMtbWF0ZXJpYWwve3ttZW1iZXJ9fSJ9LCJsb2Rhc2giOnsidHJhbnNmb3JtIjoibG9kYXNoL3t7bWVtYmVyfX0ifX0sImV4cGVyaW1lbnRhbCI6eyJhcHBOYXZGYWlsSGFuZGxpbmciOmZhbHNlLCJmbHlpbmdTaHV0dGxlIjpmYWxzZSwicHJlcmVuZGVyRWFybHlFeGl0Ijp0cnVlLCJzZXJ2ZXJNaW5pZmljYXRpb24iOnRydWUsInNlcnZlclNvdXJjZU1hcHMiOmZhbHNlLCJsaW5rTm9Ub3VjaFN0YXJ0IjpmYWxzZSwiY2FzZVNlbnNpdGl2ZVJvdXRlcyI6ZmFsc2UsInByZWxvYWRFbnRyaWVzT25TdGFydCI6dHJ1ZSwiY2xpZW50Um91dGVyRmlsdGVyIjp0cnVlLCJjbGllbnRSb3V0ZXJGaWx0ZXJSZWRpcmVjdHMiOmZhbHNlLCJmZXRjaENhY2hlS2V5UHJlZml4IjoiIiwibWlkZGxld2FyZVByZWZldGNoIjoiZmxleGlibGUiLCJvcHRpbWlzdGljQ2xpZW50Q2FjaGUiOnRydWUsIm1hbnVhbENsaWVudEJhc2VQYXRoIjpmYWxzZSwiY3B1cyI6MTksIm1lbW9yeUJhc2VkV29ya2Vyc0NvdW50IjpmYWxzZSwiaXNyRmx1c2hUb0Rpc2siOnRydWUsIndvcmtlclRocmVhZHMiOmZhbHNlLCJvcHRpbWl6ZUNzcyI6ZmFsc2UsIm5leHRTY3JpcHRXb3JrZXJzIjpmYWxzZSwic2Nyb2xsUmVzdG9yYXRpb24iOmZhbHNlLCJleHRlcm5hbERpciI6ZmFsc2UsImRpc2FibGVPcHRpbWl6ZWRMb2FkaW5nIjpmYWxzZSwiZ3ppcFNpemUiOnRydWUsImNyYUNvbXBhdCI6ZmFsc2UsImVzbUV4dGVybmFscyI6dHJ1ZSwiZnVsbHlTcGVjaWZpZWQiOmZhbHNlLCJvdXRwdXRGaWxlVHJhY2luZ1Jvb3QiOiIvdG1wL25leHQtc3RhdHN4ZTFDSTkvc3RhdHMtYXBwIiwic3djVHJhY2VQcm9maWxpbmciOmZhbHNlLCJmb3JjZVN3Y1RyYW5zZm9ybXMiOmZhbHNlLCJsYXJnZVBhZ2VEYXRhQnl0ZXMiOjEyODAwMCwiYWRqdXN0Rm9udEZhbGxiYWNrcyI6ZmFsc2UsImFkanVzdEZvbnRGYWxsYmFja3NXaXRoU2l6ZUFkanVzdCI6ZmFsc2UsInR5cGVkUm91dGVzIjpmYWxzZSwidHlwZWRFbnYiOmZhbHNlLCJpbnN0cnVtZW50YXRpb25Ib29rIjpmYWxzZSwicGFyYWxsZWxTZXJ2ZXJDb21waWxlcyI6ZmFsc2UsInBhcmFsbGVsU2VydmVyQnVpbGRUcmFjZXMiOmZhbHNlLCJwcHIiOmZhbHNlLCJ3ZWJwYWNrTWVtb3J5T3B0aW1pemF0aW9ucyI6ZmFsc2UsIm9wdGltaXplU2VydmVyUmVhY3QiOnRydWUsInVzZUVhcmx5SW1wb3J0IjpmYWxzZSwic3RhbGVUaW1lcyI6eyJkeW5hbWljIjowLCJzdGF0aWMiOjMwMH0sImFmdGVyIjpmYWxzZSwic2VydmVyQ29tcG9uZW50c0htckNhY2hlIjp0cnVlLCJvcHRpbWl6ZVBhY2thZ2VJbXBvcnRzIjpbImx1Y2lkZS1yZWFjdCIsImRhdGUtZm5zIiwibG9kYXNoLWVzIiwicmFtZGEiLCJhbnRkIiwicmVhY3QtYm9vdHN0cmFwIiwiYWhvb2tzIiwiQGFudC1kZXNpZ24vaWNvbnMiLCJAaGVhZGxlc3N1aS9yZWFjdCIsIkBoZWFkbGVzc3VpLWZsb2F0L3JlYWN0IiwiQGhlcm9pY29ucy9yZWFjdC8yMC9zb2xpZCIsIkBoZXJvaWNvbnMvcmVhY3QvMjQvc29saWQiLCJAaGVyb2ljb25zL3JlYWN0LzI0L291dGxpbmUiLCJAdmlzeC92aXN4IiwiQHRyZW1vci9yZWFjdCIsInJ4anMiLCJAbXVpL21hdGVyaWFsIiwiQG11aS9pY29ucy1tYXRlcmlhbCIsInJlY2hhcnRzIiwicmVhY3QtdXNlIiwiZWZmZWN0IiwiQGVmZmVjdC9zY2hlbWEiLCJAZWZmZWN0L3BsYXRmb3JtIiwiQGVmZmVjdC9wbGF0Zm9ybS1ub2RlIiwiQGVmZmVjdC9wbGF0Zm9ybS1icm93c2VyIiwiQGVmZmVjdC9wbGF0Zm9ybS1idW4iLCJAZWZmZWN0L3NxbCIsIkBlZmZlY3Qvc3FsLW1zc3FsIiwiQGVmZmVjdC9zcWwtbXlzcWwyIiwiQGVmZmVjdC9zcWwtcGciLCJAZWZmZWN0L3NxbC1zcXVsaXRlLW5vZGUiLCJAZWZmZWN0L3NxbC1zcXVsaXRlLWJ1biIsIkBlZmZlY3Qvc3FsLXNxdWxpdGUtd2FzbSIsIkBlZmZlY3Qvc3FsLXNxdWxpdGUtcmVhY3QtbmF0aXZlIiwiQGVmZmVjdC9ycGMiLCJAZWZmZWN0L3JwYy1odHRwIiwiQGVmZmVjdC90eXBlY2xhc3MiLCJAZWZmZWN0L2V4cGVyaW1lbnRhbCIsIkBlZmZlY3Qvb3BlbnRlbGVtZXRyeSIsIkBtYXRlcmlhbC11aS9jb3JlIiwiQG1hdGVyaWFsLXVpL2ljb25zIiwiQHRhYmxlci9pY29ucy1yZWFjdCIsIm11aS1jb3JlIiwicmVhY3QtaWNvbnMvYWkiLCJyZWFjdC1pY29ucy9iaSIsInJlYWN0LWljb25zL2JzIiwicmVhY3QtaWNvbnMvY2ciLCJyZWFjdC1pY29ucy9jaSIsInJlYWN0LWljb25zL2RpIiwicmVhY3QtaWNvbnMvZmEiLCJyZWFjdC1pY29ucy9mYTYiLCJyZWFjdC1pY29ucy9mYyIsInJlYWN0LWljb25zL2ZpIiwicmVhY3QtaWNvbnMvZ2kiLCJyZWFjdC1pY29ucy9nbyIsInJlYWN0LWljb25zL2dyIiwicmVhY3QtaWNvbnMvaGkiLCJyZWFjdC1pY29ucy9oaTIiLCJyZWFjdC1pY29ucy9pbSIsInJlYWN0LWljb25zL2lvIiwicmVhY3QtaWNvbnMvaW81IiwicmVhY3QtaWNvbnMvbGlhIiwicmVhY3QtaWNvbnMvbGliIiwicmVhY3QtaWNvbnMvbHUiLCJyZWFjdC1pY29ucy9tZCIsInJlYWN0LWljb25zL3BpIiwicmVhY3QtaWNvbnMvcmkiLCJyZWFjdC1pY29ucy9yeCIsInJlYWN0LWljb25zL3NpIiwicmVhY3QtaWNvbnMvc2wiLCJyZWFjdC1pY29ucy90YiIsInJlYWN0LWljb25zL3RmaSIsInJlYWN0LWljb25zL3RpIiwicmVhY3QtaWNvbnMvdnNjIiwicmVhY3QtaWNvbnMvd2kiXX0sImJ1bmRsZVBhZ2VzUm91dGVyRGVwZW5kZW5jaWVzIjpmYWxzZSwiY29uZmlnRmlsZSI6Ii90bXAvbmV4dC1zdGF0c3hlMUNJOS9zdGF0cy1hcHAvbmV4dC5jb25maWcuanMiLCJjb25maWdGaWxlTmFtZSI6Im5leHQuY29uZmlnLmpzIn0=","pagesType":"app","appDirLoader":"bmV4dC1hcHAtbG9hZGVyP25hbWU9YXBwJTJGYXBwLWVkZ2Utc3NyJTJGcGFnZSZwYWdlPSUyRmFwcC1lZGdlLXNzciUyRnBhZ2UmcGFnZVBhdGg9cHJpdmF0ZS1uZXh0LWFwcC1kaXIlMkZhcHAtZWRnZS1zc3IlMkZwYWdlLmpzJmFwcERpcj0lMkZ0bXAlMkZuZXh0LXN0YXRzeGUxQ0k5JTJGc3RhdHMtYXBwJTJGYXBwJmFwcFBhdGhzPSUyRmFwcC1lZGdlLXNzciUyRnBhZ2UmcGFnZUV4dGVuc2lvbnM9dHN4JnBhZ2VFeHRlbnNpb25zPXRzJnBhZ2VFeHRlbnNpb25zPWpzeCZwYWdlRXh0ZW5zaW9ucz1qcyZiYXNlUGF0aD0mYXNzZXRQcmVmaXg9Jm5leHRDb25maWdPdXRwdXQ9JmZseWluZ1NodXR0bGU9ZmFsc2UmcHJlZmVycmVkUmVnaW9uPSZtaWRkbGV3YXJlQ29uZmlnPWUzMCUzRCE=","sriEnabled":false,"middlewareConfig":"e30="}!
       var _self___RSC_MANIFEST;
 
       const incrementalCacheHandler = null;
@@ -430,50 +430,50 @@
       /***/
     },
 
-    /***/ 9062: /***/ (
+    /***/ 1522: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 1311)
+        __webpack_require__.bind(__webpack_require__, 7818)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 8014)
+        __webpack_require__.bind(__webpack_require__, 2460)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 1593)
+        __webpack_require__.bind(__webpack_require__, 7791)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 903)
+        __webpack_require__.bind(__webpack_require__, 3902)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 6086)
+        __webpack_require__.bind(__webpack_require__, 7290)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 234)
+        __webpack_require__.bind(__webpack_require__, 4306)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 3635)
+        __webpack_require__.bind(__webpack_require__, 4355)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 4426)
+        __webpack_require__.bind(__webpack_require__, 1848)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 9376)
+        __webpack_require__.bind(__webpack_require__, 1230)
       );
       Promise.resolve(/* import() eager */).then(
-        __webpack_require__.bind(__webpack_require__, 2842)
+        __webpack_require__.bind(__webpack_require__, 9172)
       );
 
       /***/
     },
 
-    /***/ 2035: /***/ () => {
+    /***/ 3421: /***/ () => {
       /***/
     },
 
-    /***/ 2439: /***/ (
+    /***/ 4781: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -493,7 +493,7 @@
       /***/
     },
 
-    /***/ 4401: /***/ (
+    /***/ 8535: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -505,7 +505,7 @@
         /* harmony export */
       });
       /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
-        __webpack_require__(5172);
+        __webpack_require__(6763);
 
       function RootLayout({ children }) {
         return /*#__PURE__*/ (0,
@@ -524,7 +524,7 @@
     // webpackRuntimeModules
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
-    /******/ __webpack_require__.O(0, [315, 745], () => __webpack_exec__(2108));
+    /******/ __webpack_require__.O(0, [649, 829], () => __webpack_exec__(5436));
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ (_ENTRIES = typeof _ENTRIES === "undefined" ? {} : _ENTRIES)[
       "middleware_app/app-edge-ssr/page"

Diff for middleware.js

Diff too large to display

Diff for edge-ssr.js

Diff too large to display

Diff for image-HASH.js

@@ -1,7 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [8358],
   {
-    /***/ 1362: /***/ (
+    /***/ 9618: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -9,7 +9,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/image",
         function () {
-          return __webpack_require__(2160);
+          return __webpack_require__(699);
         },
       ]);
       if (false) {
@@ -18,7 +18,7 @@
       /***/
     },
 
-    /***/ 537: /***/ (module, exports, __webpack_require__) => {
+    /***/ 9451: /***/ (module, exports, __webpack_require__) => {
       "use strict";
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
@@ -40,16 +40,17 @@
         __webpack_require__(3537)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(7092)
+        __webpack_require__(6490)
       );
-      const _getimgprops = __webpack_require__(9834);
-      const _imageconfig = __webpack_require__(5676);
-      const _imageconfigcontextsharedruntime = __webpack_require__(387);
-      const _warnonce = __webpack_require__(451);
-      const _routercontextsharedruntime = __webpack_require__(5357);
+      const _getimgprops = __webpack_require__(3646);
+      const _imageconfig = __webpack_require__(535);
+      const _imageconfigcontextsharedruntime = __webpack_require__(4724);
+      const _warnonce = __webpack_require__(6321);
+      const _routercontextsharedruntime = __webpack_require__(1759);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(3945)
+        __webpack_require__(1882)
       );
+      const _usemergedref = __webpack_require__(8941);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -168,6 +169,44 @@
             onError,
             ...rest
           } = param;
+          const ownRef = (0, _react.useCallback)(
+            (img) => {
+              if (!img) {
+                return;
+              }
+              if (onError) {
+                // If the image has an error before react hydrates, then the error is lost.
+                // The workaround is to wait until the image is mounted which is after hydration,
+                // then we set the src again to trigger the error handler (if there was an error).
+                // eslint-disable-next-line no-self-assign
+                img.src = img.src;
+              }
+              if (false) {
+              }
+              if (img.complete) {
+                handleLoading(
+                  img,
+                  placeholder,
+                  onLoadRef,
+                  onLoadingCompleteRef,
+                  setBlurComplete,
+                  unoptimized,
+                  sizesInput
+                );
+              }
+            },
+            [
+              src,
+              placeholder,
+              onLoadRef,
+              onLoadingCompleteRef,
+              setBlurComplete,
+              onError,
+              unoptimized,
+              sizesInput,
+            ]
+          );
+          const ref = (0, _usemergedref.useMergedRef)(forwardedRef, ownRef);
           return /*#__PURE__*/ (0, _jsxruntime.jsx)("img", {
             ...rest,
             ...getDynamicProps(fetchPriority),
@@ -190,51 +229,7 @@
             sizes: sizes,
             srcSet: srcSet,
             src: src,
-            ref: (0, _react.useCallback)(
-              (img) => {
-                if (forwardedRef) {
-                  if (typeof forwardedRef === "function") forwardedRef(img);
-                  else if (typeof forwardedRef === "object") {
-                    // @ts-ignore - .current is read only it's usually assigned by react internally
-                    forwardedRef.current = img;
-                  }
-                }
-                if (!img) {
-                  return;
-                }
-                if (onError) {
-                  // If the image has an error before react hydrates, then the error is lost.
-                  // The workaround is to wait until the image is mounted which is after hydration,
-                  // then we set the src again to trigger the error handler (if there was an error).
-                  // eslint-disable-next-line no-self-assign
-                  img.src = img.src;
-                }
-                if (false) {
-                }
-                if (img.complete) {
-                  handleLoading(
-                    img,
-                    placeholder,
-                    onLoadRef,
-                    onLoadingCompleteRef,
-                    setBlurComplete,
-                    unoptimized,
-                    sizesInput
-                  );
-                }
-              },
-              [
-                src,
-                placeholder,
-                onLoadRef,
-                onLoadingCompleteRef,
-                setBlurComplete,
-                onError,
-                unoptimized,
-                sizesInput,
-                forwardedRef,
-              ]
-            ),
+            ref: ref,
             onLoad: (event) => {
               const img = event.currentTarget;
               handleLoading(
@@ -376,7 +371,76 @@
       /***/
     },
 
-    /***/ 9834: /***/ (
+    /***/ 8941: /***/ (module, exports, __webpack_require__) => {
+      "use strict";
+
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      0 && 0;
+      function _export(target, all) {
+        for (var name in all)
+          Object.defineProperty(target, name, {
+            enumerable: true,
+            get: all[name],
+          });
+      }
+      _export(exports, {
+        mergeRefs: function () {
+          return mergeRefs;
+        },
+        useMergedRef: function () {
+          return useMergedRef;
+        },
+      });
+      const _react = __webpack_require__(2516);
+      function useMergedRef(refA, refB) {
+        return (0, _react.useMemo)(() => mergeRefs(refA, refB), [refA, refB]);
+      }
+      function mergeRefs(refA, refB) {
+        if (!refA || !refB) {
+          return refA || refB;
+        }
+        return (current) => {
+          const cleanupA = applyRef(refA, current);
+          const cleanupB = applyRef(refB, current);
+          return () => {
+            cleanupA();
+            cleanupB();
+          };
+        };
+      }
+      function applyRef(refA, current) {
+        if (typeof refA === "function") {
+          const cleanup = refA(current);
+          if (typeof cleanup === "function") {
+            return cleanup;
+          } else {
+            return () => refA(null);
+          }
+        } else {
+          refA.current = current;
+          return () => {
+            refA.current = null;
+          };
+        }
+      }
+      if (
+        (typeof exports.default === "function" ||
+          (typeof exports.default === "object" && exports.default !== null)) &&
+        typeof exports.default.__esModule === "undefined"
+      ) {
+        Object.defineProperty(exports.default, "__esModule", {
+          value: true,
+        });
+        Object.assign(exports.default, exports);
+        module.exports = exports.default;
+      } //# sourceMappingURL=use-merged-ref.js.map
+
+      /***/
+    },
+
+    /***/ 3646: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -392,9 +456,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(451);
-      const _imageblursvg = __webpack_require__(3547);
-      const _imageconfig = __webpack_require__(5676);
+      const _warnonce = __webpack_require__(6321);
+      const _imageblursvg = __webpack_require__(8297);
+      const _imageconfig = __webpack_require__(535);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -766,7 +830,7 @@
       /***/
     },
 
-    /***/ 3547: /***/ (__unused_webpack_module, exports) => {
+    /***/ 8297: /***/ (__unused_webpack_module, exports) => {
       "use strict";
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
@@ -821,7 +885,7 @@
       /***/
     },
 
-    /***/ 6850: /***/ (
+    /***/ 973: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -848,10 +912,10 @@
         },
       });
       const _interop_require_default = __webpack_require__(4345);
-      const _getimgprops = __webpack_require__(9834);
-      const _imagecomponent = __webpack_require__(537);
+      const _getimgprops = __webpack_require__(3646);
+      const _imagecomponent = __webpack_require__(9451);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(3945)
+        __webpack_require__(1882)
       );
       function getImageProps(imgProps) {
         const { props } = (0, _getimgprops.getImgProps)(imgProps, {
@@ -883,7 +947,7 @@
       /***/
     },
 
-    /***/ 3945: /***/ (__unused_webpack_module, exports) => {
+    /***/ 1882: /***/ (__unused_webpack_module, exports) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -918,7 +982,7 @@
       /***/
     },
 
-    /***/ 2160: /***/ (
+    /***/ 699: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -935,8 +999,8 @@
 
       // EXTERNAL MODULE: ./node_modules/.pnpm/react@19.0.0-rc-6230622a1a-20240610/node_modules/react/jsx-runtime.js
       var jsx_runtime = __webpack_require__(898);
-      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+main-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__zehaskxadtwcczqqbmt6koh6bq/node_modules/next/image.js
-      var next_image = __webpack_require__(6793);
+      // EXTERNAL MODULE: ./node_modules/.pnpm/next@file+..+diff-repo+packages+next+next-packed.tgz_react-dom@19.0.0-rc-6230622a1a-20240610__uulzbengwsfwhwaa2ambxampcy/node_modules/next/image.js
+      var next_image = __webpack_require__(1428);
       var image_default = /*#__PURE__*/ __webpack_require__.n(next_image); // CONCATENATED MODULE: ./pages/nextjs.png
       /* harmony default export */ const nextjs = {
         src: "/_next/static/media/nextjs.cae0b805.png",
@@ -966,12 +1030,12 @@
       /***/
     },
 
-    /***/ 6793: /***/ (
+    /***/ 1428: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(6850);
+      module.exports = __webpack_require__(973);
 
       /***/
     },
@@ -981,7 +1045,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [2888, 9774, 179], () =>
-      __webpack_exec__(1362)
+      __webpack_exec__(9618)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;

Diff for link-HASH.js

@@ -1,7 +1,7 @@
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
   [4644],
   {
-    /***/ 4347: /***/ (
+    /***/ 6799: /***/ (
       __unused_webpack_module,
       __unused_webpack_exports,
       __webpack_require__
@@ -9,7 +9,7 @@
       (window.__NEXT_P = window.__NEXT_P || []).push([
         "/link",
         function () {
-          return __webpack_require__(6218);
+          return __webpack_require__(3764);
         },
       ]);
       if (false) {
@@ -18,7 +18,7 @@
       /***/
     },
 
-    /***/ 3474: /***/ (module, exports) => {
+    /***/ 1717: /***/ (module, exports) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -110,7 +110,7 @@
       /***/
     },
 
-    /***/ 1604: /***/ (module, exports, __webpack_require__) => {
+    /***/ 2156: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -122,7 +122,7 @@
           return getDomainLocale;
         },
       });
-      const _normalizetrailingslash = __webpack_require__(2003);
+      const _normalizetrailingslash = __webpack_require__(4030);
       const basePath =
         /* unused pure expression or super */ null && (false || "");
       function getDomainLocale(path, locale, locales, domainLocales) {
@@ -146,7 +146,7 @@
       /***/
     },
 
-    /***/ 6311: /***/ (module, exports, __webpack_require__) => {
+    /***/ 9649: /***/ (module, exports, __webpack_require__) => {
       "use strict";
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
@@ -163,17 +163,18 @@
       const _react = /*#__PURE__*/ _interop_require_default._(
         __webpack_require__(2516)
       );
-      const _resolvehref = __webpack_require__(692);
-      const _islocalurl = __webpack_require__(7635);
-      const _formaturl = __webpack_require__(8281);
-      const _utils = __webpack_require__(5164);
-      const _addlocale = __webpack_require__(5243);
-      const _routercontextsharedruntime = __webpack_require__(5357);
-      const _approutercontextsharedruntime = __webpack_require__(2666);
-      const _useintersection = __webpack_require__(791);
-      const _getdomainlocale = __webpack_require__(1604);
-      const _addbasepath = __webpack_require__(3390);
-      const _routerreducertypes = __webpack_require__(3474);
+      const _resolvehref = __webpack_require__(979);
+      const _islocalurl = __webpack_require__(8591);
+      const _formaturl = __webpack_require__(3594);
+      const _utils = __webpack_require__(4537);
+      const _addlocale = __webpack_require__(380);
+      const _routercontextsharedruntime = __webpack_require__(1759);
+      const _approutercontextsharedruntime = __webpack_require__(9123);
+      const _useintersection = __webpack_require__(2859);
+      const _getdomainlocale = __webpack_require__(2156);
+      const _addbasepath = __webpack_require__(8848);
+      const _routerreducertypes = __webpack_require__(1717);
+      const _usemergedref = __webpack_require__(8941);
       const prefetched = new Set();
       function prefetch(router, href, as, options, appOptions, isAppRouter) {
         if (false) {
@@ -377,7 +378,7 @@
           _useintersection.useIntersection)({
             rootMargin: "200px",
           });
-          const setRef = _react.default.useCallback(
+          const setIntersectionWithResetRef = _react.default.useCallback(
             (el) => {
               // Before the link getting observed, check if visible state need to be reset
               if (previousAs.current !== as || previousHref.current !== href) {
@@ -386,14 +387,12 @@
                 previousHref.current = href;
               }
               setIntersectionRef(el);
-              if (childRef) {
-                if (typeof childRef === "function") childRef(el);
-                else if (typeof childRef === "object") {
-                  childRef.current = el;
-                }
-              }
             },
-            [as, childRef, href, resetVisible, setIntersectionRef]
+            [as, href, resetVisible, setIntersectionRef]
+          );
+          const setRef = (0, _usemergedref.useMergedRef)(
+            setIntersectionWithResetRef,
+            childRef
           );
           // Prefetch the URL if we haven't already and it's visible.
           _react.default.useEffect(() => {
@@ -600,7 +599,7 @@
       /***/
     },
 
-    /***/ 791: /***/ (module, exports, __webpack_require__) => {
+    /***/ 2859: /***/ (module, exports, __webpack_require__) => {
       "use strict";
 
       Object.defineProperty(exports, "__esModule", {
@@ -613,7 +612,7 @@
         },
       });
       const _react = __webpack_require__(2516);
-      const _requestidlecallback = __webpack_require__(7861);
+      const _requestidlecallback = __webpack_require__(3397);
       const hasIntersectionObserver =
         typeof IntersectionObserver === "function";
       const observers = new Map();
@@ -726,7 +725,76 @@
       /***/
     },
 
-    /***/ 6218: /***/ (
+    /***/ 8941: /***/ (module, exports, __webpack_require__) => {
+      "use strict";
+
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      0 && 0;
+      function _export(target, all) {
+        for (var name in all)
+          Object.defineProperty(target, name, {
+            enumerable: true,
+            get: all[name],
+          });
+      }
+      _export(exports, {
+        mergeRefs: function () {
+          return mergeRefs;
+        },
+        useMergedRef: function () {
+          return useMergedRef;
+        },
+      });
+      const _react = __webpack_require__(2516);
+      function useMergedRef(refA, refB) {
+        return (0, _react.useMemo)(() => mergeRefs(refA, refB), [refA, refB]);
+      }
+      function mergeRefs(refA, refB) {
+        if (!refA || !refB) {
+          return refA || refB;
+        }
+        return (current) => {
+          const cleanupA = applyRef(refA, current);
+          const cleanupB = applyRef(refB, current);
+          return () => {
+            cleanupA();
+            cleanupB();
+          };
+        };
+      }
+      function applyRef(refA, current) {
+        if (typeof refA === "function") {
+          const cleanup = refA(current);
+          if (typeof cleanup === "function") {
+            return cleanup;
+          } else {
+            return () => refA(null);
+          }
+        } else {
+          refA.current = current;
+          return () => {
+            refA.current = null;
+          };
+        }
+      }
+      if (
+        (typeof exports.default === "function" ||
+          (typeof exports.default === "object" && exports.default !== null)) &&
+        typeof exports.default.__esModule === "undefined"
+      ) {
+        Object.defineProperty(exports.default, "__esModule", {
+          value: true,
+        });
+        Object.assign(exports.default, exports);
+        module.exports = exports.default;
+      } //# sourceMappingURL=use-merged-ref.js.map
+
+      /***/
+    },
+
+    /***/ 3764: /***/ (
       __unused_webpack_module,
       __webpack_exports__,
       __webpack_require__
@@ -741,7 +809,7 @@
       /* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__ =
         __webpack_require__(898);
       /* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_1__ =
-        __webpack_require__(7353);
+        __webpack_require__(5034);
       /* harmony import */ var next_link__WEBPACK_IMPORTED_MODULE_1___default =
         /*#__PURE__*/ __webpack_require__.n(
           next_link__WEBPACK_IMPORTED_MODULE_1__
@@ -772,12 +840,12 @@
       /***/
     },
 
-    /***/ 7353: /***/ (
+    /***/ 5034: /***/ (
       module,
       __unused_webpack_exports,
       __webpack_require__
     ) => {
-      module.exports = __webpack_require__(6311);
+      module.exports = __webpack_require__(9649);
 
       /***/
     },
@@ -787,7 +855,7 @@
     /******/ var __webpack_exec__ = (moduleId) =>
       __webpack_require__((__webpack_require__.s = moduleId));
     /******/ __webpack_require__.O(0, [2888, 9774, 179], () =>
-      __webpack_exec__(4347)
+      __webpack_exec__(6799)
     );
     /******/ var __webpack_exports__ = __webpack_require__.O();
     /******/ _N_E = __webpack_exports__;

Diff for 7514-HASH.js

@@ -1,8 +1,8 @@
 "use strict";
 (self["webpackChunk_N_E"] = self["webpackChunk_N_E"] || []).push([
-  [7514],
+  [6120],
   {
-    /***/ 7514: /***/ (module, exports, __webpack_require__) => {
+    /***/ 6120: /***/ (module, exports, __webpack_require__) => {
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -13,26 +13,27 @@
           return Image;
         },
       });
-      const _interop_require_default = __webpack_require__(5841);
-      const _interop_require_wildcard = __webpack_require__(9923);
-      const _jsxruntime = __webpack_require__(4612);
+      const _interop_require_default = __webpack_require__(6549);
+      const _interop_require_wildcard = __webpack_require__(5697);
+      const _jsxruntime = __webpack_require__(6617);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(9412)
+        __webpack_require__(9172)
       );
       const _reactdom = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(3275)
+        __webpack_require__(4415)
       );
       const _head = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(6066)
+        __webpack_require__(39)
       );
-      const _getimgprops = __webpack_require__(3178);
-      const _imageconfig = __webpack_require__(2188);
-      const _imageconfigcontextsharedruntime = __webpack_require__(7083);
-      const _warnonce = __webpack_require__(1428);
-      const _routercontextsharedruntime = __webpack_require__(8952);
+      const _getimgprops = __webpack_require__(7669);
+      const _imageconfig = __webpack_require__(564);
+      const _imageconfigcontextsharedruntime = __webpack_require__(6760);
+      const _warnonce = __webpack_require__(9309);
+      const _routercontextsharedruntime = __webpack_require__(6724);
       const _imageloader = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(2429)
+        __webpack_require__(2851)
       );
+      const _usemergedref = __webpack_require__(4568);
       // This is replaced by webpack define plugin
       const configEnv = {
         deviceSizes: [640, 750, 828, 1080, 1200, 1920, 2048, 3840],
@@ -152,6 +153,44 @@
             onError,
             ...rest
           } = param;
+          const ownRef = (0, _react.useCallback)(
+            (img) => {
+              if (!img) {
+                return;
+              }
+              if (onError) {
+                // If the image has an error before react hydrates, then the error is lost.
+                // The workaround is to wait until the image is mounted which is after hydration,
+                // then we set the src again to trigger the error handler (if there was an error).
+                // eslint-disable-next-line no-self-assign
+                img.src = img.src;
+              }
+              if (false) {
+              }
+              if (img.complete) {
+                handleLoading(
+                  img,
+                  placeholder,
+                  onLoadRef,
+                  onLoadingCompleteRef,
+                  setBlurComplete,
+                  unoptimized,
+                  sizesInput
+                );
+              }
+            },
+            [
+              src,
+              placeholder,
+              onLoadRef,
+              onLoadingCompleteRef,
+              setBlurComplete,
+              onError,
+              unoptimized,
+              sizesInput,
+            ]
+          );
+          const ref = (0, _usemergedref.useMergedRef)(forwardedRef, ownRef);
           return /*#__PURE__*/ (0, _jsxruntime.jsx)("img", {
             ...rest,
             ...getDynamicProps(fetchPriority),
@@ -174,51 +213,7 @@
             sizes: sizes,
             srcSet: srcSet,
             src: src,
-            ref: (0, _react.useCallback)(
-              (img) => {
-                if (forwardedRef) {
-                  if (typeof forwardedRef === "function") forwardedRef(img);
-                  else if (typeof forwardedRef === "object") {
-                    // @ts-ignore - .current is read only it's usually assigned by react internally
-                    forwardedRef.current = img;
-                  }
-                }
-                if (!img) {
-                  return;
-                }
-                if (onError) {
-                  // If the image has an error before react hydrates, then the error is lost.
-                  // The workaround is to wait until the image is mounted which is after hydration,
-                  // then we set the src again to trigger the error handler (if there was an error).
-                  // eslint-disable-next-line no-self-assign
-                  img.src = img.src;
-                }
-                if (false) {
-                }
-                if (img.complete) {
-                  handleLoading(
-                    img,
-                    placeholder,
-                    onLoadRef,
-                    onLoadingCompleteRef,
-                    setBlurComplete,
-                    unoptimized,
-                    sizesInput
-                  );
-                }
-              },
-              [
-                src,
-                placeholder,
-                onLoadRef,
-                onLoadingCompleteRef,
-                setBlurComplete,
-                onError,
-                unoptimized,
-                sizesInput,
-                forwardedRef,
-              ]
-            ),
+            ref: ref,
             onLoad: (event) => {
               const img = event.currentTarget;
               handleLoading(
@@ -360,7 +355,74 @@
       /***/
     },
 
-    /***/ 5659: /***/ (
+    /***/ 4568: /***/ (module, exports, __webpack_require__) => {
+      Object.defineProperty(exports, "__esModule", {
+        value: true,
+      });
+      0 && 0;
+      function _export(target, all) {
+        for (var name in all)
+          Object.defineProperty(target, name, {
+            enumerable: true,
+            get: all[name],
+          });
+      }
+      _export(exports, {
+        mergeRefs: function () {
+          return mergeRefs;
+        },
+        useMergedRef: function () {
+          return useMergedRef;
+        },
+      });
+      const _react = __webpack_require__(9172);
+      function useMergedRef(refA, refB) {
+        return (0, _react.useMemo)(() => mergeRefs(refA, refB), [refA, refB]);
+      }
+      function mergeRefs(refA, refB) {
+        if (!refA || !refB) {
+          return refA || refB;
+        }
+        return (current) => {
+          const cleanupA = applyRef(refA, current);
+          const cleanupB = applyRef(refB, current);
+          return () => {
+            cleanupA();
+            cleanupB();
+          };
+        };
+      }
+      function applyRef(refA, current) {
+        if (typeof refA === "function") {
+          const cleanup = refA(current);
+          if (typeof cleanup === "function") {
+            return cleanup;
+          } else {
+            return () => refA(null);
+          }
+        } else {
+          refA.current = current;
+          return () => {
+            refA.current = null;
+          };
+        }
+      }
+      if (
+        (typeof exports.default === "function" ||
+          (typeof exports.default === "object" && exports.default !== null)) &&
+        typeof exports.default.__esModule === "undefined"
+      ) {
+        Object.defineProperty(exports.default, "__esModule", {
+          value: true,
+        });
+        Object.assign(exports.default, exports);
+        module.exports = exports.default;
+      } //# sourceMappingURL=use-merged-ref.js.map
+
+      /***/
+    },
+
+    /***/ 4366: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -374,9 +436,9 @@
           return AmpStateContext;
         },
       });
-      const _interop_require_default = __webpack_require__(5841);
+      const _interop_require_default = __webpack_require__(6549);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(9412)
+        __webpack_require__(9172)
       );
       const AmpStateContext = _react.default.createContext({});
       if (false) {
@@ -385,7 +447,7 @@
       /***/
     },
 
-    /***/ 9891: /***/ (__unused_webpack_module, exports) => {
+    /***/ 6318: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -407,7 +469,7 @@
       /***/
     },
 
-    /***/ 3178: /***/ (
+    /***/ 7669: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -421,9 +483,9 @@
           return getImgProps;
         },
       });
-      const _warnonce = __webpack_require__(1428);
-      const _imageblursvg = __webpack_require__(9042);
-      const _imageconfig = __webpack_require__(2188);
+      const _warnonce = __webpack_require__(9309);
+      const _imageblursvg = __webpack_require__(2240);
+      const _imageconfig = __webpack_require__(564);
       const VALID_LOADING_VALUES =
         /* unused pure expression or super */ null && [
           "lazy",
@@ -795,7 +857,7 @@
       /***/
     },
 
-    /***/ 6066: /***/ (module, exports, __webpack_require__) => {
+    /***/ 39: /***/ (module, exports, __webpack_require__) => {
       /* __next_internal_client_entry_do_not_use__  cjs */
       Object.defineProperty(exports, "__esModule", {
         value: true,
@@ -816,19 +878,19 @@
           return defaultHead;
         },
       });
-      const _interop_require_default = __webpack_require__(5841);
-      const _interop_require_wildcard = __webpack_require__(9923);
-      const _jsxruntime = __webpack_require__(4612);
+      const _interop_require_default = __webpack_require__(6549);
+      const _interop_require_wildcard = __webpack_require__(5697);
+      const _jsxruntime = __webpack_require__(6617);
       const _react = /*#__PURE__*/ _interop_require_wildcard._(
-        __webpack_require__(9412)
+        __webpack_require__(9172)
       );
       const _sideeffect = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(8755)
+        __webpack_require__(9955)
       );
-      const _ampcontextsharedruntime = __webpack_require__(5659);
-      const _headmanagercontextsharedruntime = __webpack_require__(6267);
-      const _ampmode = __webpack_require__(9891);
-      const _warnonce = __webpack_require__(1428);
+      const _ampcontextsharedruntime = __webpack_require__(4366);
+      const _headmanagercontextsharedruntime = __webpack_require__(8251);
+      const _ampmode = __webpack_require__(6318);
+      const _warnonce = __webpack_require__(9309);
       function defaultHead(inAmpMode) {
         if (inAmpMode === void 0) inAmpMode = false;
         const head = [
@@ -1012,7 +1074,7 @@
       /***/
     },
 
-    /***/ 9042: /***/ (__unused_webpack_module, exports) => {
+    /***/ 2240: /***/ (__unused_webpack_module, exports) => {
       /**
        * A shared function, used on both client and server, to generate a SVG blur placeholder.
        */
@@ -1066,7 +1128,7 @@
       /***/
     },
 
-    /***/ 7083: /***/ (
+    /***/ 6760: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1080,11 +1142,11 @@
           return ImageConfigContext;
         },
       });
-      const _interop_require_default = __webpack_require__(5841);
+      const _interop_require_default = __webpack_require__(6549);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(9412)
+        __webpack_require__(9172)
       );
-      const _imageconfig = __webpack_require__(2188);
+      const _imageconfig = __webpack_require__(564);
       const ImageConfigContext = _react.default.createContext(
         _imageconfig.imageConfigDefault
       );
@@ -1094,7 +1156,7 @@
       /***/
     },
 
-    /***/ 2188: /***/ (__unused_webpack_module, exports) => {
+    /***/ 564: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -1141,7 +1203,7 @@
       /***/
     },
 
-    /***/ 2429: /***/ (__unused_webpack_module, exports) => {
+    /***/ 2851: /***/ (__unused_webpack_module, exports) => {
       Object.defineProperty(exports, "__esModule", {
         value: true,
       });
@@ -1174,7 +1236,7 @@
       /***/
     },
 
-    /***/ 8952: /***/ (
+    /***/ 6724: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1188,9 +1250,9 @@
           return RouterContext;
         },
       });
-      const _interop_require_default = __webpack_require__(5841);
+      const _interop_require_default = __webpack_require__(6549);
       const _react = /*#__PURE__*/ _interop_require_default._(
-        __webpack_require__(9412)
+        __webpack_require__(9172)
       );
       const RouterContext = _react.default.createContext(null);
       if (false) {
@@ -1199,7 +1261,7 @@
       /***/
     },
 
-    /***/ 8755: /***/ (
+    /***/ 9955: /***/ (
       __unused_webpack_module,
       exports,
       __webpack_require__
@@ -1213,7 +1275,7 @@
           return SideEffect;
         },
       });
-      const _react = __webpack_require__(9412);
+      const _react = __webpack_require__(9172);
       const isServer = typeof window === "undefined";
       const useClientOnlyLayoutEffect = isServer
         ? () => {}

Diff for main-HASH.js

Diff too large to display

Commit: 3b10ad9

…ink and Image

eps1lon · 2024-07-25T12:27:20Z

packages/next/src/client/use-merged-ref.ts

+    const cleanupA = applyRef(refA, current)
+    const cleanupB = applyRef(refB, current)
+
+    return () => {


We don't have to handle backwards compatibility with React 18 so we can always return a cleanup. If we'd have to handle React 18, we'd have to only return a cleanup when we receive a cleanup and to trigger the default React warning in 18 where you can't return a cleanup function.

… cleanup function" (#68176) Seems this is causing us to hit the following error our vercel-site ```sh ReferenceError: navigator is not defined vercel-site:build: at s (/vercel/path0/apps/vercel-site/.next/server/chunks-EDOwHfQ0FCxDTUqmP-83_/65787.js:161:168406) vercel-site:build: at u (/vercel/path0/apps/vercel-site/.next/server/chunks-EDOwHfQ0FCxDTUqmP-83_/65787.js:50:154810) ``` Reverts #68123

lubieowoce added the Image (next/image) Related to Next.js Image Optimization. label Jul 24, 2024

lubieowoce requested review from styfle, gnoff, timneutkens and eps1lon July 24, 2024 19:02

ijjk added created-by: Next.js team PRs by the Next.js team. tests type: next labels Jul 24, 2024

lubieowoce commented Jul 24, 2024

View reviewed changes

lubieowoce force-pushed the fix-ref-merging branch 2 times, most recently from f0dbaea to ca53fff Compare July 24, 2024 20:27

lubieowoce added 2 commits July 25, 2024 13:05

fix: correct ref merging for callback refs that return a cleanup in L…

94b99d2

…ink and Image

test: callback ref cleanups

3b10ad9

lubieowoce force-pushed the fix-ref-merging branch from ca53fff to 3b10ad9 Compare July 25, 2024 11:06

eps1lon approved these changes Jul 25, 2024

View reviewed changes

lubieowoce merged commit ccbcfff into canary Jul 25, 2024
105 checks passed

lubieowoce deleted the fix-ref-merging branch July 25, 2024 13:57

ijjk mentioned this pull request Jul 26, 2024

Revert "[image, link] fix ref merging for callback refs that return a cleanup function" #68176

Merged

github-actions bot added the locked label Aug 9, 2024

github-actions bot locked as resolved and limited conversation to collaborators Aug 9, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[image, link] fix ref merging for callback refs that return a cleanup function #68123

[image, link] fix ref merging for callback refs that return a cleanup function #68123

lubieowoce commented Jul 24, 2024 •

edited

Loading

ijjk commented Jul 24, 2024 •

edited

Loading

lubieowoce Jul 24, 2024 •

edited

Loading

lubieowoce Jul 24, 2024

ijjk commented Jul 24, 2024 •

edited

Loading

eps1lon Jul 25, 2024

[image, link] fix ref merging for callback refs that return a cleanup function #68123

[image, link] fix ref merging for callback refs that return a cleanup function #68123

Conversation

lubieowoce commented Jul 24, 2024 • edited Loading

What

Why

How

ijjk commented Jul 24, 2024 • edited Loading

Tests Passed

lubieowoce Jul 24, 2024 • edited Loading

Choose a reason for hiding this comment

lubieowoce Jul 24, 2024

Choose a reason for hiding this comment

ijjk commented Jul 24, 2024 • edited Loading

Stats from current PR

eps1lon Jul 25, 2024

Choose a reason for hiding this comment

lubieowoce commented Jul 24, 2024 •

edited

Loading

ijjk commented Jul 24, 2024 •

edited

Loading

lubieowoce Jul 24, 2024 •

edited

Loading

ijjk commented Jul 24, 2024 •

edited

Loading