fix(theme-common): docs breadcrumbs not working with baseUrl (#6816)

packages/docusaurus-theme-common/src/utils/__tests__/routesUtils.test.ts

@@ -15,59 +15,94 @@ describe('routesUtils findHomePageRoute', () => {
   };
 
   test('should return undefined for no routes', () => {
-    expect(findHomePageRoute([])).toEqual(undefined);
+    expect(findHomePageRoute({baseUrl: '/', routes: []})).toEqual(undefined);
   });
 
   test('should return undefined for no homepage', () => {
     expect(
-      findHomePageRoute([
-        {path: '/a', exact: true},
-        {path: '/b', exact: false},
-        {path: '/c', exact: undefined},
-        {
-          path: '/d',
-          exact: false,
-          routes: [
-            {path: '/d/1', exact: true},
-            {path: '/d/2', exact: false},
-            {path: '/d/3', exact: undefined},
-          ],
-        },
-      ]),
+      findHomePageRoute({
+        baseUrl: '/',
+        routes: [
+          {path: '/a', exact: true},
+          {path: '/b', exact: false},
+          {path: '/c', exact: undefined},
+          {
+            path: '/d',
+            exact: false,
+            routes: [
+              {path: '/d/1', exact: true},
+              {path: '/d/2', exact: false},
+              {path: '/d/3', exact: undefined},
+            ],
+          },
+        ],
+      }),
     ).toEqual(undefined);
   });
 
   test('should find top-level homepage', () => {
     expect(
-      findHomePageRoute([
-        {path: '/a', exact: true},
-        {path: '/b', exact: false},
-        {path: '/c', exact: undefined},
-        {...homePage, exact: false},
-        homePage,
-        {...homePage, exact: undefined},
-      ]),
+      findHomePageRoute({
+        baseUrl: '/',
+        routes: [
+          {path: '/a', exact: true},
+          {path: '/b', exact: false},
+          {path: '/c', exact: undefined},
+          {...homePage, exact: false},
+          homePage,
+          {...homePage, exact: undefined},
+        ],
+      }),
     ).toEqual(homePage);
   });
 
   test('should find nested homepage', () => {
     expect(
-      findHomePageRoute([
-        {path: '/a', exact: true},
-        {
-          path: '/',
-          exact: false,
-          routes: [
-            {path: '/b', exact: true},
-            {
-              path: '/',
-              exact: false,
-              routes: [{path: '/c', exact: true}, homePage],
-            },
-          ],
-        },
-        {path: '/d', exact: true},
-      ]),
+      findHomePageRoute({
+        baseUrl: '/',
+        routes: [
+          {path: '/a', exact: true},
+          {
+            path: '/',
+            exact: false,
+            routes: [
+              {path: '/b', exact: true},
+              {
+                path: '/',
+                exact: false,
+                routes: [{path: '/c', exact: true}, homePage],
+              },
+            ],
+          },
+          {path: '/d', exact: true},
+        ],
+      }),
     ).toEqual(homePage);
   });
+
+  test('should find nested homepage with baseUrl', () => {
+    const baseUrl = '/baseUrl/';
+    const baseUrlHomePage = {...homePage, path: baseUrl};
+    expect(
+      findHomePageRoute({
+        baseUrl,
+        routes: [
+          {path: `${baseUrl}a`, exact: true},
+          {
+            path: baseUrl,
+            exact: false,
+            routes: [
+              {path: `${baseUrl}b`, exact: true},
+              {
+                path: baseUrl,
+                exact: false,
+                routes: [{path: `${baseUrl}c`, exact: true}, baseUrlHomePage],
+              },
+            ],
+          },
+          {path: `${baseUrl}d`, exact: true},
+        ],
+      }),
+    ).toEqual(baseUrlHomePage);
+  });
 });

packages/docusaurus-theme-common/src/utils/routesUtils.ts

@@ -7,33 +7,50 @@
 
 import GeneratedRoutes, {type Route} from '@generated/routes';
 import {useMemo} from 'react';
-
-function isHomePageRoute(route: Route): boolean {
-  return route.path === '/' && route.exact === true;
-}
-
-function isHomeParentRoute(route: Route): boolean {
-  return route.path === '/' && route.exact === false;
-}
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
 
 // Note that all sites don't always have a homepage in practice
 // See https://github.com/facebook/docusaurus/pull/6517#issuecomment-1048709116
-export function findHomePageRoute(
-  routes: Route[] = GeneratedRoutes,
-): Route | undefined {
-  if (routes.length === 0) {
-    return undefined;
+export function findHomePageRoute({
+  baseUrl,
+  routes: initialRoutes,
+}: {
+  routes: Route[];
+  baseUrl: string;
+}): Route | undefined {
+  function isHomePageRoute(route: Route): boolean {
+    return route.path === baseUrl && route.exact === true;
   }
-  const homePage = routes.find(isHomePageRoute);
-  if (homePage) {
-    return homePage;
+
+  function isHomeParentRoute(route: Route): boolean {
+    return route.path === baseUrl && route.exact === false;
   }
-  const indexSubRoutes = routes
-    .filter(isHomeParentRoute)
-    .flatMap((route) => route.routes ?? []);
-  return findHomePageRoute(indexSubRoutes);
+
+  function doFindHomePageRoute(routes: Route[]): Route | undefined {
+    if (routes.length === 0) {
+      return undefined;
+    }
+    const homePage = routes.find(isHomePageRoute);
+    if (homePage) {
+      return homePage;
+    }
+    const indexSubRoutes = routes
+      .filter(isHomeParentRoute)
+      .flatMap((route) => route.routes ?? []);
+    return doFindHomePageRoute(indexSubRoutes);
+  }
+
+  return doFindHomePageRoute(initialRoutes);
 }
 
 export function useHomePageRoute(): Route | undefined {
-  return useMemo(() => findHomePageRoute(), []);
+  const {baseUrl} = useDocusaurusContext().siteConfig;
+  return useMemo(
+    () =>
+      findHomePageRoute({
+        routes: GeneratedRoutes,
+        baseUrl,
+      }),
+    [baseUrl],
+  );
 }