extract useBreadcrumbsStructuredData() helper + add schema-dts deps

slorber · slorber · commit 428988d028be · 2025-02-07T18:51:03.000+01:00
diff --git a/packages/docusaurus-plugin-content-blog/package.json b/packages/docusaurus-plugin-content-blog/package.json
@@ -44,6 +44,7 @@
     "fs-extra": "^11.1.1",
     "lodash": "^4.17.21",
     "reading-time": "^1.5.0",
+    "schema-dts": "^1.1.2",
     "srcset": "^4.0.0",
     "tslib": "^2.6.0",
     "unist-util-visit": "^5.0.0",
diff --git a/packages/docusaurus-plugin-content-docs/package.json b/packages/docusaurus-plugin-content-docs/package.json
@@ -49,6 +49,7 @@
     "fs-extra": "^11.1.1",
     "js-yaml": "^4.1.0",
     "lodash": "^4.17.21",
+    "schema-dts": "^1.1.2",
     "tslib": "^2.6.0",
     "utility-types": "^3.10.0",
     "webpack": "^5.88.1"
diff --git a/packages/docusaurus-plugin-content-docs/src/client/index.ts b/packages/docusaurus-plugin-content-docs/src/client/index.ts
@@ -60,6 +60,8 @@ export {
   getDocsVersionSearchTag,
 } from './docsSearch';
 
+export {useBreadcrumbsStructuredData} from './structuredDataUtils';
+
 export type ActivePlugin = {
   pluginId: string;
   pluginData: GlobalPluginData;
diff --git a/packages/docusaurus-plugin-content-docs/src/client/structuredDataUtils.ts b/packages/docusaurus-plugin-content-docs/src/client/structuredDataUtils.ts
@@ -0,0 +1,32 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import type {PropSidebarBreadcrumbsItem} from '@docusaurus/plugin-content-docs';
+import type {WithContext, BreadcrumbList} from 'schema-dts';
+
+export function useBreadcrumbsStructuredData({
+  breadcrumbs,
+}: {
+  breadcrumbs: PropSidebarBreadcrumbsItem[];
+}): WithContext<BreadcrumbList> {
+  const {siteConfig} = useDocusaurusContext();
+  return {
+    '@context': 'https://schema.org',
+    '@type': 'BreadcrumbList',
+    itemListElement: breadcrumbs
+      // We filter breadcrumb items without links, they are not allowed
+      // See also https://github.com/facebook/docusaurus/issues/9319#issuecomment-2643560845
+      .filter((breadcrumb) => breadcrumb.href)
+      .map((breadcrumb, index) => ({
+        '@type': 'ListItem',
+        position: index + 1,
+        name: breadcrumb.label,
+        item: `${siteConfig.url}${breadcrumb.href}`,
+      })),
+  };
+}
diff --git a/packages/docusaurus-theme-classic/src/theme/DocBreadcrumbs/StructuredData/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocBreadcrumbs/StructuredData/index.tsx
@@ -7,23 +7,13 @@
 
 import React, {type ReactNode} from 'react';
 import Head from '@docusaurus/Head';
-import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
+import {useBreadcrumbsStructuredData} from '@docusaurus/plugin-content-docs/client';
 import type {Props} from '@theme/DocBreadcrumbs/StructuredData';
 
 export default function DocBreadcrumbsStructuredData(props: Props): ReactNode {
-  const {siteConfig} = useDocusaurusContext();
-  const structuredData = {
-    '@context': 'https://schema.org',
-    '@type': 'BreadcrumbList',
-    itemListElement: props.breadcrumbs
-      .filter((breadcrumb) => breadcrumb.href)
-      .map((breadcrumb, index) => ({
-        '@type': 'ListItem',
-        position: index + 1,
-        name: breadcrumb.label,
-        item: `${siteConfig.url}${breadcrumb.href}`,
-      })),
-  };
+  const structuredData = useBreadcrumbsStructuredData({
+    breadcrumbs: props.breadcrumbs,
+  });
   return (
     <Head>
       <script type="application/ld+json">
diff --git a/packages/docusaurus-theme-classic/src/theme/DocBreadcrumbs/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocBreadcrumbs/index.tsx
@@ -68,6 +68,7 @@ export default function DocBreadcrumbs(): ReactNode {
 
   return (
     <>
+      <DocBreadcrumbsStructuredData breadcrumbs={breadcrumbs} />
       <nav
         className={clsx(
           ThemeClassNames.docs.docBreadcrumbs,
@@ -96,7 +97,6 @@ export default function DocBreadcrumbs(): ReactNode {
           })}
         </ul>
       </nav>
-      <DocBreadcrumbsStructuredData breadcrumbs={breadcrumbs} />
     </>
   );
 }
diff --git a/packages/docusaurus-theme-common/package.json b/packages/docusaurus-theme-common/package.json
@@ -47,8 +47,7 @@
     "@docusaurus/core": "3.7.0",
     "@docusaurus/types": "3.7.0",
     "fs-extra": "^11.1.1",
-    "lodash": "^4.17.21",
-    "schema-dts": "^1.1.2"
+    "lodash": "^4.17.21"
   },
   "peerDependencies": {
     "@docusaurus/plugin-content-docs": "*",
