"use client";

import { menuItems } from "@/lib/config/adminMenu";
import Link from "next/link";
import { usePathname } from "next/navigation";
import SidebarItem from "../common/SidebarItem";

export default function Sidebar() {
  const pathname = usePathname();

  return (
    <aside className="w-64 bg-primary-800 text-white h-full p-4 space-y-2">
      {menuItems.map((item) => (
        <SidebarItem
          key={item.label}
          label={item.label}
          icon={<item.icon className="w-5 h-5" />}
          path={item.path}
        >
          {item.children &&
            item.children.map((child) => {
              const isActive = pathname === child.path;
              return (
                <Link
                  key={child.label}
                  href={child.path}
                  className={`block px-2 py-1 hover:text-primary-300 ${
                    isActive ? "text-primary-300 font-semibold" : ""
                  }`}
                >
                  {child.label}
                </Link>
              );
            })}
        </SidebarItem>
      ))}
    </aside>
  );
}
