33 lines
1.1 KiB
TypeScript
33 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>
|
||
|
|
);
|
||
|
|
}
|