website refactor

apps/website/components/onboarding/OnboardingWizard.tsx

@@ -1,3 +1,5 @@
+'use client';
+
 import { useState, FormEvent } from 'react';
 import Card from '@/components/ui/Card';
 import { StepIndicator } from '@/ui/StepIndicator';

apps/website/components/onboarding/OnboardingWizardClient.tsx

@@ -0,0 +1,68 @@
+'use client';
+
+import { OnboardingWizard } from './OnboardingWizard';
+import { routes } from '@/lib/routing/RouteConfig';
+import { completeOnboardingAction } from '@/app/onboarding/completeOnboardingAction';
+import { generateAvatarsAction } from '@/app/onboarding/generateAvatarsAction';
+import { useAuth } from '@/lib/auth/AuthContext';
+
+export function OnboardingWizardClient() {
+  const { session } = useAuth();
+
+  const handleCompleteOnboarding = async (input: {
+    firstName: string;
+    lastName: string;
+    displayName: string;
+    country: string;
+    timezone?: string;
+  }) => {
+    try {
+      const result = await completeOnboardingAction(input);
+
+      if (result.isErr()) {
+        return { success: false, error: result.getError() };
+      }
+
+      window.location.href = routes.protected.dashboard;
+      return { success: true };
+    } catch (error) {
+      return { success: false, error: 'Failed to complete onboarding' };
+    }
+  };
+
+  const handleGenerateAvatars = async (params: {
+    facePhotoData: string;
+    suitColor: string;
+  }) => {
+    if (!session?.user?.userId) {
+      return { success: false, error: 'Not authenticated' };
+    }
+
+    try {
+      const result = await generateAvatarsAction({
+        userId: session.user.userId,
+        facePhotoData: params.facePhotoData,
+        suitColor: params.suitColor,
+      });
+
+      if (result.isErr()) {
+        return { success: false, error: result.getError() };
+      }
+
+      const data = result.unwrap();
+      return { success: true, data };
+    } catch (error) {
+      return { success: false, error: 'Failed to generate avatars' };
+    }
+  };
+
+  return (
+    <OnboardingWizard
+      onCompleted={() => {
+        window.location.href = routes.protected.dashboard;
+      }}
+      onCompleteOnboarding={handleCompleteOnboarding}
+      onGenerateAvatars={handleGenerateAvatars}
+    />
+  );
+}