"use client";

import Link from "next/link";
import { usePathname } from "next/navigation";
import {
  LayoutDashboard,
  Users,
  CalendarCheck2,
  CalendarDays,
  Contact,
  GraduationCap,
  UserCircle,
  ClipboardList,
  Stethoscope,
  Megaphone,
} from "lucide-react";

import { cn } from "@/lib/utils";

import { UserRole } from "@prisma/client";

const navItems = [
  {
    href: "/dashboard",
    label: "Übersicht",
    icon: LayoutDashboard,
    exact: true,
  },
  {
    href: "/dashboard/notdienst",
    label: "Notdienst (Eltern)",
    icon: CalendarCheck2,
    exact: true,
  },
  {
    href: "/dashboard/notdienst/plan",
    label: "Notdienst-Planung",
    icon: CalendarCheck2,
    exact: false,
    allowedRoles: [UserRole.ADMIN, UserRole.KOORDINATOR],
  },
  {
    href: "/dashboard/kalender",
    label: "Terminkalender",
    icon: CalendarDays,
    exact: false,
  },
  {
    href: "/dashboard/adressbuch",
    label: "Adressbuch",
    icon: Contact,
    exact: false,
  },
  {
    href: "/dashboard/families",
    label: "Familienverwaltung",
    icon: Users,
    exact: false,
    allowedRoles: [UserRole.ADMIN],
  },
  {
    href: "/dashboard/admin/dienste",
    label: "Dienstplan",
    icon: ClipboardList,
    exact: false,
    allowedRoles: [UserRole.ADMIN],
  },
  {
    href: "/dashboard/admin/news",
    label: "Schwarzes Brett",
    icon: Megaphone,
    exact: false,
    allowedRoles: [UserRole.ADMIN],
  },
  {
    href: "/dashboard/admin/kalender",
    label: "Event-Anmeldungen",
    icon: CalendarCheck2,
    exact: false,
    allowedRoles: [UserRole.ADMIN, UserRole.KOORDINATOR],
  },
  {
    href: "/dashboard/admin/abwesenheiten",
    label: "Abwesenheiten",
    icon: Stethoscope,
    exact: false,
    allowedRoles: [UserRole.ADMIN, UserRole.KOORDINATOR, UserRole.ERZIEHER],
  },
  {
    href: "/dashboard/erzieher",
    label: "ErzieherInnen",
    icon: GraduationCap,
    exact: false,
    allowedRoles: [UserRole.ADMIN],
  },
  {
    href: "/dashboard/profil",
    label: "Mein Profil",
    icon: UserCircle,
    exact: false,
  },
];

export function SidebarNav({ role }: { role: UserRole }) {
  const pathname = usePathname();

  return (
    <nav className="flex flex-col gap-1 px-3">
      {navItems.map(({ href, label, icon: Icon, exact, allowedRoles }) => {
        // Filter out items not allowed for the current role
        if (allowedRoles && !(allowedRoles as UserRole[]).includes(role)) {
          return null;
        }

        const isActive = exact ? pathname === href : pathname.startsWith(href);
        return (
          <Link
            key={href}
            href={href}
            className={cn(
              "flex items-center gap-3 rounded-md px-3 py-2 text-sm font-medium transition-colors",
              isActive
                ? "bg-primary text-primary-foreground"
                : "text-muted-foreground hover:bg-accent hover:text-accent-foreground",
            )}
          >
            <Icon className="h-4 w-4 shrink-0" />
            {label}
          </Link>
        );
      })}
    </nav>
  );
}
