feat(breadcrumbs): add option to hide current page (jackyzha0#601)

* feat(breadcrumbs): add option to hide current page * Remove debug lines Co-authored-by: Jacky Zhao <[email protected]> --------- Co-authored-by: ruant <[email protected]> Co-authored-by: Jacky Zhao <[email protected]>
plastic-labs · Nov 20, 2023 · 9a599ae · 9a599ae
1 parent 296c1cf
commit 9a599ae
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/docs/features/breadcrumbs.md b/docs/features/breadcrumbs.md
@@ -20,6 +20,7 @@ Component.Breadcrumbs({
   rootName: "Home", // name of first/root element
   resolveFrontmatterTitle: true, // whether to resolve folder names through frontmatter titles
   hideOnRoot: true, // whether to hide breadcrumbs on root `index.md` page
+  showCurrentPage: true, // wether to display the current page in the breadcrumbs
 })
 ```
 

diff --git a/quartz/components/Breadcrumbs.tsx b/quartz/components/Breadcrumbs.tsx
@@ -25,13 +25,18 @@ interface BreadcrumbOptions {
    * Wether to display breadcrumbs on root `index.md`
    */
   hideOnRoot: boolean
+  /**
+   * Wether to display the current page in the breadcrumbs.
+   */
+  showCurrentPage: boolean
 }
 
 const defaultOptions: BreadcrumbOptions = {
   spacerSymbol: "❯",
   rootName: "Home",
   resolveFrontmatterTitle: true,
   hideOnRoot: true,
+  showCurrentPage: true,
 }
 
 function formatCrumb(displayName: string, baseSlug: FullSlug, currentSlug: SimpleSlug): CrumbData {
@@ -95,10 +100,12 @@ export default ((opts?: Partial<BreadcrumbOptions>) => {
       }
 
       // Add current file to crumb (can directly use frontmatter title)
-      crumbs.push({
-        displayName: fileData.frontmatter!.title,
-        path: "",
-      })
+      if (options.showCurrentPage) {
+        crumbs.push({
+          displayName: fileData.frontmatter!.title,
+          path: "",
+        })
+      }
     }
     return (
       <nav class={`breadcrumb-container ${displayClass ?? ""}`} aria-label="breadcrumbs">