42 lines
1.3 KiB
TypeScript
42 lines
1.3 KiB
TypeScript
"use client";
|
|
|
|
import { useRouter } from "next/navigation";
|
|
import { LOCALES, LOCALE_LABELS, type Locale } from "@/lib/i18n/locales";
|
|
import { setLocaleCookie } from "@/lib/i18n/set-locale-cookie";
|
|
|
|
export function LanguageSwitcher({ current }: { current: Locale }) {
|
|
const router = useRouter();
|
|
|
|
async function switchTo(locale: Locale) {
|
|
if (locale === current) {
|
|
return;
|
|
}
|
|
await setLocaleCookie(locale);
|
|
router.refresh();
|
|
}
|
|
|
|
return (
|
|
<div
|
|
role="group"
|
|
aria-label="language"
|
|
className="flex items-center gap-1 rounded-full border border-white/10 bg-white/5 p-1"
|
|
>
|
|
{LOCALES.map((locale) => (
|
|
<button
|
|
key={locale}
|
|
type="button"
|
|
onClick={() => switchTo(locale)}
|
|
aria-pressed={locale === current}
|
|
className={`rounded-full px-2.5 py-1 font-mono text-xs transition-colors ${
|
|
locale === current
|
|
? "bg-blurple text-white"
|
|
: "text-zinc-400 hover:text-white"
|
|
}`}
|
|
>
|
|
{LOCALE_LABELS[locale]}
|
|
</button>
|
|
))}
|
|
</div>
|
|
);
|
|
}
|