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

40 lines
1.3 KiB
TypeScript

import React from 'react';
import { NavLink } from './NavLink';
import { Stack } from '@/ui/Stack';
import { Home, Trophy, Layout, Users, Calendar, Settings } from 'lucide-react';
import { routes } from '@/lib/routing/RouteConfig';
interface AuthedNavProps {
pathname: string;
direction?: 'row' | 'col';
}
/**
* AuthedNav displays navigation items for authenticated users.
*/
export function AuthedNav({ pathname, direction = 'col' }: AuthedNavProps) {
const items = [
{ label: 'Dashboard', href: routes.protected.dashboard, icon: Home },
{ label: 'Leagues', href: routes.public.leagues, icon: Trophy },
{ label: 'Leaderboards', href: routes.public.leaderboards, icon: Layout },
{ label: 'Teams', href: routes.public.teams, icon: Users },
{ label: 'Races', href: routes.public.races, icon: Calendar },
{ label: 'Settings', href: routes.protected.profileSettings, icon: Settings },
];
return (
<Stack direction={direction} gap={direction === 'row' ? 4 : 1}>
{items.map((item) => (
<NavLink
key={item.href}
href={item.href}
label={item.label}
icon={item.icon}
isActive={pathname === item.href}
variant={direction === 'row' ? 'top' : 'sidebar'}
/>
))}
</Stack>
);
}