chore: add i18n

client/src/components/SiderMenu.tsx

@@ -1,5 +1,6 @@
 import { Divider, Menu, Tooltip } from 'antd';
 import React from 'react';
+import { useTranslation } from 'react-i18next';
 
 interface SiderMenuProps {
   collapsed: boolean;
@@ -12,6 +13,7 @@ export default function SiderMenu({
   selectedKey,
   hangleMenuClick,
 }: SiderMenuProps) {
+  const { t } = useTranslation();
   const collapseStyle = collapsed
     ? { fontSize: '12px' }
     : { fontSize: '12px', paddingLeft: '52px' };
@@ -37,7 +39,9 @@ export default function SiderMenu({
       icon: (
         <img src="./icons/sider/process-diagram.svg" alt="process diagram" />
       ),
-      label: <Tooltip title="Схемы процессов">Схемы процессов</Tooltip>,
+      label: (
+        <Tooltip title={t('processDiagrams')}>{t('processDiagrams')}</Tooltip>
+      ),
     },
     {
       key: '/running-processes',
@@ -47,7 +51,9 @@ export default function SiderMenu({
           alt="running processes"
         />
       ),
-      label: <Tooltip title="Запущенные процессы">Запущенные процессы</Tooltip>,
+      label: (
+        <Tooltip title={t('runningProcesses')}>{t('runningProcesses')}</Tooltip>
+      ),
     },
     !collapsed
       ? {
@@ -65,33 +71,33 @@ export default function SiderMenu({
     {
       key: 'sub1',
       icon: <img src="./icons/sider/settings.svg" alt="settings" />,
-      label: 'Настройки',
+      label: t('settings'),
       className: 'no-expand-icon',
       children: [
         {
           key: '/accounts',
           label: !collapsed ? (
-            <Tooltip title="Учетные записи">Учетные записи</Tooltip>
+            <Tooltip title={t('accounts')}>{t('accounts')}</Tooltip>
           ) : (
-            'Учетные записи'
+            t('accounts')
           ),
           style: collapseStyle,
         },
         {
           key: '/events-list',
           label: !collapsed ? (
-            <Tooltip title="Справочник событий">Справочник событий</Tooltip>
+            <Tooltip title={t('eventsList')}>{t('eventsList')}</Tooltip>
           ) : (
-            'Справочник событий'
+            t('eventsList')
           ),
           style: collapseStyle,
         },
         {
           key: '/configuration',
           label: !collapsed ? (
-            <Tooltip title="Конфигурация">Конфигурация</Tooltip>
+            <Tooltip title={t('configuration')}>{t('configuration')}</Tooltip>
           ) : (
-            'Конфигурация'
+            t('configuration')
           ),
           style: collapseStyle,
         },

client/src/index.tsx

@@ -3,17 +3,16 @@ import ReactDOM from 'react-dom/client';
 import './index.css';
 import App from './App';
 import { BrowserRouter } from 'react-router-dom';
-import { ConfigProvider } from 'antd';
-import { theme } from './config/customTheme';
+import AppWrapper from './config/AppWrapper';
 
 const root = ReactDOM.createRoot(
   document.getElementById('root') as HTMLElement
 );
 
 root.render(
-  <ConfigProvider theme={theme}>
+  <AppWrapper>
     <BrowserRouter>
       <App />
     </BrowserRouter>
-  </ConfigProvider>
+  </AppWrapper>
 );

client/src/pages/AccountsPage.tsx

@@ -2,8 +2,10 @@ import Header from '../components/Header';
 import { useState } from 'react';
 import ContentDrawer from '../components/ContentDrawer';
 import UserCreate from '../components/UserCreate';
+import { useTranslation } from 'react-i18next';
 
 export default function AccountsPage() {
+  const { t } = useTranslation();
   const [open, setOpen] = useState(false);
 
   const showDrawer = () => setOpen(true);
@@ -12,7 +14,7 @@ export default function AccountsPage() {
   return (
     <>
       <Header
-        title="Учетные записи"
+        title={t('accounts')}
         additionalContent={
           <img
             src="./icons/header/add_2.svg"