mirror of
https://github.com/Termix-SSH/Termix.git
synced 2026-07-16 05:13:36 +00:00
LukeGus
84 lines
3.3 KiB
TypeScript
84 lines
3.3 KiB
TypeScript
import React from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import {
|
|
Select,
|
|
SelectContent,
|
|
SelectItem,
|
|
SelectTrigger,
|
|
SelectValue,
|
|
} from "@/components/select.tsx";
|
|
import { Globe } from "lucide-react";
|
|
|
|
const languages = [
|
|
{ code: "en", name: "English", nativeName: "English" },
|
|
{ code: "af", name: "Afrikaans", nativeName: "Afrikaans" },
|
|
{ code: "ar", name: "Arabic", nativeName: "العربية" },
|
|
{ code: "bn", name: "Bengali", nativeName: "বাংলা" },
|
|
{ code: "bg", name: "Bulgarian", nativeName: "Български" },
|
|
{ code: "ca", name: "Catalan", nativeName: "Català" },
|
|
{ code: "zh-CN", name: "Chinese Simplified", nativeName: "简体中文" },
|
|
{ code: "zh-TW", name: "Chinese Traditional", nativeName: "繁体中文" },
|
|
{ code: "cs", name: "Czech", nativeName: "Čeština" },
|
|
{ code: "da", name: "Danish", nativeName: "Dansk" },
|
|
{ code: "nl", name: "Dutch", nativeName: "Nederlands" },
|
|
{ code: "fi", name: "Finnish", nativeName: "Suomi" },
|
|
{ code: "fr", name: "French", nativeName: "Français" },
|
|
{ code: "de", name: "German", nativeName: "Deutsch" },
|
|
{ code: "el", name: "Greek", nativeName: "Ελληνικά" },
|
|
{ code: "he", name: "Hebrew", nativeName: "עברית" },
|
|
{ code: "hi", name: "Hindi", nativeName: "हिन्दी" },
|
|
{ code: "hu", name: "Hungarian", nativeName: "Magyar" },
|
|
{ code: "id", name: "Indonesian", nativeName: "Bahasa Indonesia" },
|
|
{ code: "it", name: "Italian", nativeName: "Italiano" },
|
|
{ code: "ja", name: "Japanese", nativeName: "日本語" },
|
|
{ code: "ko", name: "Korean", nativeName: "한국어" },
|
|
{ code: "no", name: "Norwegian", nativeName: "Norsk" },
|
|
{ code: "pl", name: "Polish", nativeName: "Polski" },
|
|
{
|
|
code: "pt-PT",
|
|
name: "Portuguese",
|
|
nativeName: "Português",
|
|
},
|
|
{
|
|
code: "pt-BR",
|
|
name: "Portuguese (Brazil)",
|
|
nativeName: "Português (Brasil)",
|
|
},
|
|
{ code: "ro", name: "Romanian", nativeName: "Română" },
|
|
{ code: "ru", name: "Russian", nativeName: "Русский" },
|
|
{ code: "sr", name: "Serbian", nativeName: "Српски" },
|
|
{ code: "es-ES", name: "Spanish", nativeName: "Español" },
|
|
{ code: "sv-SE", name: "Swedish", nativeName: "Svenska" },
|
|
{ code: "th", name: "Thai", nativeName: "ไทย" },
|
|
{ code: "tr", name: "Turkish", nativeName: "Türkçe" },
|
|
{ code: "uk", name: "Ukrainian", nativeName: "Українська" },
|
|
{ code: "vi", name: "Vietnamese", nativeName: "Tiếng Việt" },
|
|
];
|
|
|
|
export function LanguageSwitcher() {
|
|
const { i18n, t } = useTranslation();
|
|
|
|
const handleLanguageChange = (value: string) => {
|
|
i18n.changeLanguage(value);
|
|
localStorage.setItem("i18nextLng", value);
|
|
};
|
|
|
|
return (
|
|
<div className="flex items-center gap-2 relative z-[99999]">
|
|
<Globe className="h-4 w-4 text-muted-foreground" />
|
|
<Select value={i18n.language} onValueChange={handleLanguageChange}>
|
|
<SelectTrigger className="w-[120px]">
|
|
<SelectValue placeholder={t("placeholders.language")} />
|
|
</SelectTrigger>
|
|
<SelectContent className="z-[99999]">
|
|
{languages.map((lang) => (
|
|
<SelectItem key={lang.code} value={lang.code}>
|
|
{lang.nativeName}
|
|
</SelectItem>
|
|
))}
|
|
</SelectContent>
|
|
</Select>
|
|
</div>
|
|
);
|
|
}
|