Fix build crash with parallel routes and root-level dynamic parameters (#85074)

### What?

Fixes a build-time crash that occurs when using parallel routes (`@slot`
syntax) combined with root-level dynamic parameters (e.g., `[locale]`)
in the App Router.

### Why?

When building static paths for routes with both parallel routes and
root-level dynamic parameters, the build would crash during pathname
generation. This happened because the code was using `RouteRegex.groups`
to determine parameter properties (`repeat`/`optional`), but the regex
groups didn't properly handle segment names for nested parallel route
structures. The pathname replacement logic would fail when trying to
match segment patterns, causing the build to abort.

This is a critical issue because it blocks developers from using a
common pattern: internationalization with parallel routes (e.g.,
`/[locale]/@modal/...`).

### How?

The fix refactors the parameter validation logic to use
`DynamicParamTypes` directly instead of relying on `RouteRegex`:

1. Created a new `getParamProperties()` utility in
`get-segment-param.tsx` that determines `repeat` and `optional`
properties based on the parameter type (catchall, optional-catchall,
dynamic, etc.)
2. Updated `buildAppStaticPaths()` to use this utility instead of
`RouteRegex.groups`
3. Changed pathname replacement to use the segment name from
`childrenRouteParamSegments` rather than reconstructing it from the
regex pattern

This approach:
- Eliminates the mismatch between regex-based pattern matching and
actual segment structure
- Properly handles parallel route segment names
- Makes the code more maintainable by using the type system instead of
regex internals

Fixes #84509

Author: wyattjoh

packages/next/errors.json

@@ -891,5 +891,6 @@
   "890": "Received an underlying cookies object that does not match either `cookies` or `mutableCookies`",
   "891": "Failed to read build paths file \"%s\": %s",
   "892": "Failed to resolve glob pattern \"%s\": %s",
-  "893": "The \"sassOptions.functions\" option is not supported when using Turbopack. Custom Sass functions are only available with webpack. Please remove the \"functions\" property from your sassOptions in %s."
+  "893": "The \"sassOptions.functions\" option is not supported when using Turbopack. Custom Sass functions are only available with webpack. Please remove the \"functions\" property from your sassOptions in %s.",
+  "894": "Param %s not found in childrenRouteParamSegments %s"
 }

packages/next/src/build/static-paths/app.ts

@@ -11,10 +11,6 @@ import path from 'node:path'
 import { AfterRunner } from '../../server/after/run-with-after'
 import { createWorkStore } from '../../server/async-storage/work-store'
 import { FallbackMode } from '../../lib/fallback'
