import { type ReactNode } from "react";
import OdinMark from "../components/odin/OdinMark";

/** Palette key driving a section's tile wash + glyph color (see theme.ts). */
export type NavHue =
  | "primary"
  | "info"
  | "teal"
  | "warning"
  | "violet"
  | "slate";

export interface MenuItem {
  path: string;
  label: string;
  end?: boolean;
  permission?: string | string[];
  matchPrefix?: string;
  matchAlso?: string[];
  matchExclude?: string[];
  icon: ReactNode;
  /** Icon ships its own container (OdinMark) — SidebarNav skips the tile. */
  rawIcon?: boolean;
}

export interface MenuSection {
  label: string;
  hue: NavHue;
  items: MenuItem[];
}

/**
 * One stroke glyph per item, every glyph unique within the set (pinned by
 * navdata-icons.test.ts). 24-viewBox, stroke 2, round caps — rendered at
 * 16px inside SidebarNav's 26px section-hue tile.
 */
function glyph(children: ReactNode) {
  return (
    <svg
      viewBox="0 0 24 24"
      fill="none"
      stroke="currentColor"
      strokeWidth="2"
      strokeLinecap="round"
      strokeLinejoin="round"
    >
      {children}
    </svg>
  );
}

export const menuSections: MenuSection[] = [
  {
    label: "Přehled",
    hue: "primary",
    items: [
      {
        path: "/",
        label: "Přehled",
        end: true,
        // tachometr — dashboard
        icon: glyph(
          <>
            <circle cx="12" cy="13" r="8.5" />
            <path d="M12 13l4-4.5" />
          </>,
        ),
      },
      {
        path: "/odin",
        label: "Odin",
        permission: "ai.use",
        end: true,
        icon: <OdinMark size={26} />,
        rawIcon: true,
      },
    ],
  },
  {
    label: "Docházka",
    hue: "info",
    items: [
      {
        path: "/attendance",
        label: "Záznam",
        permission: "attendance.record",
        end: true,
        // píchačky — hodiny
        icon: glyph(
          <>
            <circle cx="12" cy="12" r="9" />
            <polyline points="12 7 12 12 15 15" />
          </>,
        ),
      },
      {
        path: "/attendance/history",
        label: "Moje historie",
        permission: "attendance.history",
        // výkaz s hodinami — timesheet
        icon: glyph(
          <>
            <path d="M14 3H5a1 1 0 0 0-1 1v16a1 1 0 0 0 1 1h6" />
            <line x1="7" y1="8" x2="13" y2="8" />
            <line x1="7" y1="12" x2="11" y2="12" />
            <circle cx="16.5" cy="16" r="4.5" />
            <polyline points="16.5 14 16.5 16 18 17" />
          </>,
        ),
      },
      {
        path: "/attendance/requests",
        label: "Žádosti",
        permission: "attendance.record",
        // odeslaná žádost — vlaštovka
        icon: glyph(
          <>
            <path d="M22 2L11 13" />
            <path d="M22 2l-7 20-4-9-9-4z" />
          </>,
        ),
      },
      {
        path: "/attendance/approval",
        label: "Schvalování",
        permission: "attendance.approve",
        // razítko
        icon: glyph(
          <>
            <path d="M9.5 12V9.8C9.5 8.4 8 7.8 8 6a4 4 0 0 1 8 0c0 1.8-1.5 2.4-1.5 3.8V12" />
            <path d="M5 16a2 2 0 0 1 2-2h10a2 2 0 0 1 2 2v2H5z" />
            <line x1="5" y1="21" x2="19" y2="21" />
          </>,
        ),
      },
      {
        path: "/attendance/admin",
        label: "Správa",
        permission: "attendance.manage",
        matchPrefix: "/attendance/admin",
        matchAlso: ["/attendance/create", "/attendance/location"],
        // osoba + fajfka
        icon: glyph(
          <>
            <circle cx="9" cy="8" r="3.5" />
            <path d="M3 20a6 6 0 0 1 12 0" />
            <path d="M15.5 11.5l2 2 4-4" />
          </>,
        ),
      },
      {
        path: "/attendance/balances",
        label: "Správa bilancí",
        permission: "attendance.balances",
        // kniha plus/mínus — ruční korekce bilancí
        icon: glyph(
          <>
            <rect x="4" y="3" width="16" height="18" rx="2" />
            <line x1="9" y1="8.5" x2="15" y2="8.5" />
            <line x1="12" y1="5.5" x2="12" y2="11.5" />
            <line x1="9" y1="16" x2="15" y2="16" />
          </>,
        ),
      },
      {
        path: "/plan-work",
        label: "Plán prací",
        permission: ["attendance.manage", "attendance.record"],
        // kalendář s plánovacím blokem
        icon: glyph(
          <>
            <rect x="3" y="4" width="18" height="17" rx="2" />
            <line x1="16" y1="2" x2="16" y2="6" />
            <line x1="8" y1="2" x2="8" y2="6" />
            <line x1="3" y1="9.5" x2="21" y2="9.5" />
            <path d="M8 14h3v3H8z" />
          </>,
        ),
      },
    ],
  },
  {
    label: "Kniha jízd",
    hue: "teal",
    items: [
      {
        path: "/trips",
        label: "Záznam",
        permission: "trips.record",
        end: true,
        // trasa A→B
        icon: glyph(
          <>
            <circle cx="5" cy="19" r="2" />
            <circle cx="19" cy="5" r="2" />
            <path d="M5 17C5 11 19 13 19 7" />
          </>,
        ),
      },
      {
        path: "/trips/history",
        label: "Moje historie",
        permission: "trips.history",
        // navštívená místa — pin
        icon: glyph(
          <>
            <path d="M12 21s-6-5.2-6-10a6 6 0 0 1 12 0c0 4.8-6 10-6 10z" />
            <circle cx="12" cy="11" r="2.5" />
          </>,
        ),
      },
      {
        path: "/trips/admin",
        label: "Správa",
        permission: "trips.manage",
        // schránka s fajfkou — kniha jízd
        icon: glyph(
          <>
            <rect x="5" y="4" width="14" height="17" rx="2" />
            <path d="M9 2h6v4H9z" />
            <path d="M9 13l2 2 4-4" />
          </>,
        ),
      },
      {
        path: "/vehicles",
        label: "Vozidla",
        permission: "vehicles.manage",
        // auto
        icon: glyph(
          <>
            <path d="M5 17H3v-4l2-5h11l3 5h2v4h-2" />
            <circle cx="7.5" cy="17" r="2" />
            <circle cx="16.5" cy="17" r="2" />
            <line x1="9.5" y1="17" x2="14.5" y2="17" />
          </>,
        ),
      },
    ],
  },
  {
    label: "Administrativa",
    hue: "warning",
    items: [
      {
        path: "/offers",
        label: "Nabídky",
        permission: "offers.view",
        matchPrefix: "/offers",
        matchExclude: ["/offers/customers", "/offers/templates"],
        // cenovka
        icon: glyph(
          <>
            <path d="M20.6 13.4L11 3H4v7l9.6 10.4a2 2 0 0 0 2.8 0l4.2-4.2a2 2 0 0 0 0-2.8z" />
            <circle cx="8" cy="8" r="1.5" />
          </>,
        ),
      },
      {
        path: "/orders",
        label: "Objednávky",
        permission: "orders.view",
        matchPrefix: "/orders",
        // košík
        icon: glyph(
          <>
            <circle cx="9" cy="20" r="1.6" />
            <circle cx="17" cy="20" r="1.6" />
            <path d="M2 3h3l2.7 12h10.6l2.7-9H6" />
          </>,
        ),
      },
      {
        path: "/invoices",
        label: "Faktury",
        permission: "invoices.view",
        matchPrefix: "/invoices",
        // účtenka
        icon: glyph(
          <>
            <path d="M6 2h12v20l-3-2-3 2-3-2-3 2z" />
            <line x1="9" y1="7" x2="15" y2="7" />
            <line x1="9" y1="11" x2="15" y2="11" />
          </>,
        ),
      },
      {
        path: "/projects",
        label: "Projekty",
        permission: "projects.view",
        matchPrefix: "/projects",
        // složka (NAS projektové složky)
        icon: glyph(
          <path d="M3 7a2 2 0 0 1 2-2h4l2 2.5h8a2 2 0 0 1 2 2V18a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />,
        ),
      },
      {
        path: "/offers/customers",
        label: "Zákazníci",
        permission: "customers.view",
        // vizitka
        icon: glyph(
          <>
            <rect x="2" y="4" width="20" height="16" rx="2" />
            <circle cx="8.5" cy="10.5" r="2.2" />
            <path d="M5 16.5a3.5 3.5 0 0 1 7 0" />
            <line x1="14.5" y1="9.5" x2="19" y2="9.5" />
            <line x1="14.5" y1="13.5" x2="19" y2="13.5" />
          </>,
        ),
      },
    ],
  },
  {
    label: "Sklad",
    hue: "violet",
    items: [
      {
        path: "/warehouse",
        label: "Přehled",
        permission: "warehouse.view",
        end: true,
        // skladová hala
        icon: glyph(
          <>
            <path d="M3 21V9l9-5 9 5v12" />
            <path d="M7 21v-7h10v7" />
            <line x1="7" y1="17.5" x2="17" y2="17.5" />
          </>,
        ),
      },
      {
        path: "/warehouse/items",
        label: "Položky",
        permission: "warehouse.view",
        matchPrefix: "/warehouse/items",
        // krabice
        icon: glyph(
          <>
            <path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z" />
            <polyline points="3.27 6.96 12 12.01 20.73 6.96" />
            <line x1="12" y1="22.08" x2="12" y2="12" />
          </>,
        ),
      },
      {
        path: "/warehouse/receipts",
        label: "Příjmy",
        permission: "warehouse.operate",
        matchPrefix: "/warehouse/receipts",
        // šipka do krabice
        icon: glyph(
          <>
            <rect x="4" y="12" width="16" height="9" rx="1" />
            <polyline points="8 6 12 10 16 6" />
            <line x1="12" y1="2" x2="12" y2="10" />
          </>,
        ),
      },
      {
        path: "/warehouse/issues",
        label: "Výdeje",
        permission: "warehouse.operate",
        matchPrefix: "/warehouse/issues",
        // šipka z krabice ven
        icon: glyph(
          <>
            <rect x="4" y="13" width="16" height="8" rx="1" />
            <polyline points="8 6 12 2 16 6" />
            <line x1="12" y1="2" x2="12" y2="11" />
          </>,
        ),
      },
      {
        path: "/warehouse/reservations",
        label: "Rezervace",
        permission: "warehouse.operate",
        matchPrefix: "/warehouse/reservations",
        // krabice se záložkou
        icon: glyph(
          <>
            <rect x="3" y="8" width="13" height="12" rx="1" />
            <path d="M16 3h5v9l-2.5-2L16 12z" />
          </>,
        ),
      },
      {
        path: "/warehouse/inventory",
        label: "Inventura",
        permission: "warehouse.inventory",
        matchPrefix: "/warehouse/inventory",
        // čárový kód — fyzický sken zásob
        icon: glyph(
          <>
            <line x1="4" y1="6" x2="4" y2="18" />
            <line x1="8" y1="6" x2="8" y2="18" />
            <line x1="12" y1="6" x2="12" y2="18" />
            <line x1="17" y1="6" x2="17" y2="18" />
            <line x1="20" y1="6" x2="20" y2="18" />
          </>,
        ),
      },
      {
        path: "/warehouse/reports",
        label: "Reporty",
        permission: "warehouse.view",
        end: true,
        // graf v rámu
        icon: glyph(
          <>
            <rect x="3" y="3" width="18" height="18" rx="2" />
            <polyline points="7 14 11 10 14 13 17 8" />
          </>,
        ),
      },
      {
        path: "/warehouse/categories",
        label: "Kategorie",
        permission: "warehouse.manage",
        matchPrefix: "/warehouse/categories",
        // tvary — třídění do kategorií
        icon: glyph(
          <>
            <circle cx="7.5" cy="7.5" r="3.5" />
            <rect x="13.5" y="4" width="7" height="7" rx="1" />
            <path d="M7.5 13.5l3.5 7h-7z" />
            <rect x="13.5" y="13.5" width="7" height="7" rx="3.5" />
          </>,
        ),
      },
      {
        path: "/warehouse/locations",
        label: "Lokace",
        permission: "warehouse.manage",
        matchPrefix: "/warehouse/locations",
        // regál s krabicemi
        icon: glyph(
          <>
            <path d="M3 21V4" />
            <path d="M21 21V4" />
            <line x1="3" y1="12" x2="21" y2="12" />
            <line x1="3" y1="21" x2="21" y2="21" />
            <rect x="7" y="8" width="4" height="4" />
            <rect x="13" y="17" width="4" height="4" />
          </>,
        ),
      },
      {
        path: "/warehouse/suppliers",
        label: "Dodavatelé",
        permission: "warehouse.manage",
        matchPrefix: "/warehouse/suppliers",
        // kamion
        icon: glyph(
          <>
            <rect x="1" y="6" width="13" height="10" rx="1" />
            <path d="M14 9h4l3 4v3h-7" />
            <circle cx="6" cy="18.5" r="2" />
            <circle cx="17.5" cy="18.5" r="2" />
          </>,
        ),
      },
    ],
  },
  {
    label: "Systém",
    hue: "slate",
    items: [
      {
        path: "/users",
        label: "Uživatelé",
        permission: "users.view",
        // lidé — uživatelské účty
        icon: glyph(
          <>
            <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
            <circle cx="9" cy="7" r="4" />
            <path d="M23 21v-2a4 4 0 0 0-3-3.87" />
            <path d="M16 3.13a4 4 0 0 1 0 7.75" />
          </>,
        ),
      },
      {
        path: "/settings",
        label: "Nastavení",
        permission: [
          "settings.company",
          "settings.banking",
          "settings.roles",
          "settings.system",
          "settings.templates",
        ],
        // ozubené kolo
        icon: glyph(
          <>
            <circle cx="12" cy="12" r="3" />
            <path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" />
          </>,
        ),
      },
      {
        path: "/audit-log",
        label: "Audit log",
        permission: "settings.audit",
        // lupa nad záznamy
        icon: glyph(
          <>
            <path d="M4 5h12" />
            <path d="M4 10h6" />
            <path d="M4 15h5" />
            <circle cx="15" cy="14" r="4.5" />
            <line x1="18.2" y1="17.2" x2="21.5" y2="20.5" />
          </>,
        ),
      },
    ],
  },
];

