diff --git a/auto-claude-ui/src/renderer/App.tsx b/auto-claude-ui/src/renderer/App.tsx index 02ecb939..8584b762 100644 --- a/auto-claude-ui/src/renderer/App.tsx +++ b/auto-claude-ui/src/renderer/App.tsx @@ -31,6 +31,7 @@ import { Worktrees } from './components/Worktrees'; import { WelcomeScreen } from './components/WelcomeScreen'; import { RateLimitModal } from './components/RateLimitModal'; import { SDKRateLimitModal } from './components/SDKRateLimitModal'; +import { OnboardingWizard } from './components/onboarding'; import { useProjectStore, loadProjects, addProject, initializeProject } from './stores/project-store'; import { useTaskStore, loadTasks } from './stores/task-store'; import { useSettingsStore, loadSettings } from './stores/settings-store'; @@ -54,6 +55,7 @@ export function App() { const [isSettingsDialogOpen, setIsSettingsDialogOpen] = useState(false); const [settingsInitialSection, setSettingsInitialSection] = useState(undefined); const [activeView, setActiveView] = useState('kanban'); + const [isOnboardingWizardOpen, setIsOnboardingWizardOpen] = useState(false); // Initialize dialog state const [showInitDialog, setShowInitDialog] = useState(false); @@ -70,6 +72,15 @@ export function App() { loadSettings(); }, []); + // First-run detection - show onboarding wizard if not completed + useEffect(() => { + // Only show wizard if onboardingCompleted is explicitly false (not undefined) + // This ensures we don't show the wizard before settings are loaded + if (settings.onboardingCompleted === false) { + setIsOnboardingWizardOpen(true); + } + }, [settings.onboardingCompleted]); + // Listen for open-app-settings events (e.g., from project settings) useEffect(() => { const handleOpenAppSettings = (event: Event) => { @@ -423,6 +434,20 @@ export function App() { {/* SDK Rate Limit Modal - shows when SDK/CLI operations hit limits (changelog, tasks, etc.) */} + + {/* Onboarding Wizard - shows on first launch when onboardingCompleted is false */} + { + setIsOnboardingWizardOpen(false); + setIsNewTaskDialogOpen(true); + }} + onOpenSettings={() => { + setIsOnboardingWizardOpen(false); + setIsSettingsDialogOpen(true); + }} + /> );