wip

apps/website/app/leagues/create/page.tsx

@@ -1,14 +1,43 @@
 'use client';
 
+import { useRouter, useSearchParams } from 'next/navigation';
 import CreateLeagueWizard from '@/components/leagues/CreateLeagueWizard';
 import Section from '@/components/ui/Section';
 import Container from '@/components/ui/Container';
 
+type StepName = 'basics' | 'structure' | 'schedule' | 'scoring' | 'review';
+
+function normalizeStepName(raw: string | null): StepName {
+  switch (raw) {
+    case 'basics':
+    case 'structure':
+    case 'schedule':
+    case 'scoring':
+    case 'review':
+      return raw;
+    default:
+      return 'basics';
+  }
+}
+
 export default function CreateLeaguePage() {
+  const router = useRouter();
+  const searchParams = useSearchParams();
+
+  const currentStepName = normalizeStepName(searchParams.get('step'));
+
+  const handleStepChange = (stepName: StepName) => {
+    const params = new URLSearchParams(searchParams.toString());
+    params.set('step', stepName);
+    const query = params.toString();
+    const href = query ? `/leagues/create?${query}` : '/leagues/create';
+    router.push(href);
+  };
+
   return (
     <Section>
       <Container size="md">
-        <CreateLeagueWizard />
+        <CreateLeagueWizard stepName={currentStepName} onStepChange={handleStepChange} />
       </Container>
     </Section>
   );