File size: 1,779 Bytes
831f7e7 a64b653 831f7e7 2d83648 831f7e7 a64b653 831f7e7 8ec33d8 a64b653 831f7e7 a64b653 831f7e7 a64b653 831f7e7 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 |
import { Button } from "@/components/ui/button";
import { useContext } from "react";
import { LanguageContext } from "@/contexts/LanguageContext";
import { Language } from "@/i18n/translations";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
const languages: { code: Language; name: string; flag: string }[] = [
{ code: 'en', name: 'English', flag: '🇬🇧' },
{ code: 'fr', name: 'Français', flag: '🇫🇷' },
{ code: 'de', name: 'Deutsch', flag: '🇩🇪' },
{ code: 'it', name: 'Italiano', flag: '🇮🇹' },
{ code: 'es', name: 'Español', flag: '🇪🇸' },
{ code: 'pt', name: 'Português', flag: '🇵🇹' },
];
export const LanguageSelector = () => {
const { language, setLanguage } = useContext(LanguageContext);
console.log('[LanguageSelector] Current language:', language);
const handleLanguageChange = (code: Language) => {
console.log('[LanguageSelector] Language button clicked:', code);
setLanguage(code);
};
const currentLanguage = languages.find(lang => lang.code === language);
return (
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button variant="outline" size="sm" >
<span className="text-xl">{currentLanguage?.flag}</span>
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
{languages.map(({ code, name, flag }) => (
<DropdownMenuItem
key={code}
onClick={() => handleLanguageChange(code)}
className="cursor-pointer"
>
<span className="mr-2">{flag}</span>
<span>{name}</span>
</DropdownMenuItem>
))}
</DropdownMenuContent>
</DropdownMenu>
);
}; |