feat: refactoring modules

furumi-node-player/client/src/components/Breadcrumbs.tsx

@@ -0,0 +1,30 @@
+type Crumb = {
+  label: string
+  action?: () => void
+}
+
+type BreadcrumbsProps = {
+  items: Crumb[]
+}
+
+export function Breadcrumbs({ items }: BreadcrumbsProps) {
+  if (!items.length) return null
+
+  return (
+    <div className="breadcrumb">
+      {items.map((item, index) => {
+        const isLast = index === items.length - 1
+        return (
+          <span key={`${item.label}-${index}`}>
+            {!isLast && item.action ? (
+              <span onClick={item.action}>{item.label}</span>
+            ) : (
+              <span>{item.label}</span>
+            )}
+            {!isLast ? ' / ' : ''}
+          </span>
+        )
+      })}
+    </div>
+  )
+}