36 lines
983 B
JavaScript

import React from "react";
import { useNavigate } from "react-router-dom";
const Breadcrumb = ({ data }) => {
const navigate = useNavigate();
return (
<nav aria-label="breadcrumb">
<ol className="breadcrumb breadcrumb-custom-icon">
{data.map((item, index) =>
item.link ? (
<li className="breadcrumb-item cursor-pointer" key={index}>
<a
aria-label="breadcrumb link link-underline-primary "
onClick={() => navigate(item.link)}
>
{item.label}
</a>
<i className="breadcrumb-icon icon-base bx bx-chevron-right align-middle"></i>
</li>
) : (
<li
className="breadcrumb-item active "
key={new Date().getMilliseconds()}
>
{" "}
{item.label}
</li>
)
)}
</ol>
</nav>
);
};
export default Breadcrumb;