import { routes } from '@/lib/routing/RouteConfig';
import { Stack } from '@/ui/Stack';
import { Calendar, Home, LayoutGrid, Trophy, Users, Flag } from 'lucide-react';
import { NavLink } from '@/ui/NavLink';

interface PublicNavProps {
  pathname: string;
  direction?: 'row' | 'col';
}

export function PublicNav({ pathname, direction = 'col' }: PublicNavProps) {
  const items = [
    { label: 'Home', href: routes.public.home, icon: Home },
    { label: 'Leagues', href: routes.public.leagues, icon: Trophy },
    { label: 'Drivers', href: routes.public.drivers, icon: Users },
    { label: 'Leaderboards', href: routes.public.leaderboards, icon: LayoutGrid },
    { label: 'Teams', href: routes.public.teams, icon: Flag },
    { label: 'Races', href: routes.public.races, icon: Calendar },
  ];

  return (
    <Stack direction={direction} gap={direction === 'row' ? 1 : 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>
  );
}
