From 553f641408f9686e23c8081eb55e147e83dea6e0 Mon Sep 17 00:00:00 2001 From: martapanc Date: Sun, 27 Aug 2023 20:55:35 +0200 Subject: [PATCH] feat: fix language select appearance --- .../LanguageSwitcher/LanguageSwitcher.tsx | 114 +-- src/theme/index.ts | 40 +- yarn.lock | 940 +----------------- 3 files changed, 54 insertions(+), 1040 deletions(-) diff --git a/src/components/atoms/LanguageSwitcher/LanguageSwitcher.tsx b/src/components/atoms/LanguageSwitcher/LanguageSwitcher.tsx index e1a8f25..00bdb15 100644 --- a/src/components/atoms/LanguageSwitcher/LanguageSwitcher.tsx +++ b/src/components/atoms/LanguageSwitcher/LanguageSwitcher.tsx @@ -1,13 +1,10 @@ -import {InputLabel, MenuItem, Select, SelectChangeEvent} from '@mui/material'; +import { InputLabel, MenuItem, Select, SelectChangeEvent } from '@mui/material'; import FormControl from '@mui/material/FormControl'; -import {useEffect, useState} from 'react'; +import * as React from 'react'; +import { useEffect, useState } from 'react'; +import { HiLanguage } from 'react-icons/hi2'; import i18n from '@/app/(public)/i18n'; -import clsx from "clsx"; -import {commonStyles} from "@/components/buttons/ModeToggleButton"; -import * as React from "react"; -import {HiLanguage} from "react-icons/hi2"; -import {useTheme} from "next-themes"; export interface LanguageSwitcherProps { languages: LanguageDef[]; @@ -19,11 +16,8 @@ export interface LanguageDef { disabled?: boolean; } -const LanguageSwitcher = ({ languages } : LanguageSwitcherProps) => { - const { theme, resolvedTheme, setTheme } = useTheme(); - const isDarkMode = theme === 'dark'; - - const [mounted, setMounted] = useState(false); +const LanguageSwitcher = ({ languages }: LanguageSwitcherProps) => { + const [_, setMounted] = useState(false); // When mounted on client, now we can show the UI useEffect(() => setMounted(true), []); @@ -31,67 +25,35 @@ const LanguageSwitcher = ({ languages } : LanguageSwitcherProps) => { const [chosenLanguage, setChosenLanguage] = useState(''); const handleChange = (event: SelectChangeEvent) => { - console.log(i18n.language); const newLang = event.target.value; setChosenLanguage(newLang); i18n.changeLanguage(newLang); - console.log(i18n.language); }; - const changeLanguage = (event: React.ChangeEvent) => { - console.log(i18n.language); - const newLang = event.target.value; - setChosenLanguage(newLang); - - i18n.changeLanguage(newLang); - console.log(i18n.language); - }; - - const label = ; + const label = ; return ( -
- {/**/} - {/* {languages.map(*/} - {/* (lang: LanguageDef) =>*/} - {/* !lang.disabled && (*/} - {/* */} - {/* {lang.label}*/} - {/* */} - {/* )*/} - {/* )}*/} - {/**/} - - {/**/} - - +
+ {label}