Rename enhanceAgnosticRoutes -> mapRouteProperties

Author: brophdawg11

packages/react-router-dom/__tests__/exports-test.tsx

@@ -1,7 +1,7 @@
 import * as ReactRouter from "react-router";
 import * as ReactRouterDOM from "react-router-dom";
 
-let nonReExportedKeys = new Set(["UNSAFE_enhanceAgnosticRoute"]);
+let nonReExportedKeys = new Set(["UNSAFE_mapRouteProperties"]);
 
 describe("react-router-dom", () => {
   for (let key in ReactRouter) {

packages/react-router-dom/index.tsx

@@ -23,7 +23,7 @@ import {
   UNSAFE_DataRouterStateContext as DataRouterStateContext,
   UNSAFE_NavigationContext as NavigationContext,
   UNSAFE_RouteContext as RouteContext,
-  UNSAFE_enhanceAgnosticRoute as enhanceAgnosticRoute,
+  UNSAFE_mapRouteProperties as mapRouteProperties,
 } from "react-router";
 import type {
   BrowserHistory,
@@ -220,7 +220,7 @@ export function createBrowserRouter(
     history: createBrowserHistory({ window: opts?.window }),
     hydrationData: opts?.hydrationData || parseHydrationData(),
     routes,
-    enhanceAgnosticRoute,
+    mapRouteProperties,
   }).initialize();
 }
 
@@ -234,7 +234,7 @@ export function createHashRouter(
     history: createHashHistory({ window: opts?.window }),
     hydrationData: opts?.hydrationData || parseHydrationData(),
     routes,
-    enhanceAgnosticRoute,
+    mapRouteProperties,
   }).initialize();
 }
 

packages/react-router-dom/server.tsx

@@ -17,7 +17,7 @@ import {
   createStaticHandler as routerCreateStaticHandler,
   UNSAFE_convertRoutesToDataRoutes as convertRoutesToDataRoutes,
 } from "@remix-run/router";
