From 5c9a29570cc80a977b2e345a3f120a88ba4fc76b Mon Sep 17 00:00:00 2001
From: Andrey Babushkin <55714097+reyand43@users.noreply.github.com>
Date: Fri, 7 Mar 2025 10:43:08 +0100
Subject: [PATCH] Add lokalisation (#3104)

* applied eslint

* add locales and lint the project

* removed error boundary

* updated locales

* fix min files

* fix locales

* fix erorrs

* fix errors
---
 .../Controls/AssistSessionsModal/AssistSessionsModal.tsx      | 2 +-
 .../LiveSessionReloadButton/LiveSessionReloadButton.tsx       | 4 +++-
 frontend/app/components/shared/ReloadButton/ReloadButton.tsx  | 4 +++-
 .../components/SessionSort/SessionSort.tsx                    | 2 +-
 frontend/app/layout/SideMenu.tsx                              | 4 ++--
 5 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/frontend/app/components/Session_/Player/Controls/AssistSessionsModal/AssistSessionsModal.tsx b/frontend/app/components/Session_/Player/Controls/AssistSessionsModal/AssistSessionsModal.tsx
index 9a1e71890..b2d4fa1cf 100644
--- a/frontend/app/components/Session_/Player/Controls/AssistSessionsModal/AssistSessionsModal.tsx
+++ b/frontend/app/components/Session_/Player/Controls/AssistSessionsModal/AssistSessionsModal.tsx
@@ -70,7 +70,7 @@ function AssistSessionsModal(props: ConnectProps) {
     <div className="bg-gray-lightest box-shadow h-screen p-4">
       <div className="flex flex-col my-2 w-full gap-2 ">
         <div className="flex items-center gap-2 w-full">
-          <Tooltip title="Refresh" placement="top" delay={200}>
+          <Tooltip title={t('Refresh')} placement="top" delay={200}>
             <Button
               loading={loading}
               className="mr-2"
diff --git a/frontend/app/components/shared/LiveSessionReloadButton/LiveSessionReloadButton.tsx b/frontend/app/components/shared/LiveSessionReloadButton/LiveSessionReloadButton.tsx
index c149c70da..c780d6f2b 100644
--- a/frontend/app/components/shared/LiveSessionReloadButton/LiveSessionReloadButton.tsx
+++ b/frontend/app/components/shared/LiveSessionReloadButton/LiveSessionReloadButton.tsx
@@ -2,17 +2,19 @@ import React from 'react';
 import { useStore } from 'App/mstore';
 import { observer } from 'mobx-react-lite';
 import ReloadButton from '../ReloadButton';
+import { useTranslation } from 'react-i18next';
 
 interface Props {
   onClick: () => void;
 }
 
 function LiveSessionReloadButton(props: Props) {
+  const { t } = useTranslation();
   const { sessionStore } = useStore();
   const { onClick } = props;
   const loading = sessionStore.loadingLiveSessions;
   return (
-    <ReloadButton label={'Refresh'} buttonSize={'small'} iconSize={14} loading={loading} onClick={onClick} className="cursor-pointer" />
+    <ReloadButton label={t('Refresh')} buttonSize={'small'} iconSize={14} loading={loading} onClick={onClick} className="cursor-pointer" />
   );
 }
 
diff --git a/frontend/app/components/shared/ReloadButton/ReloadButton.tsx b/frontend/app/components/shared/ReloadButton/ReloadButton.tsx
index c7855d060..a165a1cb2 100644
--- a/frontend/app/components/shared/ReloadButton/ReloadButton.tsx
+++ b/frontend/app/components/shared/ReloadButton/ReloadButton.tsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import { Button, Tooltip } from 'antd';
 import { SyncOutlined } from '@ant-design/icons';
+import { useTranslation } from 'react-i18next';
 
 interface Props {
   loading?: boolean;
@@ -10,9 +11,10 @@ interface Props {
   label?: string
 }
 export default function ReloadButton(props: Props) {
+  const { t } = useTranslation();
   const { loading, onClick, iconSize = 18, buttonSize } = props;
   return (
-    <Tooltip title="Refresh" placement="right">
+    <Tooltip title={t('Refresh')} placement="right">
       <Button
         type="default"
         size={buttonSize}
diff --git a/frontend/app/components/shared/SessionsTabOverview/components/SessionSort/SessionSort.tsx b/frontend/app/components/shared/SessionsTabOverview/components/SessionSort/SessionSort.tsx
index 4597ff30c..fe5e9c208 100644
--- a/frontend/app/components/shared/SessionsTabOverview/components/SessionSort/SessionSort.tsx
+++ b/frontend/app/components/shared/SessionsTabOverview/components/SessionSort/SessionSort.tsx
@@ -66,7 +66,7 @@ function SessionSort() {
     <SortDropdown
       defaultOption={defaultOption}
       onSort={onSort}
-      sortOptions={sortOptions}
+      sortOptions={sortOptions(t)}
       current={sortOptionsMap(t)[defaultOption]}
     />
   );
diff --git a/frontend/app/layout/SideMenu.tsx b/frontend/app/layout/SideMenu.tsx
index 37dc850cc..28df5adfe 100644
--- a/frontend/app/layout/SideMenu.tsx
+++ b/frontend/app/layout/SideMenu.tsx
@@ -49,7 +49,7 @@ function SideMenu(props: Props) {
   const { isEnterprise } = userStore;
   const { siteId } = projectsStore;
   const { isMobile } = projectsStore;
-  const { t } = useTranslation();
+  const { t, i18n } = useTranslation();
 
   const menu: any[] = React.useMemo(() => {
     const sourceMenu = isPreferencesActive ? preferences(t) : main_menu(t);
@@ -116,7 +116,7 @@ function SideMenu(props: Props) {
           hidden: allItemsHidden,
         };
       });
-  }, [isAdmin, isEnterprise, isPreferencesActive, modules, spotOnly, siteId]);
+  }, [isAdmin, isEnterprise, isPreferencesActive, modules, spotOnly, siteId, i18n.language]);
 
   const menuRoutes: any = {
     [MENU.EXIT]: () =>