feat: handle rootParams in routes (finish changes) (#81086)

This PR enables the use of root params in route handlers by:

1. Modifying the app route module to extract root params from
context.params based on rootParamNames
2. Passing these root params to the request store in route handlers
3. Removing the error that previously prevented using root params in
route handlers
4. Simplifying the rootParams handling by directly using string arrays
instead of ParamInfo objects
5. Replacing the custom encodeToBase64 utility with standard
Buffer.from().toString('base64')

Author: bgub

crates/next-api/src/app.rs

@@ -4,8 +4,8 @@ use next_core::{
     app_segment_config::NextSegmentConfig,
     app_structure::{
         AppPageLoaderTree, CollectedRootParams, Entrypoint as AppEntrypoint,
-        Entrypoints as AppEntrypoints, FileSystemPathVec, MetadataItem, collect_root_params,
-        get_entrypoints,
+        Entrypoints as AppEntrypoints, FileSystemPathVec, MetadataItem, RootParamVecOption,
+        collect_root_params, get_entrypoints,
     },
     get_edge_resolve_options_context, get_next_package,
     next_app::{
@@ -992,7 +992,10 @@ pub fn app_entry_point_to_route(
 ) -> Vc<Route> {
     match entrypoint {
         AppEntrypoint::AppPage {
-            pages, loader_tree, ..
+            pages,
+            loader_tree,
+            root_params,
+            ..
         } => Route::AppPage(
             pages
                 .into_iter()
@@ -1006,6 +1009,7 @@ pub fn app_entry_point_to_route(
                             },
                             app_project,
                             page: page.clone(),
+                            root_params,
                         }
                         .resolved_cell(),
                     ),
@@ -1017,6 +1021,7 @@ pub fn app_entry_point_to_route(
                             },
                             app_project,
                             page,
+                            root_params,
                         }
                         .resolved_cell(),
                     ),
@@ -1027,6 +1032,7 @@ pub fn app_entry_point_to_route(
             page,
             path,
             root_layouts,
+            root_params,
             ..
         } => Route::AppRoute {
             original_name: page.to_string().into(),
@@ -1035,17 +1041,24 @@ pub fn app_entry_point_to_route(
                     ty: AppEndpointType::Route { path, root_layouts },
                     app_project,
                     page,
+                    root_params,
                 }
                 .resolved_cell(),
             ),
         },
-        AppEntrypoint::AppMetadata { page, metadata, .. } => Route::AppRoute {
+        AppEntrypoint::AppMetadata {
+            page,
+            metadata,
+            root_params,
+            ..
+        } => Route::AppRoute {
             original_name: page.to_string().into(),
             endpoint: ResolvedVc::upcast(
                 AppEndpoint {
                     ty: AppEndpointType::Metadata { metadata },
                     app_project,
                     page,
+                    root_params,
                 }
                 .resolved_cell(),
             ),
@@ -1083,6 +1096,7 @@ struct AppEndpoint {
     ty: AppEndpointType,
     app_project: ResolvedVc<AppProject>,
     page: AppPage,
+    root_params: ResolvedVc<RootParamVecOption>,
 }
 
 #[turbo_tasks::value_impl]
@@ -1129,6 +1143,7 @@ impl AppEndpoint {
             self.app_project.project().project_path().owned().await?,
             config,
             next_config,
+            *self.root_params,
         ))
     }
 

crates/next-core/src/next_app/app_route_entry.rs

@@ -35,6 +35,7 @@ pub async fn get_app_route_entry(
     project_root: FileSystemPath,
     original_segment_config: Option<Vc<NextSegmentConfig>>,
     next_config: Vc<NextConfig>,
+    root_params: Vc<crate::app_structure::RootParamVecOption>,
 ) -> Result<Vc<AppEntry>> {
     let segment_from_source = parse_segment_config_from_source(source);
     let config = if let Some(original_segment_config) = original_segment_config {
@@ -70,6 +71,18 @@ pub async fn get_app_route_entry(
         .map(RcStr::from)
         .unwrap_or_else(|| "\"\"".into());
 
+    // Convert root params to JSON array of parameter names
+    let root_param_names = if let Some(root_params_vec) = &*root_params.await? {
+        serde_json::to_string(
+            &root_params_vec
+                .iter()
+                .map(|param| param.param.as_str())
+                .collect::<Vec<_>>(),
+        )?
+    } else {
+        "[]".to_string()
+    };
+
     // Load the file from the next.js codebase.
     let virtual_source = load_next_js_template(
         "app-route.js",
@@ -85,7 +98,7 @@ pub async fn get_app_route_entry(
         },
         fxindexmap! {
             "nextConfigOutput" => output_type,
-            // "rootParamNames" => ... // TODO(root-params)
+            "rootParamNames" => root_param_names.into(),
         },
         fxindexmap! {},
     )

crates/next-core/src/next_app/metadata/route.rs

@@ -103,6 +103,7 @@ pub async fn get_app_metadata_route_entry(
         project_root,
         Some(segment_config),
         next_config,
+        Vc::cell(None), // Metadata routes don't have root params
     ))
 }
 

packages/next/src/build/entries.ts

@@ -704,7 +704,10 @@ export async function createEntrypoints(
               page,
               name: serverBundlePath,
               pagePath: absolutePagePath,
-              rootParams: (staticInfo as AppPageStaticInfo).rootParams!,
+              rootParams:
+                (staticInfo as AppPageStaticInfo).rootParams?.map(
+                  (p) => p.param
+                ) || [],
               appDir,
               appPaths: matchedAppPaths,
               pageExtensions,
@@ -783,7 +786,10 @@ export async function createEntrypoints(
                 name: serverBundlePath,
                 page,
                 pagePath: absolutePagePath,
-                rootParams: (staticInfo as AppPageStaticInfo).rootParams!,
+                rootParams:
+                  (staticInfo as AppPageStaticInfo).rootParams?.map(
+                    (p) => p.param
+                  ) || [],
                 appDir: appDir!,
                 appPaths: matchedAppPaths,
                 pageExtensions,

packages/next/src/build/webpack/loaders/next-app-loader/create-app-route-code.ts

@@ -11,7 +11,6 @@ import { AppPathnameNormalizer } from '../../../../server/normalizers/built/app/
 import { loadEntrypoint } from '../../../load-entrypoint'
 import type { PageExtensions } from '../../../page-extensions-type'
 import { getFilenameAndExtension } from '../next-metadata-route-loader'
-import type { ParamInfo } from '../next-root-params-loader'
 
 export async function createAppRouteCode({
   appDir,
@@ -27,7 +26,7 @@ export async function createAppRouteCode({
   name: string
   page: string
   pagePath: string
-  rootParams: ParamInfo[]
+  rootParams: string[]
   resolveAppRoute: (
     pathname: string
   ) => Promise<string | undefined> | string | undefined
@@ -81,7 +80,7 @@ export async function createAppRouteCode({
     },
     {
       nextConfigOutput: JSON.stringify(nextConfigOutput),
-      rootParamNames: JSON.stringify(rootParams.map((p) => p.param)),
+      rootParamNames: JSON.stringify(rootParams),
     }
   )
 }

packages/next/src/build/webpack/loaders/next-app-loader/index.ts

@@ -33,13 +33,12 @@ import type { PageExtensions } from '../../../page-extensions-type'
 import { PARALLEL_ROUTE_DEFAULT_PATH } from '../../../../client/components/builtin/default'
 import type { Compilation } from 'webpack'
 import { createAppRouteCode } from './create-app-route-code'
-import type { ParamInfo } from '../next-root-params-loader'
 
 export type AppLoaderOptions = {
   name: string
   page: string
   pagePath: string
-  rootParams: ParamInfo[]
+  rootParams: string[]
   appDir: string
   appPaths: readonly string[] | null
   preferredRegion: string | string[] | undefined

packages/next/src/server/dev/hot-reloader-webpack.ts

@@ -970,7 +970,10 @@ export default class HotReloaderWebpack implements NextJsHotReloaderInterface {
                           entryData.absolutePagePath
                         ).replace(/\\/g, '/')
                       ),
-                      rootParams: (staticInfo as AppPageStaticInfo).rootParams!,
+                      rootParams:
+                        (staticInfo as AppPageStaticInfo).rootParams?.map(
+                          (p) => p.param
+                        ) || [],
                       appDir: this.appDir!,
                       pageExtensions: this.config.pageExtensions,
                       rootDir: this.dir,
@@ -1094,7 +1097,10 @@ export default class HotReloaderWebpack implements NextJsHotReloaderInterface {
                     page,
                     appPaths: entryData.appPaths,
                     pagePath,
-                    rootParams: (staticInfo as AppPageStaticInfo).rootParams!,
+                    rootParams:
+                      (staticInfo as AppPageStaticInfo).rootParams?.map(
+                        (p) => p.param
+                      ) || [],
                     appDir: this.appDir!,
                     pageExtensions: this.config.pageExtensions,
                     rootDir: this.dir,

packages/next/src/server/request/root-params.ts

@@ -207,12 +207,6 @@ export async function getRootParam(paramName: string): Promise<ParamValue> {
 
   const actionStore = actionAsyncStorage.getStore()
   if (actionStore) {
-    if (actionStore.isAppRoute) {
-      // TODO(root-params): add support for route handlers
-      throw new Error(
-        `Route ${workStore.route} used ${apiName} inside a Route Handler. Support for this API in Route Handlers is planned for a future version of Next.js.`
-      )
-    }
     if (actionStore.isAction) {
       // Actions are not fundamentally tied to a route (even if they're always submitted from some page),
       // so root params would be inconsistent if an action is called from multiple roots.

packages/next/src/server/route-modules/app-route/module.ts

@@ -388,9 +388,7 @@ export class AppRouteRouteModule extends RouteModule<
             (prerenderStore = {
               type: 'prerender',
               phase: 'action',
-              // This replicates prior behavior where rootParams is empty in routes
-              // TODO we need to make this have the proper rootParams for this route
-              rootParams: {},
+              rootParams: requestStore.rootParams,
               implicitTags,
               renderSignal: prospectiveController.signal,
               controller: prospectiveController,
@@ -484,7 +482,7 @@ export class AppRouteRouteModule extends RouteModule<
           const finalRoutePrerenderStore: PrerenderStore = (prerenderStore = {
             type: 'prerender',
             phase: 'action',
-            rootParams: {},
+            rootParams: requestStore.rootParams,
             implicitTags,
             renderSignal: finalController.signal,
             controller: finalController,
@@ -569,7 +567,7 @@ export class AppRouteRouteModule extends RouteModule<
           prerenderStore = {
             type: 'prerender-legacy',
             phase: 'action',
-            rootParams: {},
+            rootParams: requestStore.rootParams,
             implicitTags,
             revalidate: defaultRevalidate,
             expire: INFINITE_CACHE,
@@ -694,10 +692,20 @@ export class AppRouteRouteModule extends RouteModule<
       null
     )
 
+    // Extract root params from context.params based on rootParamNames
+    const rootParams: Record<string, string | string[] | undefined> = {}
+    if (context.params && this.rootParamNames.length > 0) {
+      for (const paramName of this.rootParamNames) {
+        if (paramName in context.params) {
+          rootParams[paramName] = context.params[paramName]
+        }
+      }
+    }
+
     const requestStore = createRequestStoreForAPI(
       req,
       req.nextUrl,
-      {}, // TODO: real rootParams
+      rootParams,
       implicitTags,
       undefined,
       context.prerenderManifest.preview

test/e2e/app-dir/app-root-params-getters/fixtures/simple/app/[lang]/[locale]/route-handler/route.tsx

@@ -1,9 +1,5 @@
 import { lang, locale } from 'next/root-params'
 
 export async function GET() {
-  return Response.json(
-    // TODO(root-params): We're missing some wiring to set `requestStore.rootParams`,
-    // so both of these will currently return undefined
-    { lang: await lang(), locale: await locale() }
-  )
+  return Response.json({ lang: await lang(), locale: await locale() })
 }