Pass params to head

vercel · Oct 25, 2022 · 0b2507f · 0b2507f
1 parent a1c7929
commit 0b2507f
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 21 deletions.
diff --git a/packages/next/client/components/app-router.tsx b/packages/next/client/components/app-router.tsx
@@ -176,7 +176,6 @@ function Router({
   const head = useMemo(() => {
     return findHeadInCache(cache, tree[1])
   }, [cache, tree])
-  console.log({ head })
 
   useEffect(() => {
     // Ensure initialParallelRoutes is cleaned up from memory once it's used.

diff --git a/packages/next/server/app-render.tsx b/packages/next/server/app-render.tsx
@@ -162,26 +162,6 @@ function interopDefault(mod: any) {
   return mod.default || mod
 }
 
-async function resolveHead(
-  [_segment, parallelRoutes, { head }]: LoaderTree,
-  props: {}
-): Promise<React.ReactNode> {
-  for (const key in parallelRoutes) {
-    const childTree = parallelRoutes[key]
-    const returnedHead = await resolveHead(childTree, props)
-    if (returnedHead) {
-      return returnedHead
-    }
-  }
-
-  if (head) {
-    const HeadComp = await interopDefault(head())
-    return <HeadComp />
-  }
-
-  return null
-}
-
 // tolerate dynamic server errors during prerendering so console
 // isn't spammed with unactionable errors
 /**
@@ -868,6 +848,40 @@ export async function renderToHTMLOrFlight(
       }
     }
 
+    async function resolveHead(
+      [segment, parallelRoutes, { head }]: LoaderTree,
+      parentParams: { [key: string]: any }
+    ): Promise<React.ReactNode> {
+      // Handle dynamic segment params.
+      const segmentParam = getDynamicParamFromSegment(segment)
+      /**
+       * Create object holding the parent params and current params
+       */
+      const currentParams =
+        // Handle null case where dynamic param is optional
+        segmentParam && segmentParam.value !== null
+          ? {
+              ...parentParams,
+              [segmentParam.param]: segmentParam.value,
+            }
+          : // Pass through parent params to children
+            parentParams
+      for (const key in parallelRoutes) {
+        const childTree = parallelRoutes[key]
+        const returnedHead = await resolveHead(childTree, currentParams)
+        if (returnedHead) {
+          return returnedHead
+        }
+      }
+
+      if (head) {
+        const Head = await interopDefault(head())
+        return <Head params={currentParams} />
+      }
+
+      return null
+    }
+
     const createFlightRouterStateFromLoaderTree = (
       [segment, parallelRoutes, { layout }]: LoaderTree,
       rootLayoutIncluded = false