"use client";

import Link from "next/link";
import { usePathname } from "next/navigation";

type NextLinkProps = {
  ref: string;
  title: string;
  className?: string;
};

const NextLink = ({ ref, title, className }: NextLinkProps) => {
  const pathnames = usePathname();
  // const currentPage  = "/" + pathnames.split("/").slice(2).join("/");
  const isActive = pathnames.startsWith(`/${ref}`);

  return (
    <Link
      href={`/${ref}`}
      className={`text-dark text-[15px] lg:text-[20px] font-light cursor-pointer ${className} ${
        isActive ? "text-primary" : ""
      }`}
    >
      {title}
    </Link>
  );
};

export default NextLink;