64 lines
2.4 KiB
JavaScript
64 lines
2.4 KiB
JavaScript
import Link from "next/link";
|
|
import { safeJsonLd } from "@/lib/sanitize";
|
|
import { buildBreadcrumbJsonLd, normalizeBreadcrumb } from "@/lib/breadcrumb";
|
|
|
|
// Breadcrumb واحد سایت: ظاهر دقیقاً همان نسخهٔ قبلی (همان کلاسها، همان جداکنندهٔ «>»)
|
|
// ولی ساختار سمانتیک درست (nav/ol/a) و BreadcrumbList از همان یک منبع داده تولید میشود
|
|
// تا نسخهٔ بصری و schema هرگز واگرا نشوند.
|
|
//
|
|
// list: Array<string | { name, href }> — به آیتم آخر (صفحهٔ جاری) هم href بده؛
|
|
// ظاهرش عوض نمیشود (هرگز لینک نمیشود) ولی schema بدون `item` نامعتبر است.
|
|
// `origin` هم لازم است، چون گوگل URL مطلق میخواهد؛ بدون آن JSON-LD منتشر نمیشود.
|
|
|
|
const ITEM_CLASS = "text-[16px] font-normal";
|
|
|
|
function Pageguide({ list = [], origin }) {
|
|
const items = normalizeBreadcrumb(list);
|
|
if (items.length === 0) return null;
|
|
|
|
const jsonLd = buildBreadcrumbJsonLd(items, origin);
|
|
|
|
return (
|
|
<>
|
|
{jsonLd && (
|
|
<script
|
|
type="application/ld+json"
|
|
dangerouslySetInnerHTML={{ __html: safeJsonLd(jsonLd) }}
|
|
/>
|
|
)}
|
|
<nav aria-label="breadcrumb">
|
|
<ol className="flex items-center justify-start gap-1">
|
|
{items.map((item, idx) => {
|
|
const isLast = idx === items.length - 1;
|
|
const colorClass = isLast ? "text-[#525252]" : "text-[#9B9B9B]";
|
|
return (
|
|
<li key={idx} className="flex items-center justify-start gap-1">
|
|
{item.href && !isLast ? (
|
|
<Link href={item.href} className={`${ITEM_CLASS} ${colorClass}`}>
|
|
{item.name}
|
|
</Link>
|
|
) : (
|
|
<span
|
|
className={`${ITEM_CLASS} ${colorClass}`}
|
|
{...(isLast && { "aria-current": "page" })}
|
|
>
|
|
{item.name}
|
|
</span>
|
|
)}
|
|
<span
|
|
className={`text-[#9B9B9B] ${ITEM_CLASS} ${isLast ? "hidden" : "flex"}`}
|
|
aria-hidden="true"
|
|
>
|
|
{">"}
|
|
</span>
|
|
</li>
|
|
);
|
|
})}
|
|
</ol>
|
|
</nav>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default Pageguide;
|