// import React from 'react';
// import { Link, useLocation } from 'react-router-dom';

// const Breadcrumb = () => {
//   const location = useLocation();
//   const paths = location.pathname.split('/').filter(path => path);

//   // Only include the last path as active
//   const lastPath = paths[paths.length - 1];

//   return (
//     <nav style={{ '--bs-breadcrumb-divider': 'url("data:image/svg+xml,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' width=\'8\' height=\'8\'%3E%3Cpath d=\'M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z\' fill=\'currentColor\'/%3E%3C/svg%3E")' }} aria-label="breadcrumb">
//       <ol className="breadcrumb">
//         <li className="breadcrumb-item">
//           <Link to="/">Home</Link>
//         </li>
//         {paths.length > 0 && (
//           <li className="breadcrumb-item active" aria-current="page">
//             {lastPath.charAt(0).toUpperCase() + lastPath.slice(1)}
//           </li>
//         )}
//       </ol>
//     </nav>
//   );
// };

// export default Breadcrumb;


// import React from 'react';
// import { useLocation, Link } from 'react-router-dom';

// const Breadcrumb = () => {
//   const location = useLocation();

//   // Split the current path into segments
//   const pathnames = location.pathname.split('/').filter((x) => x);

//   return (
//     <ol className="breadcrumb breadcrumb-arrow font-trirong">
//       <li>
//         <Link to="/">
//           <i className="bi bi-house"></i> {/* Bootstrap Icon for Home */}
//         </Link>
//       </li>
//       {pathnames.map((value, index) => {
//         // Create a cumulative path for each breadcrumb link
//         const to = `/${pathnames.slice(0, index + 1).join('/')}`;
//         const isLast = index === pathnames.length - 1;

//         return (
//           <li key={to} className={isLast ? 'active' : ''}>
//             {isLast ? (
//               value.charAt(0).toUpperCase() + value.slice(1)
//             ) : (
//               <Link to={to}>
//                 {value.charAt(0).toUpperCase() + value.slice(1)}
//               </Link>
//             )}
//           </li>
//         );
//       })}
//     </ol>
//   );
// };

// export default Breadcrumb;