66 lines
2.1 KiB
TypeScript
66 lines
2.1 KiB
TypeScript
import { AppShell, Flex, Text, Container, Button, Box } from '@pikku/mantine/core';
|
|
import { useLocation, useNavigate, useParams } from '@tanstack/react-router';
|
|
import { IconArrowLeft } from '@tabler/icons-react';
|
|
import LanguageSelector from '@/components/ui/LanguageSelector';
|
|
import Logo from '@/components/ui/Logo';
|
|
import { useI18n } from '@/context/i18n-provider';
|
|
|
|
interface CompanyLayoutProps {
|
|
children: React.ReactNode;
|
|
}
|
|
|
|
export default function CompanyLayout({ children }: CompanyLayoutProps) {
|
|
const pathname = useLocation({ select: (l) => l.pathname });
|
|
const navigate = useNavigate();
|
|
const params = useParams({ strict: false });
|
|
const t = useI18n();
|
|
const lang = params.lang as string;
|
|
const isDetailPage = pathname.includes('/company/candidate/');
|
|
|
|
return (
|
|
<AppShell
|
|
padding={0}
|
|
header={{ height: 80 }}
|
|
styles={{
|
|
main: {
|
|
backgroundColor: 'var(--mantine-color-gray-0)',
|
|
}
|
|
}}
|
|
>
|
|
<AppShell.Header>
|
|
{isDetailPage ? (
|
|
<Box style={{ borderBottom: '1px solid var(--mantine-color-gray-2)', height: '100%' }}>
|
|
<Container size="xl" h="100%">
|
|
<Flex align="center" justify="space-between" h="100%">
|
|
<Button
|
|
variant="default"
|
|
leftSection={<IconArrowLeft size={16} />}
|
|
onClick={() => navigate({ to: `/${lang}/company/candidates` })}
|
|
>
|
|
{t('company.navigation.backtosearch')}
|
|
</Button>
|
|
<LanguageSelector />
|
|
</Flex>
|
|
</Container>
|
|
</Box>
|
|
) : (
|
|
<Flex align="center" justify="space-between" h="100%" px="xl">
|
|
<div>
|
|
<Logo size="sm" />
|
|
<Text size="sm" c="dimmed" mt={2}>
|
|
{t('company.navigation.tagline')}
|
|
</Text>
|
|
</div>
|
|
|
|
<Flex gap="sm" align="center">
|
|
<LanguageSelector />
|
|
</Flex>
|
|
</Flex>
|
|
)}
|
|
</AppShell.Header>
|
|
|
|
<AppShell.Main>{children}</AppShell.Main>
|
|
</AppShell>
|
|
);
|
|
}
|