From 4d455fd62ea67ff275efbf1020d4c858bc550c7d Mon Sep 17 00:00:00 2001
From: LandaMm <qwer.009771@gmail.com>
Date: Sat, 31 May 2025 16:15:14 +0200
Subject: [PATCH] feat: ui breadcrumbs component

---
 web/src/components/ui/breadcrumbs.tsx | 35 +++++++++++++++++++++++++++
 1 file changed, 35 insertions(+)
 create mode 100644 web/src/components/ui/breadcrumbs.tsx

diff --git a/web/src/components/ui/breadcrumbs.tsx b/web/src/components/ui/breadcrumbs.tsx
new file mode 100644
index 0000000..feca3d4
--- /dev/null
+++ b/web/src/components/ui/breadcrumbs.tsx
@@ -0,0 +1,35 @@
+import type { FC } from "react";
+import { Link } from "react-router";
+
+interface BreadItem {
+  href?: string;
+  label: string;
+}
+
+interface IBreadcrumbsProps {
+  items: BreadItem[];
+  className?: string;
+}
+
+const Breadcrumbs: FC<IBreadcrumbsProps> = ({ items, className }) => {
+  return (
+    <div
+      className={`${className ? `${className} ` : ""} flex flex-row p-3 gap-3 items-center text-gray-800 dark:text-gray-200`}
+    >
+      {items.map((item, index) => (
+        <>
+          {item.href ? (
+            <Link to={item.href}>
+              <p className="text-blue-500">{item.label}</p>
+            </Link>
+          ) : (
+            <p>{item.label}</p>
+          )}
+          {index + 1 < items.length && <p>/</p>}
+        </>
+      ))}
+    </div>
+  );
+};
+
+export default Breadcrumbs;