revamp template

src/layouts/demo2/toolbar/ToolbarBreadcrumbs.tsx

@@ -0,0 +1,32 @@
+import { Fragment } from 'react';
+import { useMenuBreadcrumbs } from '@/components';
+import { Link } from 'react-router-dom';
+import { useMenus } from '@/providers';
+import { useLocation } from 'react-router';
+
+const ToolbarBreadcrumbs = () => {
+  const { getMenuConfig } = useMenus();
+  const { pathname } = useLocation();
+  const items = useMenuBreadcrumbs(pathname, getMenuConfig('primary'));
+
+  return (
+    <div className="flex items-center gap-1 text-sm font-normal">
+      {items.map((item, index) => (
+        <Fragment key={index}>
+          {item.path ? (
+            <Link to={item.path} className="text-gray-700 hover:text-primary">
+              {item.title}
+            </Link>
+          ) : (
+            <span className={index === items.length - 1 ? 'text-gray-900' : 'text-gray-700'}>
+              {item.title}
+            </span>
+          )}
+          {index !== items.length - 1 && <span className="text-gray-400 text-sm">/</span>}
+        </Fragment>
+      ))}
+    </div>
+  );
+};
+
+export { ToolbarBreadcrumbs };