From 754569b41da3aa689f84997dc2b922a93da474fc Mon Sep 17 00:00:00 2001
From: maxim <bozzhik@ya.ru>
Date: Fri, 28 Mar 2025 02:19:55 +0300
Subject: [PATCH] add `lang` key into `data` provider

---
 src/components/header/index.tsx | 53 +++++++++++++++++++++++++++++++--
 src/providers/data.ts           |  9 +++++-
 2 files changed, 58 insertions(+), 4 deletions(-)

diff --git a/src/components/header/index.tsx b/src/components/header/index.tsx
index 4d408e8..8ae5cf5 100644
--- a/src/components/header/index.tsx
+++ b/src/components/header/index.tsx
@@ -8,8 +8,12 @@ import Toolbar from '@mui/material/Toolbar'
 import Typography from '@mui/material/Typography'
 import {useGetIdentity, usePermissions} from '@refinedev/core'
 import {HamburgerMenu, RefineThemedLayoutV2HeaderProps} from '@refinedev/mui'
-import React, {useContext} from 'react'
+import React, {useContext, useEffect} from 'react'
 import {ColorModeContext} from '../../contexts/color-mode'
+import Cookies from 'js-cookie'
+import {useTranslation} from 'react-i18next'
+import {Button} from '@mui/material'
+import {useNavigate} from 'react-router'
 
 type IUser = {
   id: number
@@ -19,17 +23,60 @@ type IUser = {
 }
 
 export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({sticky = true}) => {
+  const navigate = useNavigate()
   const {mode, setMode} = useContext(ColorModeContext)
   const {data: user} = useGetIdentity<IUser>()
   const {data: permissions} = usePermissions<string[]>()
   const isAdmin = permissions?.includes('admin')
+  const {i18n} = useTranslation()
+
+  // Установка языка по умолчанию из куки или ru
+  useEffect(() => {
+    const savedLang = Cookies.get('lang') || 'ru'
+    i18n.changeLanguage(savedLang)
+  }, [i18n])
+
+  const handleLanguageChange = (lang: string) => {
+    Cookies.set('lang', lang)
+    i18n.changeLanguage(lang)
+
+    navigate(0)
+    // Альтернативный вариант - переход на тот же URL
+    // navigate(location.pathname + location.search, { replace: true })
+  }
 
   return (
     <AppBar position={sticky ? 'sticky' : 'relative'}>
       <Toolbar>
         <Stack direction="row" width="100%" justifyContent="flex-end" alignItems="center">
           <HamburgerMenu />
-          <Stack direction="row" width="100%" justifyContent="flex-end" alignItems="center">
+          <Stack direction="row" width="100%" justifyContent="flex-end" alignItems="center" spacing={2}>
+            <Stack
+              direction="row"
+              spacing={1}
+              sx={{
+                backgroundColor: 'background.paper',
+                padding: '4px',
+                borderRadius: '4px',
+              }}
+            >
+              {['ru', 'en', 'zh'].map((lang) => (
+                <Button
+                  key={lang}
+                  onClick={() => handleLanguageChange(lang)}
+                  variant={i18n.language === lang ? 'contained' : 'outlined'}
+                  size="small"
+                  sx={{
+                    minWidth: '30px',
+                    padding: '2px 0px',
+                    textTransform: 'uppercase',
+                  }}
+                >
+                  {lang}
+                </Button>
+              ))}
+            </Stack>
+
             <IconButton
               color="inherit"
               onClick={() => {
@@ -65,7 +112,7 @@ export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({sticky = true
                           sm: 'inline-block',
                         },
                         backgroundColor: 'primary.main',
-                        color: 'text.secondary',
+                        color: 'rgba(255, 255, 255, 0.7)',
                         padding: '1px 4px',
                         borderRadius: 1,
                         fontSize: '0.6rem',
diff --git a/src/providers/data.ts b/src/providers/data.ts
index a1da391..eb56cbd 100644
--- a/src/providers/data.ts
+++ b/src/providers/data.ts
@@ -2,16 +2,23 @@ import dataProvider from '@refinedev/simple-rest'
 import axios from 'axios'
 import {BACKEND_URL} from '../lib/constants'
 import {TOKEN_KEY} from '../authProvider'
+import Cookies from 'js-cookie'
 
 const axiosInstance = axios.create()
 
 axiosInstance.interceptors.request.use((config) => {
+  // Добавляем токен авторизации
   const token = localStorage.getItem(TOKEN_KEY)
-
   if (token) {
     config.headers.Authorization = `Bearer ${token}`
   }
 
+  // Добавляем язык в кастомный заголовок
+  const lang = Cookies.get('lang') || 'ru'
+  config.headers['X-Language'] = lang // или 'Accept-Language'
+
+  // console.log('Request headers:', config.headers)
+
   return config
 })