Imporve onboarding UI

frontend/src/pages/app/DashboardPage.tsx

@@ -16,9 +16,11 @@
  */
 
 import { useState, useEffect, useMemo } from 'react';
+import { useNavigate } from 'react-router-dom';
 import { Plus, Sparkles } from 'lucide-react';
 import { useTranslation } from 'react-i18next';
 import { useTenant } from '../../stores/tenant.store';
+import { useIsAuthenticated } from '../../stores';
 import {
   useApprovePurchaseOrder,
   useStartProductionBatch,
@@ -28,6 +30,7 @@ import { useRejectPurchaseOrder } from '../../api/hooks/purchase-orders';
 import { useIngredients } from '../../api/hooks/inventory';
 import { useSuppliers } from '../../api/hooks/suppliers';
 import { useRecipes } from '../../api/hooks/recipes';
+import { useUserProgress } from '../../api/hooks/onboarding';
 import { useQualityTemplates } from '../../api/hooks/qualityTemplates';
 import { SetupWizardBlocker } from '../../components/dashboard/SetupWizardBlocker';
 import { CollapsibleSetupBanner } from '../../components/dashboard/CollapsibleSetupBanner';
@@ -482,9 +485,39 @@ export function BakeryDashboard({ plan }: { plan?: string }) {
 export function DashboardPage() {
   const { subscriptionInfo } = useSubscription();
   const { currentTenant } = useTenant();
-  const { plan, loading } = subscriptionInfo;
+  const navigate = useNavigate();
+  const { plan, loading: subLoading } = subscriptionInfo;
   const tenantId = currentTenant?.id;
 
+  // Fetch onboarding progress
+  const isAuthenticated = useIsAuthenticated();
+  const { data: userProgress, isLoading: progressLoading } = useUserProgress('', {
+    enabled: !!isAuthenticated && plan !== SUBSCRIPTION_TIERS.ENTERPRISE
+  });
+
+  const loading = subLoading || progressLoading;
+
+  useEffect(() => {
+    if (!loading && userProgress && !userProgress.fully_completed && plan !== SUBSCRIPTION_TIERS.ENTERPRISE) {
+      // CRITICAL: Check if user is on the completion step
+      // If they are, don't redirect (they're in the process of completing onboarding)
+      const isOnCompletionStep = userProgress.current_step === 'completion';
+
+      if (!isOnCompletionStep) {
+        console.log('🔄 Onboarding incomplete, redirecting to wizard...', {
+          currentStep: userProgress.current_step,
+          fullyCompleted: userProgress.fully_completed
+        });
+        navigate('/app/onboarding');
+      } else {
+        console.log('✅ User on completion step, allowing dashboard access', {
+          currentStep: userProgress.current_step,
+          fullyCompleted: userProgress.fully_completed
+        });
+      }
+    }
+  }, [loading, userProgress, plan, navigate]);
+
   if (loading) {
     return (
       <div className="flex items-center justify-center min-h-screen">