"use client";

import { ROUTES, EachRoute } from "@/lib/routes-config";
import SubLink from "./sublink";
import { usePathname } from "next/navigation";
import { cn } from "@/lib/utils";

interface DocsMenuProps {
  isSheet?: boolean;
  className?: string;
}

export default function DocsMenu({ isSheet = false, className = "" }: DocsMenuProps) {
  const pathname = usePathname();

  if (!pathname.startsWith("/docs")) return null;

  return (
    <nav
      aria-label="Documentation navigation"
      className={cn("transition-all duration-200", className)}
    >
      <ul className="flex flex-col gap-1.5 py-4">
        {ROUTES.map((route, index) => (
          <li key={route.title + index}>
            <SubLink
              {...route}
              href={`/docs${route.href}`}
              level={0}
              isSheet={isSheet}
            />
          </li>
        ))}
      </ul>
    </nav>
  );
}