feat(i18n): localize footer widget

bas-kirill · Aug 30, 2024 · 4b05dd6 · 4b05dd6
1 parent c70c3e1
commit 4b05dd6
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 3 deletions.
diff --git a/client/src/i18n.ts b/client/src/i18n.ts
@@ -28,6 +28,8 @@ export const I18N_INSTRUMENT_BASIC_MATERIALS = "instrument.basic.materials";
 export const I18N_INSTRUMENT_DATE_FROM = "instrument.date.from";
 export const I18N_INSTRUMENT_DATE_TO = "instrument.date.to";
 
+export const I18N_FOOTER = "footer";
+
 const resources = {
   en: {
     translation: {
@@ -51,7 +53,9 @@ const resources = {
       [I18N_COUNTRY]: "Country",
       [I18N_INSTRUMENT_BASIC_MATERIALS]: "Basic Materials",
       [I18N_INSTRUMENT_DATE_FROM]: "From",
-      [I18N_INSTRUMENT_DATE_TO]: "To"
+      [I18N_INSTRUMENT_DATE_TO]: "To",
+
+      [I18N_FOOTER]: "Muse Group Frontend Academy",
     }
   },
   ru: {
@@ -76,7 +80,7 @@ const resources = {
       [I18N_COUNTRY]: "Страна",
       [I18N_INSTRUMENT_BASIC_MATERIALS]: "Основные материалы",
       [I18N_INSTRUMENT_DATE_FROM]: "С",
-      [I18N_INSTRUMENT_DATE_TO]: "По"
+      [I18N_INSTRUMENT_DATE_TO]: "По",
     }
   }
 };
@@ -86,6 +90,7 @@ i18n
   .init({
     resources,
     lng: window.navigator.language,
+    fallbackLng: "en",
     interpolation: {
       escapeValue: false // react already safes from xss
     }

diff --git a/client/src/widgets/footer/ui/Footer.widget.tsx b/client/src/widgets/footer/ui/Footer.widget.tsx
@@ -1,8 +1,11 @@
 import React from "react";
 import styles from "./styles/Footer.widget.module.css";
 import { useDarkMode } from "shared/dark-mode/use-dark-mode";
+import { useTranslation } from "react-i18next";
+import { I18N_FOOTER } from "../../../i18n";
 
 export function FooterWidget() {
+  const { t } = useTranslation();
   const { darkMode } = useDarkMode();
 
   return (
@@ -12,7 +15,7 @@ export function FooterWidget() {
     ${darkMode && styles.footer__dark}
   `}
     >
-      Muse Group Frontend Academy
+      {t(I18N_FOOTER)}
     </footer>
   );
 }