-import {
-  getRouteRegex,
-  type RouteRegex,
-} from '../../shared/lib/router/utils/route-regex'
 import type { IncrementalCache } from '../../server/lib/incremental-cache'
 import {
   normalizePathname,
@@ -27,6 +23,7 @@ import type { NextConfigComplete } from '../../server/config-shared'
 import type { WorkStore } from '../../server/app-render/work-async-storage.external'
 import type { DynamicParamTypes } from '../../shared/lib/app-router-types'
 import { InvariantError } from '../../shared/lib/invariant-error'
+import { getParamProperties } from '../../shared/lib/router/utils/get-segment-param'
 
 /**
  * Filters out duplicate parameters from a list of parameters.
@@ -301,17 +298,17 @@ export function calculateFallbackMode(
  * @param page - The page to validate.
  * @param regex - The route regex.
  * @param isRoutePPREnabled - Whether the route has partial prerendering enabled.
- * @param childrenRouteParams - The keys of the parameters.
+ * @param childrenRouteParamSegments - The keys of the parameters.
  * @param rootParamKeys - The keys of the root params.
  * @param routeParams - The list of parameters to validate.
  * @returns The list of validated parameters.
  */
 function validateParams(
   page: string,
-  regex: RouteRegex,
   isRoutePPREnabled: boolean,
-  childrenRouteParams: ReadonlyArray<{
+  childrenRouteParamSegments: ReadonlyArray<{
     readonly paramName: string
+    readonly paramType: DynamicParamTypes
   }>,
   rootParamKeys: readonly string[],
   routeParams: readonly Params[]
@@ -342,8 +339,8 @@ function validateParams(
   for (const params of routeParams) {
     const item: Params = {}
 
-    for (const { paramName: key } of childrenRouteParams) {
-      const { repeat, optional } = regex.groups[key]
+    for (const { paramName: key, paramType } of childrenRouteParamSegments) {
+      const { repeat, optional } = getParamProperties(paramType)
 
       let paramValue = params[key]
 
@@ -776,8 +773,6 @@ export async function buildAppStaticPaths({
     cacheMaxMemorySize: maxMemoryCacheSize,
   })
 
-  const regex = getRouteRegex(page)
-
   const childrenRouteParamSegments: Array<{
     readonly name: string
     readonly paramName: string
@@ -927,17 +922,6 @@ export async function buildAppStaticPaths({
 
   const prerenderedRoutesByPathname = new Map<string, PrerenderedRoute>()
 
-  // Precompile the regex patterns for the route params.
-  const paramPatterns = new Map<string, string>()
-  for (const { paramName } of childrenRouteParamSegments) {
-    const { repeat, optional } = regex.groups[paramName]
-    let pattern = `[${repeat ? '...' : ''}${paramName}]`
-    if (optional) {
-      pattern = `[${pattern}]`
-    }
-    paramPatterns.set(paramName, pattern)
-  }
-
   // Convert rootParamKeys to Set for O(1) lookup.
   const rootParamSet = new Set(rootParamKeys)
 
@@ -984,7 +968,6 @@ export async function buildAppStaticPaths({
       childrenRouteParamSegments,
       validateParams(
         page,
-        regex,
         isRoutePPREnabled,
         childrenRouteParamSegments,
         rootParamKeys,
@@ -1030,14 +1013,21 @@ export async function buildAppStaticPaths({
           }
         }
 
-        // Use pre-compiled pattern for replacement
-        const pattern = paramPatterns.get(key)!
+        const segment = childrenRouteParamSegments.find(
+          ({ paramName }) => paramName === key
+        )
+        if (!segment) {
+          throw new InvariantError(
+            `Param ${key} not found in childrenRouteParamSegments ${childrenRouteParamSegments.map(({ paramName }) => paramName).join(', ')}`
+          )
+        }
+
         pathname = pathname.replace(
-          pattern,
+          segment.name,
           encodeParam(paramValue, (value) => escapePathDelimiters(value, true))
         )
         encodedPathname = encodedPathname.replace(
-          pattern,
+          segment.name,
           encodeParam(paramValue, encodeURIComponent)
         )
       }

packages/next/src/shared/lib/router/utils/get-segment-param.tsx

@@ -53,3 +53,29 @@ export function isCatchAll(
     type === 'optional-catchall'
   )
 }
+
+export function getParamProperties(paramType: DynamicParamTypes): {
+  repeat: boolean
+  optional: boolean
+} {
+  let repeat = false
+  let optional = false
+
+  switch (paramType) {
+    case 'catchall':
+    case 'catchall-intercepted':
+      repeat = true
+      break
+    case 'optional-catchall':
+      repeat = true
+      optional = true
+      break
+    case 'dynamic':
+    case 'dynamic-intercepted':
+      break
+    default:
+      paramType satisfies never
+  }
+
+  return { repeat, optional }
+}

test/e2e/app-dir/parallel-routes-catchall-slotted-non-catchalls/app/[locale]/@slot/default.tsx

@@ -0,0 +1,3 @@
+export default function Default() {
+  return <div>/[locale]/@slot/default.tsx</div>
+}

test/e2e/app-dir/parallel-routes-catchall-slotted-non-catchalls/app/[locale]/@slot/other/page.tsx

@@ -0,0 +1,3 @@
+export default function Page() {
+  return <div>/[locale]/@slot/other/page.tsx</div>
+}

test/e2e/app-dir/parallel-routes-catchall-slotted-non-catchalls/app/[locale]/layout.tsx

@@ -0,0 +1,14 @@
+export default function Layout({
+  children,
+  slot,
+}: {
+  children: React.ReactNode
+  slot: React.ReactNode
+}) {
+  return (
+    <>
+      Children: <div id="children">{children}</div>
+      Slot: <div id="slot">{slot}</div>
+    </>
+  )
+}

test/e2e/app-dir/parallel-routes-catchall-slotted-non-catchalls/app/layout.tsx

@@ -3,9 +3,7 @@ import React from 'react'
 export default function Root({ children }: { children: React.ReactNode }) {
   return (
     <html>
-      <body>
-        Children: <div id="children">{children}</div>
-      </body>
+      <body>{children}</body>
     </html>
   )
 }