34 lines
612 B
TypeScript
34 lines
612 B
TypeScript
import React from 'react';
|
|
import { NavLink } from 'react-router-dom';
|
|
|
|
interface Link {
|
|
label: string;
|
|
href: string;
|
|
}
|
|
|
|
interface Props {
|
|
links?: Link[];
|
|
}
|
|
|
|
const Breadcrumb: React.FC<Props> = ({
|
|
links,
|
|
children,
|
|
}) => {
|
|
return (
|
|
<nav className="breadcrumb" aria-label="breadcrumbs">
|
|
<ul>
|
|
{links && links.map(({ label, href }) => (
|
|
<li key={label}>
|
|
<NavLink to={href}>{label}</NavLink>
|
|
</li>
|
|
))}
|
|
|
|
<li className="is-active">
|
|
<a href="#">{children}</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
);
|
|
}
|
|
|
|
export default Breadcrumb;
|