diff --git a/client/package-lock.json b/client/package-lock.json index 7462d95d7..850a2b149 100644 --- a/client/package-lock.json +++ b/client/package-lock.json @@ -1,12 +1,12 @@ { "name": "client", - "version": "0.0.0", + "version": "3.6.1", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "client", - "version": "0.0.0", + "version": "3.6.1", "dependencies": { "@emotion/react": "^11.13.3", "@emotion/styled": "^11.13.0", @@ -20,7 +20,6 @@ "@types/maplibre-gl": "^1.13.2", "axios": "^1.7.4", "dayjs": "1.11.13", - "flag-icons": "7.3.2", "html2canvas": "^1.4.1", "human-interval": "2.0.1", "i18next": "25.4.2", @@ -3891,10 +3890,6 @@ "url": "https://github.com/sponsors/sindresorhus" } }, - "node_modules/flag-icons": { - "version": "7.3.2", - "license": "MIT" - }, "node_modules/flat-cache": { "version": "3.2.0", "dev": true, diff --git a/client/package.json b/client/package.json index 783f7e045..a09e89c4c 100644 --- a/client/package.json +++ b/client/package.json @@ -28,7 +28,6 @@ "@types/maplibre-gl": "^1.13.2", "axios": "^1.7.4", "dayjs": "1.11.13", - "flag-icons": "7.3.2", "html2canvas": "^1.4.1", "human-interval": "2.0.1", "i18next": "25.4.2", diff --git a/client/src/Components/inputs/LanguageSelector.tsx b/client/src/Components/inputs/LanguageSelector.tsx index a6d52a555..5cd96f857 100644 --- a/client/src/Components/inputs/LanguageSelector.tsx +++ b/client/src/Components/inputs/LanguageSelector.tsx @@ -1,26 +1,33 @@ -import Stack from "@mui/material/Stack"; -import Box from "@mui/material/Box"; import MenuItem from "@mui/material/MenuItem"; import { Select } from "@/Components/inputs"; -import "flag-icons/css/flag-icons.min.css"; import { useTranslation } from "react-i18next"; -import { useTheme } from "@mui/material"; import { useSelector } from "react-redux"; import { useDispatch } from "react-redux"; import { setLanguage } from "@/Features/UI/uiSlice"; import type { RootState } from "@/Types/state"; -const langMap: Record = { - cs: "cz", - ja: "jp", - uk: "ua", - vi: "vn", +const languageNames: Record = { + en: "English", + de: "Deutsch", + es: "Español", + fr: "Français", + "pt-BR": "Português (BR)", + cs: "Čeština", + fi: "Suomi", + tr: "Türkçe", + ru: "Русский", + uk: "Українська", + ar: "العربية", + th: "ไทย", + vi: "Tiếng Việt", + ja: "日本語", + "zh-CN": "简体中文", + "zh-TW": "繁體中文", }; export const LanguageSelector = () => { const { i18n } = useTranslation(); - const theme = useTheme(); const { language = "en" } = useSelector((state: RootState) => state.ui); const dispatch = useDispatch(); const handleChange = (event: any) => { @@ -35,64 +42,15 @@ export const LanguageSelector = () => { value={language} onChange={handleChange} size="small" - // sx={{ - // minWidth: 80, - // "& .MuiSelect-select": { - // display: "flex", - // alignItems: "center", - // justifyContent: "center", - // }, - // "& .MuiSelect-icon": { - // alignSelf: "center", - // }, - // }} > - {languages.map((lang) => { - let parsedLang = lang === "en" ? "gb" : lang; - - if (parsedLang.includes("-")) { - parsedLang = parsedLang.split("-")[1].toLowerCase(); - } - - parsedLang = langMap[parsedLang] || parsedLang; - - const flag = parsedLang ? `fi fi-${parsedLang}` : null; - - return ( - - - - {flag && } - - - {lang} - - - - ); - })} + {languages.map((lang) => ( + + {languageNames[lang] ?? lang} + + ))} ); };