"use client";
import { useTranslations } from "next-intl";
import { Link, usePathname } from "@/i18n/navigation";
import { cn } from "@/lib/utils";

export default function FooterLinks() {
  const t = useTranslations("Footer");
  const pathname = usePathname();

  const links = [
    { href: "/refund-policy", label: t("refundPolicy") },
    { href: "/privacy-policy", label: t("privacyPolicy") },
  ] as const;

  return (
    <div className="flex flex-row flex-wrap gap-x-6 gap-y-2">
      {links.map(({ href, label }) => {
        const isActive = pathname === href;

        return (
          <Link
            key={href}
            href={href}
            aria-current={isActive ? "page" : undefined}
            className={cn(
              "text-[12px] sm:text-[14px] font-bold underline underline-offset-4 transition-colors hover:text-secondary-main",
              isActive && "text-secondary-main"
            )}
          >
            {label}
          </Link>
        );
      })}
    </div>
  );
}