"use client";

import { Breadcrumb } from "antd";
import Link from "next/link";
import { usePathname } from "next/navigation";

const breadcrumbNameMap: Record<string, string> = {
  "/dashboard": "Dashboard",
  "/dashboard/caasm": "CAASM",
  "/dashboard/caasm/overview": "Overview",
  "/dashboard/caasm/assets": "Assets",
  "/dashboard/caasm/ip-assets": "IP Assets",
  "/dashboard/caasm/api-assets": "API Assets",
  "/dashboard/caasm/ports": "Ports",
  "/dashboard/caasm/domains": "Domains",
  "/dashboard/caasm/cloud-accounts": "Cloud Accounts",
  "/dashboard/caasm/sync-jobs": "Sync Jobs",
  "/dashboard/caasm/relationships": "Relationships",
  "/dashboard/caasm/config": "Configuration",
  "/dashboard/vulnerabilities": "Vulnerabilities",
  "/dashboard/vulnerabilities/list": "List",
  "/dashboard/vulnerabilities/submit": "Submit",
  "/dashboard/vulnerabilities/config": "Configuration",
  "/dashboard/api-keys": "API Keys",
  "/dashboard/openapi": "OpenAPI",
  "/dashboard/openapi/docs": "API Docs",
  "/dashboard/systems": "Systems",
  "/dashboard/systems/users": "Users",
  "/dashboard/systems/settings": "Settings",
  "/dashboard/logs": "Logs",
  "/dashboard/logs/audit": "Audit Log",
};

function formatSegment(segment: string) {
  if (!segment) return "";
  return segment
    .split("-")
    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
    .join(" ");
}

export function AppBreadcrumbs() {
  const pathname = usePathname();
  const pathSnippets = pathname.split("/").filter((i) => i);

  if (pathSnippets.length === 0 || pathname === "/dashboard") {
    return null;
  }

  const relevantSnippets = pathSnippets[0] === "dashboard" ? pathSnippets.slice(1) : pathSnippets;

  const items = relevantSnippets.map((_, index) => {
    const url = `/dashboard/${relevantSnippets.slice(0, index + 1).join("/")}`;
    const label = breadcrumbNameMap[url] ?? formatSegment(relevantSnippets[index]);
    const isLast = index === relevantSnippets.length - 1;

    return {
      key: url,
      title: isLast ? (
        label
      ) : (
        <Link href={url}>{label}</Link>
      ),
    };
  });

  return <Breadcrumb items={[{ title: <Link href="/dashboard">Dashboard</Link> }, ...items]} style={{ marginBottom: 16 }} />;
}