website refactor

apps/website/components/layout/PublicNav.tsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import { NavLink } from './NavLink';
+import { Stack } from '@/ui/Stack';
+import { Home, Trophy, Layout, Users, Calendar } from 'lucide-react';
+import { routes } from '@/lib/routing/RouteConfig';
+
+interface PublicNavProps {
+  pathname: string;
+  direction?: 'row' | 'col';
+}
+
+/**
+ * PublicNav displays navigation items for unauthenticated users.
+ */
+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: 'Leaderboards', href: routes.public.leaderboards, icon: Layout },
+    { label: 'Teams', href: routes.public.teams, icon: Users },
+    { label: 'Races', href: routes.public.races, icon: Calendar },
+  ];
+
+  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>
+  );
+}