"use client";

import Link from "next/link";
import { usePathname } from "next/navigation";
import { useSession } from "next-auth/react";
import { cn } from "@/lib/utils";
import {
  LayoutDashboard,
  Search,
  Quote,
  FileDown,
  Settings,
  Shield,
} from "lucide-react";

const baseNavItems = [
  { name: "数据总览", href: "/dashboard", icon: LayoutDashboard },
  { name: "查询管理", href: "/dashboard/queries", icon: Search },
  { name: "引用记录", href: "/dashboard/citations", icon: Quote },
  { name: "报告导出", href: "/dashboard/reports", icon: FileDown },
  { name: "设置", href: "/dashboard/settings", icon: Settings },
];

export function Sidebar() {
  const pathname = usePathname();
  const { data: session } = useSession();

  const navItems = session?.user?.is_admin
    ? [...baseNavItems, { name: "管理后台", href: "/dashboard/admin", icon: Shield }]
    : baseNavItems;

  return (
    <aside className="fixed left-0 top-0 z-40 h-screen w-64 bg-slate-900 text-white">
      <div className="flex h-16 items-center px-6">
        <span className="text-xl font-bold">GEO Platform</span>
      </div>
      <nav className="space-y-1 px-4 py-4">
        {navItems.map((item) => {
          const isActive =
            item.href === "/dashboard"
              ? pathname === "/dashboard"
              : pathname === item.href || pathname.startsWith(`${item.href}/`);
          return (
            <Link
              key={item.href}
              href={item.href}
              className={cn(
                "flex items-center rounded-lg px-4 py-3 text-sm font-medium transition-colors",
                isActive
                  ? "bg-blue-600 text-white"
                  : "text-slate-300 hover:bg-slate-800 hover:text-white"
              )}
            >
              <item.icon className="mr-3 h-5 w-5" />
              {item.name}
            </Link>
          );
        })}
      </nav>
    </aside>
  );
}