31 lines
655 B
TypeScript
31 lines
655 B
TypeScript
|
type Crumb = {
|
||
|
|
label: string
|
||
|
|
action?: () => void
|
||
|
|
}
|
||
|
|
|
||
|
|
type BreadcrumbsProps = {
|
||
|
|
items: Crumb[]
|
||
|
|
}
|
||
|
|
|
||
|
|
export function Breadcrumbs({ items }: BreadcrumbsProps) {
|
||
|
|
if (!items.length) return null
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="breadcrumb">
|
||
|
|
{items.map((item, index) => {
|
||
|
|
const isLast = index === items.length - 1
|
||
|
|
return (
|
||
|
|
<span key={`${item.label}-${index}`}>
|
||
|
|
{!isLast && item.action ? (
|
||
|
|
<span onClick={item.action}>{item.label}</span>
|
||
|
|
) : (
|
||
|
|
<span>{item.label}</span>
|
||
|
|
)}
|
||
|
|
{!isLast ? ' / ' : ''}
|
||
|
|
</span>
|
||
|
|
)
|
||
|
|
})}
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|