fix(core): Fix breadcrumb links on PDP (#728)

bigcommerce · Apr 3, 2024 · fa83629 · fa83629
1 parent 19c22ca
commit fa83629
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 3 deletions.
diff --git a/.changeset/sweet-frogs-compete.md b/.changeset/sweet-frogs-compete.md
@@ -0,0 +1,5 @@
+---
+"@bigcommerce/catalyst-core": patch
+---
+
+Fix breadcrumbs on PDP to have correct links
diff --git a/apps/core/app/[locale]/(default)/product/[slug]/_components/breadcrumbs.tsx b/apps/core/app/[locale]/(default)/product/[slug]/_components/breadcrumbs.tsx
@@ -17,7 +17,7 @@ export const BreadCrumbs = async ({ productId }: Props) => {
  return (
  <nav>
  <ul className="m-0 flex flex-wrap items-center p-0 md:container md:mx-auto ">
- {category.breadcrumbs.map((breadcrumb, i, arr) => {
+ {category.breadcrumbs.map(({ name, path }, i, arr) => {
  const isLast = arr.length - 1 === i;
 
  return (
@@ -26,9 +26,9 @@ export const BreadCrumbs = async ({ productId }: Props) => {
  'font-semibold': !isLast,
  'font-extrabold': isLast,
  })}
- key={breadcrumb.name}
+ key={name}
  >
- <Link href="#">{breadcrumb.name}</Link>
+ <Link href={path ?? '#'}>{name}</Link>
  {!isLast && <span className="mx-2">/</span>}
  </li>
  );

diff --git a/apps/core/client/queries/get-product.ts b/apps/core/client/queries/get-product.ts
@@ -175,6 +175,7 @@ const PRODUCT_FRAGMENT = graphql(
  edges {
  node {
  name
+ path
  }
  }
  }