path: root/makima/frontend/src/components/NavStrip.tsx

import { RewriteLink } from "./RewriteLink";

interface NavLink {
  label: string;
  href: string;
  disabled?: boolean;
  external?: boolean;
}

const NAV_LINKS: NavLink[] = [
  { label: "Listen", href: "/listen" },
  { label: "Files", href: "/files" },
  { label: "Mesh", href: "/mesh", disabled: true },
  { label: "Register", href: "/register", disabled: true },
  { label: "Login", href: "/login", disabled: true },
];

export function NavStrip() {
  return (
    <nav
      className="flex items-center gap-2.5 px-3 py-2.5 border-t border-b border-dashed border-[rgba(117,170,252,0.35)] bg-[#0c1729] font-mono uppercase tracking-wide text-[11px]"
      aria-label="Main navigation"
    >
      <span className="text-[#9bc3ff] pr-2.5 border-r border-[rgba(117,170,252,0.35)]">
        NAV//
      </span>
      <div className="flex flex-wrap gap-2 items-center">
        {NAV_LINKS.map((link) => (
          <RewriteLink
            key={link.label}
            to={link.href}
            disabled={link.disabled}
            external={link.external}
          >
            {link.label}
          </RewriteLink>
        ))}
      </div>
    </nav>
  );
}