disclosure-bureau/web/components/locale-toggle-client.tsx

32 lines
1.1 KiB
TypeScript

"use client";
import { useRouter } from "next/navigation";
import { Globe } from "lucide-react";
import type { Locale } from "./locale-toggle";
export function LocaleToggleClient({ current }: { current: Locale }) {
const router = useRouter();
function setLocale(next: Locale) {
document.cookie = `locale=${next}; path=/; max-age=${60 * 60 * 24 * 365}; SameSite=Lax`;
router.refresh();
}
return (
<div className="inline-flex items-center gap-1 font-mono text-[10px] uppercase tracking-widest border border-[rgba(0,255,156,0.32)] rounded">
<span className="px-2 py-1 text-[#5a6678]"><Globe size={11} /></span>
<button
onClick={() => setLocale("en")}
className={`px-2 py-1 ${current === "en" ? "bg-[rgba(0,255,156,0.12)] text-[#00ff9c]" : "text-[#8896aa] hover:text-[#7fdbff]"}`}
>
EN
</button>
<button
onClick={() => setLocale("pt-br")}
className={`px-2 py-1 ${current === "pt-br" ? "bg-[rgba(0,255,156,0.12)] text-[#00ff9c]" : "text-[#8896aa] hover:text-[#7fdbff]"}`}
>
PT-BR
</button>
</div>
);
}