"use client";

import * as React from "react";
import Link from "next/link";
import { cn } from "@/lib/utils";

interface SidebarLinkProps {
  href: string;
  icon: React.ComponentType<{ className?: string }>;
  label: string;
  isActive: boolean;
  onClick?: () => void;
  className?: string;
  activeClassName?: string;
  inactiveClassName?: string;
}

export function SidebarLink({
  href,
  icon: Icon,
  label,
  isActive,
  onClick,
  className,
  activeClassName,
  inactiveClassName,
}: SidebarLinkProps) {
  return (
    <Link
      href={href}
      className={cn(
        "flex items-center gap-2.5 px-3 py-[7px] rounded-[10px] font-['Lexend_Deca'] text-[12px] transition-all duration-150",
        isActive
          ? (activeClassName || "text-white bg-[#1d1d39] font-semibold")
          : (inactiveClassName || "text-[#101828] hover:bg-[#1d1d39] hover:text-white"),
        className
      )}
      onClick={onClick}
    >
      <Icon className="size-4 shrink-0" />
      {label}
    </Link>
  );
}