31 lines
1.0 KiB
TypeScript
31 lines
1.0 KiB
TypeScript
import { Button, Container, Group, Text, Title } from '@pikku/mantine/core';
|
|
import { DEFAULT_LOCALE } from '@/config';
|
|
import { useI18n } from '@/context/i18n-provider';
|
|
import { useNavigate, useParams } from '@tanstack/react-router';
|
|
import classes from './NotFoundTitle.module.css';
|
|
|
|
export function NotFoundTitle() {
|
|
const t = useI18n();
|
|
const navigate = useNavigate();
|
|
const { lang } = useParams({ strict: false }) as { lang?: string };
|
|
|
|
const handleGoHome = () => {
|
|
navigate({ to: lang ? `/${lang}` : `/${DEFAULT_LOCALE}` });
|
|
};
|
|
|
|
return (
|
|
<Container className={classes.root}>
|
|
<div className={classes.label}>404</div>
|
|
<Title className={classes.title}>{t('notfound.title')}</Title>
|
|
<Text c="dimmed" size="lg" ta="center" className={classes.description}>
|
|
{t('notfound.description')}
|
|
</Text>
|
|
<Group justify="center">
|
|
<Button variant="subtle" size="md" onClick={handleGoHome}>
|
|
{t('notfound.cta')}
|
|
</Button>
|
|
</Group>
|
|
</Container>
|
|
);
|
|
}
|