# All files / src/components/navigation Breadcrumbs.tsx

0% Statements 0/9
0% Branches 0/8
0% Functions 0/2
0% Lines 0/8

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39

     "use client";

    import Link from "next/link";
    import React from "react";
    import { useTranslation } from "react-i18next";

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

    export default function Breadcrumbs({ items }: { items: BreadcrumbItem[] }) {
      const { t } = useTranslation();
      if (!items || items.length === 0) return null;

      return (
        <nav aria-label={t('accessibility.breadcrumb')} className="text-sm text-gray-500">
          <ol className="flex items-center space-x-2">
            {items.map((item, idx) => {
              const isLast = idx === items.length - 1;
              return (
                <li key={idx} className="flex items-center">
                  {item.href && !isLast ? (
                    <Link href={item.href} className="hover:text-gray-900">
                      {item.label}
                    </Link>
                  ) : (
                    <span className="text-gray-700">{item.label}</span>
                  )}
                  {!isLast && <span className="mx-2 text-gray-400">/</span>}
                </li>
              );
            })}
          </ol>
        </nav>
      );
    }