fix: handle unsupported locale without errors

felixmosh · Nov 13, 2024 · 64ee653 · 64ee653
1 parent 0f2a40b
commit 64ee653
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 5 deletions.
diff --git a/packages/ui/src/components/SettingsModal/SettingsModal.tsx b/packages/ui/src/components/SettingsModal/SettingsModal.tsx
@@ -1,5 +1,6 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
+import { languages } from '../../constants/languages';
 import { useSettingsStore } from '../../hooks/useSettings';
 import { useUIConfig } from '../../hooks/useUIConfig';
 import { InputField } from '../Form/InputField/InputField';
@@ -15,7 +16,6 @@ export interface SettingsModalProps {
 }
 
 const pollingIntervals = [-1, 3, 5, 10, 20, 60, 60 * 5, 60 * 15];
-const languages = ['en-US', 'es-ES', 'fr-FR', 'pt-BR', 'zh-CN'];
 const maxJobsPerPage = 300;
 
 export const SettingsModal = ({ open, onClose }: SettingsModalProps) => {

diff --git a/packages/ui/src/constants/languages.ts b/packages/ui/src/constants/languages.ts
@@ -0,0 +1 @@
+export const languages = ['en-US', 'es-ES', 'fr-FR', 'pt-BR', 'zh-CN'] as const;
diff --git a/packages/ui/src/services/i18n.ts b/packages/ui/src/services/i18n.ts
@@ -2,6 +2,7 @@ import i18n from 'i18next';
 import HttpBackend from 'i18next-http-backend';
 import { initReactI18next } from 'react-i18next';
 import enLocale from 'date-fns/locale/en-US';
+import { languages } from '../constants/languages';
 
 export let dateFnsLocale = enLocale;
 const dateFnsLocaleMap = {
@@ -22,6 +23,9 @@ async function setDateFnsLocale(lng: string) {
 }
 
 export async function initI18n({ lng, basePath }: { lng: string; basePath: string }) {
+  const fallbackLng = 'en-US';
+  const supportedLanguage = languages.find((language) => language === lng) || fallbackLng;
+
   const i18nextInstance = i18n
     .use(initReactI18next) // passes i18n down to react-i18next
     .use(HttpBackend);
@@ -33,12 +37,12 @@ export async function initI18n({ lng, basePath }: { lng: string; basePath: strin
     (window as any).testI18n = (lng = 'cimode') => i18nextInstance.changeLanguage(lng);
   }
 
-  i18nextInstance.on('languageChanged', (lng) => setDateFnsLocale(lng));
-  await setDateFnsLocale(lng);
+  i18nextInstance.on('languageChanged', (newLanguage) => setDateFnsLocale(newLanguage));
+  await setDateFnsLocale(supportedLanguage);
 
   return i18nextInstance.init({
-    lng,
-    fallbackLng: 'en-US',
+    lng: supportedLanguage,
+    fallbackLng,
     defaultNS: 'messages',
     ns: 'messages',
     load: 'currentOnly',