From ea318008cac106239bd971f1ca958558b5345304 Mon Sep 17 00:00:00 2001
From: Felix Mosheev <9304194+felixmosh@users.noreply.github.com>
Date: Mon, 14 Oct 2024 11:45:56 +0300
Subject: [PATCH] refactor: extract language watch to custom hook

---
 packages/ui/src/App.tsx                   | 17 ++++-------------
 packages/ui/src/hooks/useLanguageWatch.ts | 14 ++++++++++++++
 2 files changed, 18 insertions(+), 13 deletions(-)
 create mode 100644 packages/ui/src/hooks/useLanguageWatch.ts

diff --git a/packages/ui/src/App.tsx b/packages/ui/src/App.tsx
index 15ead92da..adb8e85ae 100644
--- a/packages/ui/src/App.tsx
+++ b/packages/ui/src/App.tsx
@@ -8,11 +8,9 @@ import { Loader } from './components/Loader/Loader';
 import { Menu } from './components/Menu/Menu';
 import { Title } from './components/Title/Title';
 import { useConfirm } from './hooks/useConfirm';
+import { useLanguageWatch } from './hooks/useLanguageWatch';
 import { useQueues } from './hooks/useQueues';
 import { useScrollTopOnNav } from './hooks/useScrollTopOnNav';
-import { useTranslation } from 'react-i18next';
-import { useSettingsStore } from './hooks/useSettings';
-import { ThemeProvider } from 'next-themes';
 
 const JobPageLazy = React.lazy(() =>
   import('./pages/JobPage/JobPage').then(({ JobPage }) => ({ default: JobPage }))
@@ -32,21 +30,14 @@ export const App = () => {
   useScrollTopOnNav();
   const { actions: queueActions } = useQueues();
   const { confirmProps } = useConfirm();
+  useLanguageWatch();
 
   useEffect(() => {
     queueActions.updateQueues();
   }, []);
 
-  const { i18n } = useTranslation();
-  const { language } = useSettingsStore();
-  useEffect(() => {
-    if (language && i18n.language !== language) {
-      i18n.changeLanguage(language);
-    }
-  }, [language]);
-
   return (
-    <ThemeProvider>
+    <>
       <Header>
         <Title />
         <HeaderActions />
@@ -66,6 +57,6 @@ export const App = () => {
       </main>
       <Menu />
       <ToastContainer />
-    </ThemeProvider>
+    </>
   );
 };
diff --git a/packages/ui/src/hooks/useLanguageWatch.ts b/packages/ui/src/hooks/useLanguageWatch.ts
new file mode 100644
index 000000000..5413f3c58
--- /dev/null
+++ b/packages/ui/src/hooks/useLanguageWatch.ts
@@ -0,0 +1,14 @@
+import { useEffect } from 'react';
+import { useTranslation } from 'react-i18next';
+import { useSettingsStore } from './useSettings';
+
+export function useLanguageWatch() {
+  const { i18n } = useTranslation();
+  const { language } = useSettingsStore();
+
+  useEffect(() => {
+    if (language && i18n.language !== language) {
+      i18n.changeLanguage(language);
+    }
+  }, [language]);
+}