Try reducing duplication and bundle size

Author: onurtemizkan

packages/react/src/reactrouter-compat-utils/instrumentation.tsx

@@ -192,6 +192,12 @@ export interface ReactRouterOptions {
 
 type V6CompatibleVersion = '6' | '7';
 
+type RouterWrapperOptions = Record<string, unknown> & {
+  basename?: string;
+  initialEntries?: (string | { pathname: string })[];
+  initialIndex?: number;
+};
+
 export function addResolvedRoutesToParent(resolvedRoutes: RouteObject[], parentRoute: RouteObject): void {
   const existingChildren = parentRoute.children || [];
 
@@ -408,26 +414,21 @@ function setupRouterSubscription(
   });
 }
 
-/**
- * Creates a wrapCreateBrowserRouter function that can be used with all React Router v6 compatible versions.
- */
-export function createV6CompatibleWrapCreateBrowserRouter<
-  TState extends RouterState = RouterState,
-  TRouter extends Router<TState> = Router<TState>,
->(
+function createRouterWrapper<TState extends RouterState = RouterState, TRouter extends Router<TState> = Router<TState>>(
   createRouterFunction: CreateRouterFunction<TState, TRouter>,
   version: V6CompatibleVersion,
+  isMemoryRouter: boolean,
 ): CreateRouterFunction<TState, TRouter> {
   if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes) {
     DEBUG_BUILD &&
       debug.warn(
-        `reactRouterV${version}Instrumentation was unable to wrap the \`createRouter\` function because of one or more missing parameters.`,
+        `reactRouterV${version}Instrumentation was unable to wrap the \`${isMemoryRouter ? 'createMemoryRouter' : 'createRouter'}\` function because of one or more missing parameters.`,
       );
 
     return createRouterFunction;
   }
 
-  return function (routes: RouteObject[], opts?: Record<string, unknown> & { basename?: string }): TRouter {
+  return function (routes: RouteObject[], opts?: RouterWrapperOptions): TRouter {
     addRoutesToAllRoutes(routes);
 
     if (_enableAsyncRouteHandlers) {
@@ -436,15 +437,19 @@ export function createV6CompatibleWrapCreateBrowserRouter<
       }
     }
 
-    const wrappedOpts = wrapPatchRoutesOnNavigation(opts);
+    const wrappedOpts = wrapPatchRoutesOnNavigation(opts, isMemoryRouter);
     const router = createRouterFunction(routes, wrappedOpts);
     const basename = opts?.basename;
     const activeRootSpan = getActiveRootSpan();
 
+    const initialLocation = isMemoryRouter
+      ? getInitialLocationFromEntries(opts, router.state.location)
+      : router.state.location;
+
     if (router.state.historyAction === 'POP' && activeRootSpan) {
       updatePageloadTransaction({
         activeRootSpan,
-        location: router.state.location,
+        location: initialLocation,
         routes,
         basename,
         allRoutes: Array.from(allRoutes),
@@ -457,6 +462,44 @@ export function createV6CompatibleWrapCreateBrowserRouter<
   };
 }
 
+function getInitialLocationFromEntries(opts: RouterWrapperOptions | undefined, fallbackLocation: Location): Location {
+  const initialEntries = opts?.initialEntries;
+  const initialIndex = opts?.initialIndex;
+
+  if (initialEntries?.length === 1) {
+    const firstEntry = initialEntries[0];
+    if (firstEntry) {
+      return normalizeInitialEntry(firstEntry);
+    }
+  }
+
+  if (typeof initialIndex === 'number' && initialEntries && initialEntries[initialIndex]) {
+    const indexedEntry = initialEntries[initialIndex];
+    if (indexedEntry) {
+      return normalizeInitialEntry(indexedEntry);
+    }
+  }
+
+  return fallbackLocation;
+}
+
+function normalizeInitialEntry(entry: string | { pathname: string }): Location {
+  return typeof entry === 'string' ? { pathname: entry } : entry;
+}
+
+/**
+ * Creates a wrapCreateBrowserRouter function that can be used with all React Router v6 compatible versions.
+ */
+export function createV6CompatibleWrapCreateBrowserRouter<
+  TState extends RouterState = RouterState,
+  TRouter extends Router<TState> = Router<TState>,
+>(
+  createRouterFunction: CreateRouterFunction<TState, TRouter>,
+  version: V6CompatibleVersion,
+): CreateRouterFunction<TState, TRouter> {
+  return createRouterWrapper(createRouterFunction, version, false);
+}
+
 /**
  * Creates a wrapCreateMemoryRouter function that can be used with all React Router v6 compatible versions.
  */
@@ -467,72 +510,7 @@ export function createV6CompatibleWrapCreateMemoryRouter<
   createRouterFunction: CreateRouterFunction<TState, TRouter>,
   version: V6CompatibleVersion,
 ): CreateRouterFunction<TState, TRouter> {
-  if (!_useEffect || !_useLocation || !_useNavigationType || !_matchRoutes) {
-    DEBUG_BUILD &&
-      debug.warn(
-        `reactRouterV${version}Instrumentation was unable to wrap the \`createMemoryRouter\` function because of one or more missing parameters.`,
-      );
-
-    return createRouterFunction;
-  }
-
-  return function (
-    routes: RouteObject[],
-    opts?: Record<string, unknown> & {
-      basename?: string;
-      initialEntries?: (string | { pathname: string })[];
-      initialIndex?: number;
-    },
-  ): TRouter {
-    addRoutesToAllRoutes(routes);
-
-    if (_enableAsyncRouteHandlers) {
-      for (const route of routes) {
-        checkRouteForAsyncHandler(route, processResolvedRoutes);
-      }
-    }
-
-    const wrappedOpts = wrapPatchRoutesOnNavigation(opts, true);
-
-    const router = createRouterFunction(routes, wrappedOpts);
-    const basename = opts?.basename;
-
-    let initialEntry = undefined;
-
-    const initialEntries = opts?.initialEntries;
-    const initialIndex = opts?.initialIndex;
-
-    const hasOnlyOneInitialEntry = initialEntries && initialEntries.length === 1;
-    const hasIndexedEntry = initialIndex !== undefined && initialEntries && initialEntries[initialIndex];
-
-    initialEntry = hasOnlyOneInitialEntry
-      ? initialEntries[0]
-      : hasIndexedEntry
-        ? initialEntries[initialIndex]
-        : undefined;
-
-    const location = initialEntry
-      ? typeof initialEntry === 'string'
-        ? { pathname: initialEntry }
-        : initialEntry
-      : router.state.location;
-
-    const memoryActiveRootSpan = getActiveRootSpan();
-
-    if (router.state.historyAction === 'POP' && memoryActiveRootSpan) {
-      updatePageloadTransaction({
-        activeRootSpan: memoryActiveRootSpan,
-        location,
-        routes,
-        basename,
-        allRoutes: Array.from(allRoutes),
-      });
-    }
-
-    setupRouterSubscription(router, routes, version, basename, memoryActiveRootSpan);
-
-    return router;
-  };
+  return createRouterWrapper(createRouterFunction, version, true);
 }
 
 /**