/** Active-state matching (mirrors the original Sidebar logic, incl. matchAlso). */
export function isItemActive(item: MenuItem, pathname: string): boolean {
  if (item.matchPrefix) {
    let active = pathname.startsWith(item.matchPrefix);
    if (active && item.matchExclude) {
      active = !item.matchExclude.some((ex) => pathname.startsWith(ex));
    }
    if (!active && item.matchAlso) {
      active = item.matchAlso.some((p) => pathname.startsWith(p));
    }
    return active;
  }
  if (item.matchAlso && item.matchAlso.some((p) => pathname.startsWith(p))) {
    return true;
  }
  if (item.end) return pathname === item.path;
  // Boundary-safe prefix match: exact, or a child route under item.path (so a
  // sibling like "/x-foo" can't spuriously activate "/x"). Avoids a double "/"
  // when item.path is the root.
  return (
    pathname === item.path ||
    pathname.startsWith(item.path === "/" ? "/" : `${item.path}/`)
  );
}

/** Permission check: true if no permission, or any listed permission is held. */
export function hasItemPermission(
  item: MenuItem,
  hasPermission: (p: string) => boolean,
): boolean {
  if (!item.permission) return true;
  if (Array.isArray(item.permission)) {
    return item.permission.some((p) => hasPermission(p));
  }
  return hasPermission(item.permission);
}