Files
gridpilot.gg/apps/website/templates/layout/HeaderContentTemplate.tsx
2026-01-18 13:26:35 +01:00

48 lines
2.0 KiB
TypeScript

import React from 'react';
import { Text } from '@/ui/Text';
import { Box } from '@/ui/Box';
import { Stack } from '@/ui/Stack';
import { useCurrentSession } from '@/hooks/auth/useCurrentSession';
import { usePathname } from 'next/navigation';
import { routes } from '@/lib/routing/RouteConfig';
import { BrandMark } from '@/components/layout/BrandMark';
import { HeaderActions } from '@/components/layout/HeaderActions';
import { PublicNav } from '@/components/layout/PublicNav';
export interface HeaderContentViewData {}
export function HeaderContentTemplate(_props: HeaderContentViewData) {
const pathname = usePathname();
const { data: session } = useCurrentSession();
const isAuthenticated = !!session;
const homeHref = isAuthenticated ? routes.protected.dashboard : routes.public.home;
return (
<>
<Stack direction="row" align="center" gap={6}>
<BrandMark href={homeHref} priority />
<Box display={{ base: 'none', sm: 'flex' }} alignItems="center" gap={2} borderLeft borderColor="[#23272B]" pl={6}>
<Box w="6px" h="6px" rounded="full" bg="primary-accent" animate="pulse" />
<Text size="xs" color="text-gray-500" weight="bold" font="mono" letterSpacing="0.2em">
MOTORSPORT INFRASTRUCTURE
</Text>
</Box>
</Stack>
{!isAuthenticated && (
<Box display={{ base: 'none', md: 'flex' }} data-testid="public-top-nav">
<PublicNav pathname={pathname} direction="row" />
</Box>
)}
<Box display="flex" alignItems="center" gap={4}>
<Stack direction="row" display={{ base: 'none', md: 'flex' }} align="center" gap={1} px={3} py={1} border borderColor="[#23272B]" bg="[#141619]/20">
<Text size="xs" color="text-gray-600" weight="bold" font="mono">STATUS:</Text>
<Text size="xs" color="text-success-green" weight="bold" font="mono">OPERATIONAL</Text>
</Stack>
<HeaderActions isAuthenticated={isAuthenticated} />
</Box>
</>
);
}