add lang key into data provider

This commit is contained in:
maxim 2025-03-28 02:19:55 +03:00
parent 31886eaf0a
commit 754569b41d
2 changed files with 58 additions and 4 deletions

View File

@ -8,8 +8,12 @@ import Toolbar from '@mui/material/Toolbar'
import Typography from '@mui/material/Typography' import Typography from '@mui/material/Typography'
import {useGetIdentity, usePermissions} from '@refinedev/core' import {useGetIdentity, usePermissions} from '@refinedev/core'
import {HamburgerMenu, RefineThemedLayoutV2HeaderProps} from '@refinedev/mui' import {HamburgerMenu, RefineThemedLayoutV2HeaderProps} from '@refinedev/mui'
import React, {useContext} from 'react' import React, {useContext, useEffect} from 'react'
import {ColorModeContext} from '../../contexts/color-mode' 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 = { type IUser = {
id: number id: number
@ -19,17 +23,60 @@ type IUser = {
} }
export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({sticky = true}) => { export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({sticky = true}) => {
const navigate = useNavigate()
const {mode, setMode} = useContext(ColorModeContext) const {mode, setMode} = useContext(ColorModeContext)
const {data: user} = useGetIdentity<IUser>() const {data: user} = useGetIdentity<IUser>()
const {data: permissions} = usePermissions<string[]>() const {data: permissions} = usePermissions<string[]>()
const isAdmin = permissions?.includes('admin') 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 ( return (
<AppBar position={sticky ? 'sticky' : 'relative'}> <AppBar position={sticky ? 'sticky' : 'relative'}>
<Toolbar> <Toolbar>
<Stack direction="row" width="100%" justifyContent="flex-end" alignItems="center"> <Stack direction="row" width="100%" justifyContent="flex-end" alignItems="center">
<HamburgerMenu /> <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 <IconButton
color="inherit" color="inherit"
onClick={() => { onClick={() => {
@ -65,7 +112,7 @@ export const Header: React.FC<RefineThemedLayoutV2HeaderProps> = ({sticky = true
sm: 'inline-block', sm: 'inline-block',
}, },
backgroundColor: 'primary.main', backgroundColor: 'primary.main',
color: 'text.secondary', color: 'rgba(255, 255, 255, 0.7)',
padding: '1px 4px', padding: '1px 4px',
borderRadius: 1, borderRadius: 1,
fontSize: '0.6rem', fontSize: '0.6rem',

View File

@ -2,16 +2,23 @@ import dataProvider from '@refinedev/simple-rest'
import axios from 'axios' import axios from 'axios'
import {BACKEND_URL} from '../lib/constants' import {BACKEND_URL} from '../lib/constants'
import {TOKEN_KEY} from '../authProvider' import {TOKEN_KEY} from '../authProvider'
import Cookies from 'js-cookie'
const axiosInstance = axios.create() const axiosInstance = axios.create()
axiosInstance.interceptors.request.use((config) => { axiosInstance.interceptors.request.use((config) => {
// Добавляем токен авторизации
const token = localStorage.getItem(TOKEN_KEY) const token = localStorage.getItem(TOKEN_KEY)
if (token) { if (token) {
config.headers.Authorization = `Bearer ${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 return config
}) })