29 lines
863 B
TypeScript
29 lines
863 B
TypeScript
import { Link } from 'react-router-dom';
|
|
|
|
type BreadcrumbItem = {
|
|
label: string;
|
|
href?: string; // optional, jika tidak ada berarti item aktif
|
|
};
|
|
|
|
type BreadcrumbProps = {
|
|
items: BreadcrumbItem[];
|
|
};
|
|
|
|
export const Breadcrumb = ({ items }: BreadcrumbProps) => {
|
|
return (
|
|
<ul className="flex space-x-2 rtl:space-x-reverse">
|
|
{items.map((item, index) => (
|
|
<li key={index} className={index !== 0 ? "before:content-['/'] ltr:before:mr-2 rtl:before:ml-2" : ''}>
|
|
{item.href ? (
|
|
<Link to={item.href} className="text-primary hover:underline">
|
|
{item.label}
|
|
</Link>
|
|
) : (
|
|
<span>{item.label}</span>
|
|
)}
|
|
</li>
|
|
))}
|
|
</ul>
|
|
);
|
|
};
|