Merge pull request #356 from shahzod418/language-detector

Language detector
hexlet-rus · Sep 11, 2023 · e17e19d · e17e19d
2 parents cd87f40 + a6f201d
commit e17e19d
Show file tree

Hide file tree

Showing 6 changed files with 55 additions and 13 deletions.
diff --git a/frontend/package.json b/frontend/package.json
@@ -13,6 +13,7 @@
     "clipboard": "^2.0.11",
     "formik": "^2.4.2",
     "i18next": "^23.4.1",
+    "i18next-browser-languagedetector": "^7.1.0",
     "punycode": "^2.3.0",
     "react": "^18.2.0",
     "react-autowidth-input": "^1.0.9",

diff --git a/frontend/src/application.jsx b/frontend/src/application.jsx
@@ -1,24 +1,18 @@
 import { configureStore } from '@reduxjs/toolkit';
 import * as Sentry from '@sentry/react';
-import i18next from 'i18next';
-import { initReactI18next } from 'react-i18next';
 import { Provider } from 'react-redux';
 import { BrowserRouter } from 'react-router-dom';
 
 import AppRoutes from './AppRoutes.jsx';
 import ModalWindow from './components/Modals';
-import resources from './locales';
 import AuthProvider from './providers/AuthProvider.jsx';
 import SnippetsProvider from './providers/SnippetsProvider.jsx';
 import { rootReducer } from './slices';
+import { initI18next } from './initI18next.js';
 
 export default async () => {
-  const defaultLanguage = 'ru';
-  await i18next.use(initReactI18next).init({
-    lng: defaultLanguage,
-    debug: false,
-    resources,
-  });
+  await initI18next();
+
   const store = configureStore({
     reducer: rootReducer,
   });

diff --git a/frontend/src/hooks/useLanguage.js b/frontend/src/hooks/useLanguage.js
@@ -1,10 +1,7 @@
 import { useTranslation } from 'react-i18next';
 import { useLayoutEffect, useState } from 'react';
 
-const AVAILABLE_LANGUAGES = ['en', 'ru'];
-if (process.env.NODE_ENV !== 'production') {
-  AVAILABLE_LANGUAGES.push('dev');
-}
+import { AVAILABLE_LANGUAGES } from '../initI18next';
 
 const useLanguage = () => {
   const { i18n } = useTranslation();

diff --git a/frontend/src/initI18next.js b/frontend/src/initI18next.js
@@ -0,0 +1,28 @@
+import i18next from 'i18next';
+import LanguageDetector from 'i18next-browser-languagedetector';
+import { initReactI18next } from 'react-i18next';
+
+import resources from './locales';
+
+const defaultLanguage = 'ru';
+const baseI18NextConfig = {
+  debug: process.env.NODE_ENV === 'development',
+  resources,
+};
+
+export const AVAILABLE_LANGUAGES = ['en', 'ru'];
+
+export const initI18next = async () => {
+  if (process.env.REACT_APP_NODE_ENV === 'test') {
+    await i18next
+      .use(initReactI18next)
+      .init({ ...baseI18NextConfig, lng: defaultLanguage });
+
+    return;
+  }
+
+  await i18next
+    .use(LanguageDetector)
+    .use(initReactI18next)
+    .init({ ...baseI18NextConfig, fallbackLng: defaultLanguage });
+};
diff --git a/playwright.config.ts b/playwright.config.ts
@@ -91,5 +91,8 @@ export default defineConfig({
     command: 'npm run start',
     port: 3000,
     reuseExistingServer: !process.env.CI,
+    env: {
+      REACT_APP_NODE_ENV: 'test'
+    }
   },
 });
diff --git a/yarn.lock b/yarn.lock
@@ -1099,6 +1099,13 @@
   dependencies:
     regenerator-runtime "^0.13.11"
 
+"@babel/runtime@^7.19.4":
+  version "7.22.11"
+  resolved "https://registry.yarnpkg.com/@babel/runtime/-/runtime-7.22.11.tgz#7a9ba3bbe406ad6f9e8dd4da2ece453eb23a77a4"
+  integrity sha512-ee7jVNlWN09+KftVOu9n7S8gQzD/Z6hN/I8VBRXW4P1+Xe7kJGXMwu8vds4aGIMHZnNbdpSWCfZZtinytpcAvA==
+  dependencies:
+    regenerator-runtime "^0.14.0"
+
 "@babel/template@^7.18.10", "@babel/template@^7.20.7", "@babel/template@^7.3.3":
   version "7.20.7"
   resolved "https://registry.npmjs.org/@babel/template/-/template-7.20.7.tgz"
@@ -8279,6 +8286,13 @@ humanize-ms@^1.2.1:
   dependencies:
     ms "^2.0.0"
 
+i18next-browser-languagedetector@^7.1.0:
+  version "7.1.0"
+  resolved "https://registry.yarnpkg.com/i18next-browser-languagedetector/-/i18next-browser-languagedetector-7.1.0.tgz#01876fac51f86b78975e79b48ccb62e2313a2d7d"
+  integrity sha512-cr2k7u1XJJ4HTOjM9GyOMtbOA47RtUoWRAtt52z43r3AoMs2StYKyjS3URPhzHaf+mn10hY9dZWamga5WPQjhA==
+  dependencies:
+    "@babel/runtime" "^7.19.4"
+
 i18next@^23.4.1:
   version "23.4.1"
   resolved "https://registry.yarnpkg.com/i18next/-/i18next-23.4.1.tgz#11fe0db92ac8a4125934960ebccf6a5f8ed6b9fc"
@@ -13727,6 +13741,11 @@ regenerator-runtime@^0.13.11, regenerator-runtime@^0.13.9:
   resolved "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz"
   integrity sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==
 
+regenerator-runtime@^0.14.0:
+  version "0.14.0"
+  resolved "https://registry.yarnpkg.com/regenerator-runtime/-/regenerator-runtime-0.14.0.tgz#5e19d68eb12d486f797e15a3c6a918f7cec5eb45"
+  integrity sha512-srw17NI0TUWHuGa5CFGGmhfNIeja30WMBfbslPNhf6JrqQlLN5gcrvig1oqPxiVaXb0oW0XRKtH6Nngs5lKCIA==
+
 regenerator-transform@^0.15.1:
   version "0.15.1"
   resolved "https://registry.npmjs.org/regenerator-transform/-/regenerator-transform-0.15.1.tgz"