100 lines
2.6 KiB
TypeScript
100 lines
2.6 KiB
TypeScript
// import { cn } from "@/lib/utils";
|
|
// import { ChevronRightIcon } from "@radix-ui/react-icons";
|
|
// import Link from "next/link";
|
|
// import React from "react";
|
|
|
|
// type BreadCrumbType = {
|
|
// title: string;
|
|
// link: string;
|
|
// };
|
|
|
|
// type BreadCrumbPropsType = {
|
|
// items: BreadCrumbType[];
|
|
// };
|
|
|
|
// export default function BreadCrumb({ items }: BreadCrumbPropsType) {
|
|
// return (
|
|
// <div className="mb-4 flex items-center space-x-1 text-sm text-muted-foreground">
|
|
// <Link
|
|
// href={"/dashboard"}
|
|
// className="overflow-hidden text-ellipsis whitespace-nowrap"
|
|
// >
|
|
// Dashboard
|
|
// </Link>
|
|
// {items?.map((item: BreadCrumbType, index: number) => (
|
|
// <React.Fragment key={item.title}>
|
|
// <ChevronRightIcon className="h-4 w-4" />
|
|
// <Link
|
|
// href={item.link}
|
|
// className={cn(
|
|
// "font-medium",
|
|
// index === items.length - 1
|
|
// ? "text-foreground pointer-events-none"
|
|
// : "text-muted-foreground",
|
|
// )}
|
|
// >
|
|
// {item.title}
|
|
// </Link>
|
|
// </React.Fragment>
|
|
// ))}
|
|
// </div>
|
|
// );
|
|
// }
|
|
|
|
import {
|
|
Breadcrumb as BreadcrumbParent,
|
|
BreadcrumbItem,
|
|
BreadcrumbLink,
|
|
BreadcrumbList,
|
|
BreadcrumbPage,
|
|
BreadcrumbSeparator,
|
|
} from "@/components/ui/breadcrumb";
|
|
import { Fragment } from "react";
|
|
|
|
type BreadCrumbType = {
|
|
title: string;
|
|
link?: string;
|
|
};
|
|
|
|
type BreadCrumbPropsType = {
|
|
items: BreadCrumbType[];
|
|
};
|
|
|
|
const Breadcrumb = ({ items }: BreadCrumbPropsType) => {
|
|
return (
|
|
<BreadcrumbParent>
|
|
<BreadcrumbList>
|
|
{items.map((item) => (
|
|
<Fragment key={item.title}>
|
|
{item.link ? (
|
|
<>
|
|
<BreadcrumbItem>
|
|
<BreadcrumbLink href={item.link}>{item.title}</BreadcrumbLink>
|
|
</BreadcrumbItem>
|
|
<BreadcrumbSeparator />
|
|
</>
|
|
) : (
|
|
<BreadcrumbItem>
|
|
<BreadcrumbPage>{item.title}</BreadcrumbPage>
|
|
</BreadcrumbItem>
|
|
)}
|
|
</Fragment>
|
|
))}
|
|
{/* <BreadcrumbItem>
|
|
<BreadcrumbLink href="/">Home</BreadcrumbLink>
|
|
</BreadcrumbItem>
|
|
<BreadcrumbSeparator />
|
|
<BreadcrumbItem>
|
|
<BreadcrumbLink href="/components">Components</BreadcrumbLink>
|
|
</BreadcrumbItem>
|
|
<BreadcrumbSeparator />
|
|
<BreadcrumbItem>
|
|
<BreadcrumbPage>Breadcrumb</BreadcrumbPage>
|
|
</BreadcrumbItem> */}
|
|
</BreadcrumbList>
|
|
</BreadcrumbParent>
|
|
);
|
|
};
|
|
|
|
export default Breadcrumb;
|