122 lines
3.1 KiB
TypeScript
122 lines
3.1 KiB
TypeScript
import { Box, Typography } from '@mui/material';
|
|
import { useLocation } from 'react-router-dom';
|
|
import { useMemo } from 'react';
|
|
|
|
interface HeaderConfig {
|
|
title: string;
|
|
subtitle: string;
|
|
hidden?: boolean;
|
|
}
|
|
|
|
export default function PageHeader() {
|
|
const location = useLocation();
|
|
|
|
const headerConfig: HeaderConfig | null = useMemo(() => {
|
|
const path = location.pathname;
|
|
|
|
// Страницы без заголовка
|
|
if (
|
|
path === '/login' ||
|
|
path === '/registration' ||
|
|
path === '/marketplace' ||
|
|
path === '/profile' ||
|
|
path.startsWith('/launch')
|
|
) {
|
|
return { title: '', subtitle: '', hidden: true };
|
|
}
|
|
|
|
if (path === '/news') {
|
|
return {
|
|
title: 'Новости',
|
|
subtitle: 'Последние обновления лаунчера, сервера и ивентов',
|
|
};
|
|
}
|
|
|
|
if (path === '/') {
|
|
return {
|
|
title: 'Выбор версию клиента',
|
|
subtitle: 'Выберите установленную версию или добавьте новую сборку',
|
|
};
|
|
}
|
|
|
|
if (path.startsWith('/daily')) {
|
|
return {
|
|
title: 'Ежедневные награды',
|
|
subtitle: 'Ежедневный вход на сервер приносит бонусы и полезные награды!',
|
|
};
|
|
}
|
|
|
|
if (path.startsWith('/profile')) {
|
|
return {
|
|
title: 'Профиль пользователя',
|
|
subtitle: 'Профиль пользователя для личных настроек',
|
|
};
|
|
}
|
|
|
|
if (path.startsWith('/shop')) {
|
|
return {
|
|
title: 'Внутриигровой магазин',
|
|
subtitle: 'Тратьте свою уникалькую, виртуальную валюту - Попы!',
|
|
};
|
|
}
|
|
|
|
if (path.startsWith('/marketplace')) {
|
|
return {
|
|
title: 'Маркетплейс',
|
|
subtitle: 'Покупайте или продавайте - торговая площадка между игроками',
|
|
};
|
|
}
|
|
|
|
// Дефолт на всякий случай
|
|
return {
|
|
title: 'test',
|
|
subtitle: 'test',
|
|
};
|
|
}, [location.pathname]);
|
|
|
|
if (!headerConfig || headerConfig.hidden) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<Box
|
|
sx={{
|
|
width: '100%',
|
|
maxWidth: '85%',
|
|
mt: '10vh',
|
|
mb: '2vh',
|
|
display: 'flex',
|
|
flexDirection: 'column',
|
|
alignItems: 'flex-start',
|
|
pointerEvents: 'none',
|
|
}}
|
|
>
|
|
<Typography
|
|
variant="h3"
|
|
sx={{
|
|
fontFamily: 'Benzin-Bold',
|
|
fontSize: '3vw',
|
|
backgroundImage:
|
|
'linear-gradient(71deg, #F27121 0%, #E940CD 60%, #8A2387 100%)',
|
|
WebkitBackgroundClip: 'text',
|
|
WebkitTextFillColor: 'transparent',
|
|
textTransform: 'uppercase',
|
|
letterSpacing: '0.08em',
|
|
}}
|
|
>
|
|
{headerConfig.title}
|
|
</Typography>
|
|
|
|
<Typography
|
|
variant="body2"
|
|
sx={{
|
|
mt: 0.5,
|
|
color: 'rgba(255,255,255,1)',
|
|
}}
|
|
>
|
|
{headerConfig.subtitle}
|
|
</Typography>
|
|
</Box>
|
|
);
|
|
}
|