"use client";

import { Breadcrumbs } from "@heroui/react";

type BreadcrumbItem = {
  label: string;
  href?: string;
};

type DashboardBreadcrumbsProps = {
  items: readonly BreadcrumbItem[];
};

export default function DashboardBreadcrumbs({ items }: DashboardBreadcrumbsProps) {
  return (
    <Breadcrumbs aria-label="Ruta de navegación">
      {items.map((item) => (
        <Breadcrumbs.Item
          key={item.href ?? item.label}
          href={item.href}
          className={
            item.href
              ? "text-sm text-zinc-500 hover:text-[#9d2449]"
              : "text-sm font-medium text-zinc-800"
          }
        >
          {item.label}
        </Breadcrumbs.Item>
      ))}
    </Breadcrumbs>
  );
}