import { useLang } from "@/lib/language";

export function LangSwitch() {
  const { lang, setLang } = useLang();
  const isAr = lang === "ar";
  return (
    <div className="flex items-center gap-0.5 rounded-sm bg-ink/5 p-1">
      <button
        onClick={() => setLang("fr")}
        className={`px-2.5 py-1 text-xs font-bold ${!isAr ? "bg-white shadow-sm" : "text-ink/50"}`}
      >
        FR
      </button>
      <button
        onClick={() => setLang("ar")}
        className={`px-2.5 py-1 font-arabic text-xs font-bold ${isAr ? "bg-white shadow-sm" : "text-ink/50"}`}
        dir="rtl"
      >
        عربي
      </button>
    </div>
  );
}