"use client";
/**
* Breadcrumbs — FASE-07 UX
*
* Dashboard breadcrumb navigation component. Automatically generates
* breadcrumbs from the current path with friendly labels.
* Uses usePathname() internally — no props needed.
*
* Usage:
*
*/
import { usePathname } from "next/navigation";
import Link from "next/link";
const PATH_LABELS = {
dashboard: "Dashboard",
providers: "Providers",
combos: "Combos",
settings: "Settings",
logs: "Logs",
"audit-log": "Audit Log",
console: "Console",
logger: "Logger",
translator: "Translator",
playground: "Playground",
add: "Add",
edit: "Edit",
keys: "API Keys",
models: "Models",
};
/**
* Get a friendly label for a path segment.
* @param {string} segment
* @returns {string}
*/
function getLabel(segment) {
return PATH_LABELS[segment] || segment.charAt(0).toUpperCase() + segment.slice(1);
}
export default function Breadcrumbs() {
const pathname = usePathname();
if (!pathname || pathname === "/dashboard") return null;
const segments = pathname.split("/").filter(Boolean);
const crumbs = segments.map((seg, idx) => ({
label: getLabel(seg),
href: "/" + segments.slice(0, idx + 1).join("/"),
isLast: idx === segments.length - 1,
}));
return (
);
}