60 lines
2.2 KiB
TypeScript
60 lines
2.2 KiB
TypeScript
import Breadcrumbs from "@moduletrace/twui/elements/Breadcrumbs";
|
|
import Stack from "@moduletrace/twui/layout/Stack";
|
|
import { ChevronRight } from "lucide-react";
|
|
import { AdminHomePath } from "@/src/dict/admin-sections-dict";
|
|
import hasBreadcrumbTrail from "@/src/utils/has-breadcrumb-trail";
|
|
import Divider from "@moduletrace/twui/layout/Divider";
|
|
import { twMerge } from "tailwind-merge";
|
|
|
|
type Props = {
|
|
/**
|
|
* The address the page is at, e.g. `/admin/settings/bots/3`.
|
|
*/
|
|
pathname?: string | null;
|
|
/**
|
|
* The page's own name, for the last crumb: what the address can't say,
|
|
* since its last segment is an id (`Scout`, not `3`) or a slug that
|
|
* differs from the name the page shows (`MCPs`, not `Mcps`).
|
|
*/
|
|
title?: string;
|
|
};
|
|
|
|
/**
|
|
* The trail above a page's content: `Home`, then every section the address
|
|
* passes through, then the page itself, named by `title`.
|
|
*
|
|
* It is `twui`'s `Breadcrumbs`, which reads the trail off the path, so the
|
|
* sections come from the address and only the page's own name is given
|
|
* here; `hasBreadcrumbTrail` says which pages get one at all.
|
|
*/
|
|
export default function AdminBreadcrumbs({ pathname, title }: Props) {
|
|
if (!hasBreadcrumbTrail({ pathname })) return null;
|
|
|
|
return (
|
|
<Stack className={twMerge("w-full shrink-0 pt-5 pb-1")}>
|
|
<Breadcrumbs
|
|
pageUrl={pathname || AdminHomePath}
|
|
currentTitle={title}
|
|
excludeRegexMatch={/^admin$/}
|
|
linkProps={{
|
|
className:
|
|
"border-0 text-[13px] leading-[18px] text-ink-secondary no-underline hover:text-ink hover:opacity-100 dark:text-ink-secondary",
|
|
}}
|
|
currentLinkProps={{
|
|
title,
|
|
className:
|
|
"border-0 text-[13px] leading-[18px] text-ink no-underline pointer-events-none dark:text-ink",
|
|
}}
|
|
divider={
|
|
<ChevronRight
|
|
size={12}
|
|
aria-hidden
|
|
className="shrink-0 text-ink-secondary"
|
|
/>
|
|
}
|
|
/>
|
|
<Divider />
|
|
</Stack>
|
|
);
|
|
}
|