From 1d285aefafc6003b53a75d59e9624b3871f6c686 Mon Sep 17 00:00:00 2001
From: Jiachi Liu <inbox@huozhi.im>
Date: Fri, 20 Dec 2024 23:12:27 +0100
Subject: [PATCH] [metadata] Align prefetch head type with head (#74161)

---
 .../router-reducer/ppr-navigations.ts           | 17 ++++++++++-------
 .../components/segment-cache/navigation.ts      |  4 ++--
 .../lib/app-router-context.shared-runtime.ts    |  4 ++--
 3 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/packages/next/src/client/components/router-reducer/ppr-navigations.ts b/packages/next/src/client/components/router-reducer/ppr-navigations.ts
index 3960b2f18f28f..2ef185e84b507 100644
--- a/packages/next/src/client/components/router-reducer/ppr-navigations.ts
+++ b/packages/next/src/client/components/router-reducer/ppr-navigations.ts
@@ -71,7 +71,7 @@ export function updateCacheNodeOnNavigation(
   oldRouterState: FlightRouterState,
   newRouterState: FlightRouterState,
   prefetchData: CacheNodeSeedData | null,
-  prefetchHead: HeadData,
+  prefetchHead: HeadData | null,
   isPrefetchHeadPartial: boolean
 ): Task | null {
   // Diff the old and new trees to reuse the shared layouts.
@@ -286,7 +286,7 @@ export function updateCacheNodeOnNavigation(
 function createCacheNodeOnNavigation(
   routerState: FlightRouterState,
   prefetchData: CacheNodeSeedData | null,
-  possiblyPartialPrefetchHead: HeadData,
+  possiblyPartialPrefetchHead: HeadData | null,
   isPrefetchHeadPartial: boolean
 ): Task {
   // Same traversal as updateCacheNodeNavigation, but we switch to this path
@@ -387,7 +387,10 @@ function createCacheNodeOnNavigation(
       // `prefetchRsc` field.
       rsc,
       prefetchRsc: null,
-      head: isLeafSegment ? possiblyPartialPrefetchHead : [null, null],
+      head: (isLeafSegment ? possiblyPartialPrefetchHead : null) ?? [
+        null,
+        null,
+      ],
       prefetchHead: null,
       loading,
       parallelRoutes: cacheNodeChildren,
@@ -422,7 +425,7 @@ function patchRouterStateWithNewChildren(
 function spawnPendingTask(
   routerState: FlightRouterState,
   prefetchData: CacheNodeSeedData | null,
-  prefetchHead: React.ReactNode | null,
+  prefetchHead: HeadData | null,
   isPrefetchHeadPartial: boolean
 ): Task {
   // Create a task that will later be fulfilled by data from the server.
@@ -645,7 +648,7 @@ function finishTaskUsingDynamicDataPayload(
 function createPendingCacheNode(
   routerState: FlightRouterState,
   prefetchData: CacheNodeSeedData | null,
-  prefetchHead: React.ReactNode | null,
+  prefetchHead: HeadData | null,
   isPrefetchHeadPartial: boolean
 ): ReadyCacheNode {
   const routerStateChildren = routerState[1]
@@ -685,7 +688,7 @@ function createPendingCacheNode(
     parallelRoutes: parallelRoutes,
 
     prefetchRsc: maybePrefetchRsc !== undefined ? maybePrefetchRsc : null,
-    prefetchHead: isLeafSegment ? prefetchHead : null,
+    prefetchHead: isLeafSegment ? prefetchHead : [null, null],
 
     // TODO: Technically, a loading boundary could contain dynamic data. We must
     // have separate `loading` and `prefetchLoading` fields to handle this, like
@@ -940,7 +943,7 @@ export function updateCacheNodeOnPopstateRestoration(
     rsc,
     head: oldCacheNode.head,
 
-    prefetchHead: shouldUsePrefetch ? oldCacheNode.prefetchHead : null,
+    prefetchHead: shouldUsePrefetch ? oldCacheNode.prefetchHead : [null, null],
     prefetchRsc: shouldUsePrefetch ? oldCacheNode.prefetchRsc : null,
     loading: oldCacheNode.loading,
 
diff --git a/packages/next/src/client/components/segment-cache/navigation.ts b/packages/next/src/client/components/segment-cache/navigation.ts
index 0ca68f6a8f1ab..869fd22723dbe 100644
--- a/packages/next/src/client/components/segment-cache/navigation.ts
+++ b/packages/next/src/client/components/segment-cache/navigation.ts
@@ -126,7 +126,7 @@ function navigateUsingPrefetchedRouteTree(
   currentFlightRouterState: FlightRouterState,
   prefetchFlightRouterState: FlightRouterState,
   prefetchSeedData: CacheNodeSeedData | null,
-  prefetchHead: HeadData,
+  prefetchHead: HeadData | null,
   isPrefetchHeadPartial: boolean,
   canonicalUrl: string
 ): SuccessfulNavigationResult | NoOpNavigationResult {
@@ -302,7 +302,7 @@ async function navigateDynamicallyWithNoPrefetch(
   // In our simulated prefetch payload, we pretend that there's no seed data
   // nor a prefetch head.
   const prefetchSeedData = null
-  const prefetchHead: [null, null] = [null, null]
+  const prefetchHead = null
   const isPrefetchHeadPartial = true
 
   const canonicalUrl = createCanonicalUrl(
diff --git a/packages/next/src/shared/lib/app-router-context.shared-runtime.ts b/packages/next/src/shared/lib/app-router-context.shared-runtime.ts
index 890b28552f1e0..41fd7533421e0 100644
--- a/packages/next/src/shared/lib/app-router-context.shared-runtime.ts
+++ b/packages/next/src/shared/lib/app-router-context.shared-runtime.ts
@@ -56,7 +56,7 @@ export type LazyCacheNode = {
    */
   lazyData: Promise<FetchServerResponseResult> | null
 
-  prefetchHead: React.ReactNode
+  prefetchHead: HeadData | null
 
   head: HeadData
 
@@ -99,7 +99,7 @@ export type ReadyCacheNode = {
    * There should never be a lazy data request in this case.
    */
   lazyData: null
-  prefetchHead: React.ReactNode
+  prefetchHead: HeadData | null
 
   head: HeadData