45 lines
1.1 KiB
TypeScript
45 lines
1.1 KiB
TypeScript
"use client";
|
|
|
|
import { Globe } from "lucide-react";
|
|
import { Button } from "@/components/ui/button";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from "@/components/ui/dropdown-menu";
|
|
import { useLanguage } from "@/contexts/LanguageContext";
|
|
import { Locale, localeNames } from "@/lib/i18n";
|
|
|
|
export function LanguageSwitcher() {
|
|
const { locale, setLocale } = useLanguage();
|
|
|
|
const locales: Locale[] = ['en', 'zh-TW'];
|
|
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button
|
|
variant="ghost"
|
|
size="icon"
|
|
className="text-white hover:bg-white/20"
|
|
aria-label="Switch language"
|
|
>
|
|
<Globe className="h-5 w-5" />
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end">
|
|
{locales.map((loc) => (
|
|
<DropdownMenuItem
|
|
key={loc}
|
|
onClick={() => setLocale(loc)}
|
|
className={locale === loc ? "bg-accent" : ""}
|
|
>
|
|
{localeNames[loc]}
|
|
</DropdownMenuItem>
|
|
))}
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
);
|
|
}
|