updated language name to full name in options

asyncapi · Feb 10, 2025 · e1e0e10 · e1e0e10
1 parent 2547f5f
commit e1e0e10
Show file tree

Hide file tree

Showing 3 changed files with 19 additions and 10 deletions.
diff --git a/components/languageSelector/LanguageSelect.tsx b/components/languageSelector/LanguageSelect.tsx
@@ -11,7 +11,12 @@ import IconLanguage from '../icons/Language';
  * @param {Array} [props.options=[]] - An array of options for the select dropdown.
  * @param {string} props.selected - The currently selected option value.
  */
-export default function LanguageSelect({ className = '', onChange = () => {}, options = [], selected }: SelectProps) {
+export default function LanguageSelect({ className = '', onChange = () => { }, options = [], selected }: SelectProps) {
+  const langMap: { [key: string]: string } = {
+    en: 'English',
+    de: 'Deutsch'
+  };
+
   return (
     <div className='relative inline-block'>
       <div className='relative flex items-center gap-2'>
@@ -27,7 +32,7 @@ export default function LanguageSelect({ className = '', onChange = () => {}, op
         >
           {options.map((option, index) => (
             <option key={index} value={option.value} data-testid='Option-form'>
-              {option.text}
+              {langMap[option.text.toLowerCase()] || option.text}
             </option>
           ))}
         </select>

diff --git a/components/navigation/MobileNavMenu.tsx b/components/navigation/MobileNavMenu.tsx
@@ -30,7 +30,7 @@ interface MobileNavMenuProps {
  * @param {MobileNavMenuProps} props - The props for the MobileNavMenu component.
  */
 export default function MobileNavMenu({
-  onClickClose = () => {},
+  onClickClose = () => { },
   uniqueLangs,
   currentLanguage,
   changeLanguage
@@ -50,6 +50,11 @@ export default function MobileNavMenu({
     setOpen(menu);
   }
 
+  const langMap: { [key: string]: string } = {
+    en: 'English',
+    de: 'Deutsch'
+  };
+
   return (
     <div className='fixed inset-x-0 top-0 z-60 max-h-full origin-top-right overflow-y-auto py-2 transition lg:hidden'>
       <div className='rounded-lg shadow-lg'>
@@ -153,7 +158,7 @@ export default function MobileNavMenu({
                       className={`mb-4 ml-2 block w-full rounded-lg py-1 text-start text-sm font-medium leading-6 text-gray-700 transition duration-150 ease-in-out hover:bg-gray-50 ${currentLanguage.toLowerCase() === lang.text.toLowerCase() ? 'text-secondary-500' : ''}`}
                       data-testid='MobileNav-language-item'
                     >
-                      {lang.text}
+                      {langMap[lang.text.toLowerCase()] || lang.text}
                     </button>
                   ))}
               </div>

diff --git a/components/navigation/NavBar.tsx b/components/navigation/NavBar.tsx
@@ -55,11 +55,10 @@ export default function NavBar({ className = '', hideLogo = false }: NavBarProps
 
     // Filter unique languages based on i18nPaths that include the modified pathnameWithoutLocale
     const uniqueLangs = Object.keys(i18nPaths)
-      .filter((lang) => i18nPaths[lang].includes(pathnameWithoutLocale))
-      .map((lang) => lang.toUpperCase());
+      .filter((lang) => i18nPaths[lang].includes(pathnameWithoutLocale));
 
-    // If no unique languages are found, default to ["EN"]
-    return uniqueLangs.length === 0 ? ['EN'] : uniqueLangs;
+    // If no unique languages are found, default to ['en']
+    return uniqueLangs.length === 0 ? ['en'] : uniqueLangs;
   };
 
   const uniqueLangs = getUniqueLangs().map((lang) => ({
@@ -233,7 +232,7 @@ export default function NavBar({ className = '', hideLogo = false }: NavBarProps
                 changeLanguage(value.toLowerCase(), true);
               }}
               className=''
-              selected={i18n.language ? i18n.language.toUpperCase() : 'EN'}
+              selected={i18n.language ? i18n.language : 'en'}
             />
 
             <GithubButton
@@ -251,7 +250,7 @@ export default function NavBar({ className = '', hideLogo = false }: NavBarProps
         <MobileNavMenu
           onClickClose={() => setMobileMenuOpen(false)}
           uniqueLangs={uniqueLangs}
-          currentLanguage={i18n.language ? i18n.language.toUpperCase() : 'EN'}
+          currentLanguage={i18n.language ? i18n.language : 'en'}
           changeLanguage={changeLanguage}
         />
       )}