Add spanish locale to mui ; fix localization issues

aelassas · Jan 14, 2025 · b965682 · b965682
1 parent 9649c41
commit b965682
Show file tree

Hide file tree

Showing 5 changed files with 13 additions and 11 deletions.
diff --git a/.gitignore b/.gitignore
@@ -3,3 +3,4 @@
 /**/*.pem
 /**/*.pem-chain
 /**/*.ca.pem
+/**/.DS_Store
diff --git a/backend/src/components/DatePicker.tsx b/backend/src/components/DatePicker.tsx
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'
 import { DatePicker as MuiDatePicker } from '@mui/x-date-pickers/DatePicker'
-import { fr, enUS } from 'date-fns/locale'
+import { fr, enUS, es } from 'date-fns/locale'
 import { TextFieldVariants } from '@mui/material'
 import { DateValidationError } from '@mui/x-date-pickers'
 
@@ -49,7 +49,7 @@ const DatePicker = ({
   }, [minDateValue])
 
   return (
-    <LocalizationProvider adapterLocale={language === 'fr' ? fr : enUS} dateAdapter={AdapterDateFns}>
+    <LocalizationProvider adapterLocale={language === 'fr' ? fr : language === 'es' ? es : enUS} dateAdapter={AdapterDateFns}>
       <MuiDatePicker
         label={label}
         views={['year', 'month', 'day']}

diff --git a/backend/src/components/DateTimePicker.tsx b/backend/src/components/DateTimePicker.tsx
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'
 import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns'
 import { LocalizationProvider } from '@mui/x-date-pickers/LocalizationProvider'
 import { DateTimePicker as MuiDateTimePicker } from '@mui/x-date-pickers/DateTimePicker'
-import { fr, enUS } from 'date-fns/locale'
+import { fr, enUS, es } from 'date-fns/locale'
 import { TextFieldVariants } from '@mui/material'
 import { DateTimeValidationError, PickersActionBarAction } from '@mui/x-date-pickers'
 
@@ -46,7 +46,7 @@ const DateTimePicker = ({
   }
 
   return (
-    <LocalizationProvider adapterLocale={language === 'fr' ? fr : enUS} dateAdapter={AdapterDateFns}>
+    <LocalizationProvider adapterLocale={language === 'fr' ? fr : language === 'es' ? es : enUS} dateAdapter={AdapterDateFns}>
       <MuiDateTimePicker
         label={label}
         value={value}

diff --git a/backend/src/lang/master.ts b/backend/src/lang/master.ts
@@ -15,7 +15,7 @@ const strings = new LocalizedStrings({
     VALIDATION_EMAIL_ERROR: 'An error occurred while sending validation email.',
   },
   es: {
-    VALIDATE_EMAIL: "Se ha enviado un correo electrónico de validación a su dirección de correo electrónico. Por favor, revise su bandeja de entrada y valide su cuenta haciendo clic en el enlace del correo electrónico. Expirará después de un día. Si no recibió el correo electrónico de validación, haga clic en reenviar.",
+    VALIDATE_EMAIL: 'Se ha enviado un correo electrónico de validación a su dirección de correo electrónico. Por favor, revise su bandeja de entrada y valide su cuenta haciendo clic en el enlace del correo electrónico. Expirará después de un día. Si no recibió el correo electrónico de validación, haga clic en reenviar.',
     RESEND: 'Reenviar',
     VALIDATION_EMAIL_SENT: 'Correo electrónico de validación enviado.',
     VALIDATION_EMAIL_ERROR: 'Se produjo un error al enviar el correo electrónico de validación.',

diff --git a/backend/src/main.tsx b/backend/src/main.tsx
@@ -4,9 +4,9 @@ import { createTheme, ThemeProvider } from '@mui/material/styles'
 import CssBaseline from '@mui/material/CssBaseline'
 import { ToastContainer } from 'react-toastify'
 
-import { frFR as corefrFR, enUS as coreenUS } from '@mui/material/locale'
-import { frFR, enUS } from '@mui/x-date-pickers/locales'
-import { frFR as dataGridfrFR, enUS as dataGridenUS } from '@mui/x-data-grid/locales'
+import { frFR as corefrFR, enUS as coreenUS, esES as coresES } from '@mui/material/locale'
+import { frFR, enUS, esES } from '@mui/x-date-pickers/locales'
+import { frFR as dataGridfrFR, enUS as dataGridenUS, esES as dataGridesEs } from '@mui/x-data-grid/locales'
 import { disableDevTools } from ':disable-react-devtools'
 import * as helper from '@/common/helper'
 import * as UserService from '@/services/UserService'
@@ -66,6 +66,7 @@ if (lang) {
 
 language = UserService.getLanguage()
 const isFr = language === 'fr'
+const isEs = language === 'es'
 
 const theme = createTheme(
   {
@@ -93,9 +94,9 @@ const theme = createTheme(
       },
     },
   },
-  isFr ? frFR : enUS,
-  isFr ? dataGridfrFR : dataGridenUS,
-  isFr ? corefrFR : coreenUS,
+  isFr ? frFR : isEs ? esES : enUS,
+  isFr ? dataGridfrFR : isEs ? dataGridesEs : dataGridenUS,
+  isFr ? corefrFR : isEs ? coresES : coreenUS,
 )
 
 ReactDOM.createRoot(document.getElementById('root')!).render(