"use client";

import Link from "next/link";
import { usePathname } from "next/navigation";
import { portfolioContent, type Language } from "@/data/portfolio";

export function LanguageToggle({ language }: { language: Language }) {
  const pathname = usePathname() ?? `/${language}`;
  const nextLanguage = language === "en" ? "ar" : "en";
  const { languageLabel, languageToggleAriaLabel } = portfolioContent[language].ui;
  const segments = pathname.split("/").filter(Boolean);

  if (segments[0] === "en" || segments[0] === "ar") {
    segments[0] = nextLanguage;
  } else {
    segments.unshift(nextLanguage);
  }

  const nextPath = `/${segments.join("/")}`;

  return (
    <Link
      href={nextPath}
      className="control-pill"
      aria-label={languageToggleAriaLabel}
    >
      {languageLabel}
    </Link>
  );
}