41 lines
1.4 KiB
TypeScript
41 lines
1.4 KiB
TypeScript
'use client';
|
|
|
|
import { useTranslation, locales } from '@/lib/i18n';
|
|
import { Button } from '@/components/ui/button';
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from '@/components/ui/dropdown-menu';
|
|
import { Globe } from 'lucide-react';
|
|
|
|
export function LanguageSwitcher() {
|
|
const { locale, setLocale } = useTranslation();
|
|
|
|
const currentLocale = locales.find(l => l.code === locale);
|
|
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger asChild>
|
|
<Button variant="ghost" size="sm" className="gap-2">
|
|
<Globe className="h-4 w-4" />
|
|
<span className="hidden sm:inline">{currentLocale?.flag} {currentLocale?.name}</span>
|
|
<span className="sm:hidden">{currentLocale?.flag}</span>
|
|
</Button>
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end">
|
|
{locales.map((l) => (
|
|
<DropdownMenuItem
|
|
key={l.code}
|
|
onClick={() => setLocale(l.code)}
|
|
className={locale === l.code ? 'bg-accent' : ''}
|
|
>
|
|
<span className="mr-2">{l.flag}</span>
|
|
{l.name}
|
|
</DropdownMenuItem>
|
|
))}
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
);
|
|
}
|