-import { UNSAFE_enhanceAgnosticRoute as enhanceAgnosticRoute } from "react-router";
+import { UNSAFE_mapRouteProperties as mapRouteProperties } from "react-router";
 import type { Location, RouteObject, To } from "react-router-dom";
 import { Routes } from "react-router-dom";
 import {
@@ -209,7 +209,7 @@ function getStatelessNavigator() {
 
 type CreateStaticHandlerOptions = Omit<
   RouterCreateStaticHandlerOptions,
-  "detectErrorBoundary" | "enhanceAgnosticRoute"
+  "detectErrorBoundary" | "mapRouteProperties"
 >;
 
 export function createStaticHandler(
@@ -218,7 +218,7 @@ export function createStaticHandler(
 ) {
   return routerCreateStaticHandler(routes, {
     ...opts,
-    enhanceAgnosticRoute,
+    mapRouteProperties,
   });
 }
 
@@ -229,7 +229,7 @@ export function createStaticRouter(
   let manifest: RouteManifest = {};
   let dataRoutes = convertRoutesToDataRoutes(
     routes,
-    enhanceAgnosticRoute,
+    mapRouteProperties,
     undefined,
     manifest
   );

packages/react-router-native/__tests__/exports-test.tsx

@@ -1,7 +1,7 @@
 import * as ReactRouter from "react-router";
 import * as ReactRouterNative from "react-router-native";
 
-let nonReExportedKeys = new Set(["UNSAFE_enhanceAgnosticRoute"]);
+let nonReExportedKeys = new Set(["UNSAFE_mapRouteProperties"]);
 
 describe("react-router-native", () => {
   for (let key in ReactRouter) {

packages/react-router/index.ts

@@ -208,7 +208,7 @@ export {
   useRoutes,
 };
 
-function enhanceAgnosticRoute(route: RouteObject) {
+function mapRouteProperties(route: RouteObject) {
   let updates: Partial<RouteObject> & { hasErrorBoundary: boolean } = {
     // Note: this check also occurs in createRoutesFromChildren so update
     // there if you change this -- please and thank you!
@@ -269,7 +269,7 @@ export function createMemoryRouter(
     }),
     hydrationData: opts?.hydrationData,
     routes,
-    enhanceAgnosticRoute,
+    mapRouteProperties,
   }).initialize();
 }
 
@@ -293,5 +293,5 @@ export {
   RouteContext as UNSAFE_RouteContext,
   DataRouterContext as UNSAFE_DataRouterContext,
   DataRouterStateContext as UNSAFE_DataRouterStateContext,
-  enhanceAgnosticRoute as UNSAFE_enhanceAgnosticRoute,
+  mapRouteProperties as UNSAFE_mapRouteProperties,
 };

packages/router/README.md

@@ -2,7 +2,7 @@
 
 The `@remix-run/router` package is a framework-agnostic routing package (sometimes referred to as a browser-emulator) that serves as the heart of [React Router][react-router] and [Remix][remix] and provides all the core functionality for routing coupled with data loading and data mutations. It comes with built-in handling of errors, race-conditions, interruptions, cancellations, lazy-loading data, and much, much more.
 
-If you're using React Router, you should never `import` anything directly from the `@remix-run/router` or `react-router` packages, but you should have everything you need in either `react-router-dom` or `react-router-native`. Both of those packages re-export everything from `@remix-run/router` and `react-router`.
+If you're using React Router, you should never `import` anything directly from the `@remix-run/router` - you should have everything you need in `react-router-dom` (or `react-router`/`react-router-native` if you're not rendering in the browser). All of those packages should re-export everything you would otherwise need from `@remix-run/router`.
 
 > **Warning**
 >
@@ -16,11 +16,16 @@ A Router instance can be created using `createRouter`:
 // Create and initialize a router.  "initialize" contains all side effects
 // including history listeners and kicking off the initial data fetch
 let router = createRouter({
-  // Routes array
-  routes: ,
-  // History instance
-  history,
-}).initialize()
+  // Required properties
+  routes, // Routes array
+  history, // History instance
+
+  // Optional properties
+  basename, // Base path
+  mapRouteProperties, // Map function framework-agnostic routes to framework-aware routes
+  future, // Future flags
+  hydrationData, // Hydration data if using server-side-rendering
+}).initialize();
 ```
 
 Internally, the Router represents the state in an object of the following format, which is available through `router.state`. You can also register a subscriber of the signature `(state: RouterState) => void` to execute when the state updates via `router.subscribe()`;

packages/router/router.ts

@@ -32,7 +32,7 @@ import type {
   V7_FormMethod,
   HTMLFormMethod,
   MutationFormMethod,
-  EnhanceAgnosticRouteFunction,
+  MapRoutePropertiesFunction,
 } from "./utils";
 import {
   ErrorResponse,
@@ -345,10 +345,10 @@ export interface RouterInit {
   history: History;
   basename?: string;
   /**
-   * @deprecated Use `enhanceAgnosticRoute` instead
+   * @deprecated Use `mapRouteProperties` instead
    */
   detectErrorBoundary?: DetectErrorBoundaryFunction;
-  enhanceAgnosticRoute?: EnhanceAgnosticRouteFunction;
+  mapRouteProperties?: MapRoutePropertiesFunction;
   future?: FutureConfig;
   hydrationData?: HydrationState;
 }
@@ -663,7 +663,7 @@ const isBrowser =
   typeof window.document.createElement !== "undefined";
 const isServer = !isBrowser;
 
-const defaultEnhanceAgnosticRoute: EnhanceAgnosticRouteFunction = (route) => ({
+const defaultMapRouteProperties: MapRoutePropertiesFunction = (route) => ({
   hasErrorBoundary: Boolean(route.hasErrorBoundary),
 });
 
@@ -682,24 +682,25 @@ export function createRouter(init: RouterInit): Router {
     "You must provide a non-empty routes array to createRouter"
   );
 
-  let enhanceAgnosticRoute: EnhanceAgnosticRouteFunction;
-  if (init.enhanceAgnosticRoute) {
-    enhanceAgnosticRoute = init.enhanceAgnosticRoute;
+  let mapRouteProperties: MapRoutePropertiesFunction;
+  if (init.mapRouteProperties) {
+    mapRouteProperties = init.mapRouteProperties;
   } else if (init.detectErrorBoundary) {
+    // If they are still using the deprecated version, wrap it with the new API
     let detectErrorBoundary = init.detectErrorBoundary;
-    enhanceAgnosticRoute = (route) => ({
+    mapRouteProperties = (route) => ({
       hasErrorBoundary: detectErrorBoundary(route),
     });
   } else {
-    enhanceAgnosticRoute = defaultEnhanceAgnosticRoute;
+    mapRouteProperties = defaultMapRouteProperties;
   }
 
   // Routes keyed by ID
   let manifest: RouteManifest = {};
   // Routes in tree format for matching
   let dataRoutes = convertRoutesToDataRoutes(
     init.routes,
-    enhanceAgnosticRoute,
+    mapRouteProperties,
     undefined,
     manifest
   );
@@ -1343,7 +1344,7 @@ export function createRouter(init: RouterInit): Router {
         actionMatch,
         matches,
         manifest,
-        enhanceAgnosticRoute,
+        mapRouteProperties,
         router.basename
       );
 
@@ -1701,7 +1702,7 @@ export function createRouter(init: RouterInit): Router {
       match,
       requestMatches,
       manifest,
-      enhanceAgnosticRoute,
+      mapRouteProperties,
       router.basename
     );
 
@@ -1944,7 +1945,7 @@ export function createRouter(init: RouterInit): Router {
       match,
       matches,
       manifest,
-      enhanceAgnosticRoute,
+      mapRouteProperties,
       router.basename
     );
 
@@ -2162,7 +2163,7 @@ export function createRouter(init: RouterInit): Router {
           match,
           matches,
           manifest,
-          enhanceAgnosticRoute,
+          mapRouteProperties,
           router.basename
         )
       ),
@@ -2174,7 +2175,7 @@ export function createRouter(init: RouterInit): Router {
             f.match,
             f.matches,
             manifest,
-            enhanceAgnosticRoute,
+            mapRouteProperties,
             router.basename
           );
         } else {
@@ -2494,10 +2495,10 @@ export const UNSAFE_DEFERRED_SYMBOL = Symbol("deferred");
 export interface CreateStaticHandlerOptions {
   basename?: string;
   /**
-   * @deprecated Use `enhanceAgnosticRoute` instead
+   * @deprecated Use `mapRouteProperties` instead
    */
   detectErrorBoundary?: DetectErrorBoundaryFunction;
-  enhanceAgnosticRoute?: EnhanceAgnosticRouteFunction;
+  mapRouteProperties?: MapRoutePropertiesFunction;
 }
 
 export function createStaticHandler(
@@ -2511,21 +2512,22 @@ export function createStaticHandler(
 
   let manifest: RouteManifest = {};
   let basename = (opts ? opts.basename : null) || "/";
-  let enhanceAgnosticRoute: EnhanceAgnosticRouteFunction;
-  if (opts?.enhanceAgnosticRoute) {
-    enhanceAgnosticRoute = opts.enhanceAgnosticRoute;
+  let mapRouteProperties: MapRoutePropertiesFunction;
+  if (opts?.mapRouteProperties) {
+    mapRouteProperties = opts.mapRouteProperties;
   } else if (opts?.detectErrorBoundary) {
+    // If they are still using the deprecated version, wrap it with the new API
     let detectErrorBoundary = opts.detectErrorBoundary;
-    enhanceAgnosticRoute = (route) => ({
+    mapRouteProperties = (route) => ({
       hasErrorBoundary: detectErrorBoundary(route),
     });
   } else {
-    enhanceAgnosticRoute = defaultEnhanceAgnosticRoute;
+    mapRouteProperties = defaultMapRouteProperties;
   }
 
   let dataRoutes = convertRoutesToDataRoutes(
     routes,
-    enhanceAgnosticRoute,
+    mapRouteProperties,
     undefined,
     manifest
   );
@@ -2782,7 +2784,7 @@ export function createStaticHandler(
         actionMatch,
         matches,
         manifest,
-        enhanceAgnosticRoute,
+        mapRouteProperties,
         basename,
         true,
         isRouteRequest,
@@ -2950,7 +2952,7 @@ export function createStaticHandler(
           match,
           matches,
           manifest,
-          enhanceAgnosticRoute,
+          mapRouteProperties,
           basename,
           true,
           isRouteRequest,
@@ -3302,7 +3304,7 @@ function shouldRevalidateLoader(
  */
 async function loadLazyRouteModule(
   route: AgnosticDataRouteObject,
-  enhanceAgnosticRoute: EnhanceAgnosticRouteFunction,
+  mapRouteProperties: MapRoutePropertiesFunction,
   manifest: RouteManifest
 ) {
   if (!route.lazy) {
@@ -3357,18 +3359,18 @@ async function loadLazyRouteModule(
   }
 
   // Mutate the route with the provided updates.  Do this first so we pass
-  // the updated version to enhanceAgnosticRoute
+  // the updated version to mapRouteProperties
   Object.assign(routeToUpdate, routeUpdates);
 
   // Mutate the `hasErrorBoundary` property on the route based on the route
   // updates and remove the `lazy` function so we don't resolve the lazy
   // route again.
   Object.assign(routeToUpdate, {
     // To keep things framework agnostic, we use the provided
-    // `enhanceAgnosticRoute` (or wrapped `detectErrorBoundary`) function to
+    // `mapRouteProperties` (or wrapped `detectErrorBoundary`) function to
     // set the framework-aware properties (`element`/`hasErrorBoundary`) since
     // the logic will differ between frameworks.
-    ...enhanceAgnosticRoute(routeToUpdate),
+    ...mapRouteProperties(routeToUpdate),
     lazy: undefined,
   });
 }
@@ -3379,7 +3381,7 @@ async function callLoaderOrAction(
   match: AgnosticDataRouteMatch,
   matches: AgnosticDataRouteMatch[],
   manifest: RouteManifest,
-  enhanceAgnosticRoute: EnhanceAgnosticRouteFunction,
+  mapRouteProperties: MapRoutePropertiesFunction,
   basename = "/",
   isStaticRequest: boolean = false,
   isRouteRequest: boolean = false,
@@ -3409,12 +3411,12 @@ async function callLoaderOrAction(
         // Run statically defined handler in parallel with lazy()
         let values = await Promise.all([
           runHandler(handler),
-          loadLazyRouteModule(match.route, enhanceAgnosticRoute, manifest),
+          loadLazyRouteModule(match.route, mapRouteProperties, manifest),
         ]);
         result = values[0];
       } else {
         // Load lazy route module, then run any returned handler
-        await loadLazyRouteModule(match.route, enhanceAgnosticRoute, manifest);
+        await loadLazyRouteModule(match.route, mapRouteProperties, manifest);
 
         handler = match.route[type];
         if (handler) {