49 lines
1.2 KiB
TypeScript
49 lines
1.2 KiB
TypeScript
'use client';
|
|
import { usePathname, useRouter } from "@/i18n/navigation";
|
|
import { Button, DropdownMenu } from "@radix-ui/themes";
|
|
import { useLocale } from "next-intl";
|
|
|
|
const LanguageSwitcher = () => {
|
|
const pathname = usePathname();
|
|
const locale = useLocale();
|
|
|
|
|
|
const languageLabels = {
|
|
en: "English",
|
|
zh: "中文",
|
|
// ar: "العربية",
|
|
// es: "Español",
|
|
// jp: "日本語",
|
|
};
|
|
|
|
const router = useRouter();
|
|
const labels = [];
|
|
for (let l in languageLabels) {
|
|
const key = l as keyof typeof languageLabels;
|
|
labels.push(
|
|
<DropdownMenu.Item key={l} onClick={() => {
|
|
if (l !== locale) {
|
|
router.push(pathname, { locale: l });
|
|
}
|
|
}}>
|
|
{languageLabels[key]}
|
|
</DropdownMenu.Item>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<DropdownMenu.Root dir={locale === "ar" ? "rtl" : "ltr"}>
|
|
<DropdownMenu.Trigger >
|
|
<Button variant="outline" size={"2"}>
|
|
{languageLabels[locale as keyof typeof languageLabels]}
|
|
</Button>
|
|
</DropdownMenu.Trigger>
|
|
<DropdownMenu.Content align="end">
|
|
{labels}
|
|
</DropdownMenu.Content>
|
|
</DropdownMenu.Root>
|
|
);
|
|
};
|
|
|
|
export default LanguageSwitcher;
|