+
+
+ );
+}
+
+/**
+ * Welcome step component for the onboarding wizard.
+ * Displays a welcome message with a feature overview and actions to get started or skip.
+ */
+export function WelcomeStep({ onGetStarted, onSkip }: WelcomeStepProps) {
+ const features = [
+ {
+ icon: ,
+ title: 'AI-Powered Development',
+ description: 'Generate code and build features using Claude Code agents'
+ },
+ {
+ icon: ,
+ title: 'Spec-Driven Workflow',
+ description: 'Define tasks with clear specifications and let Auto Claude handle the implementation'
+ },
+ {
+ icon: ,
+ title: 'Memory & Context',
+ description: 'Optional Graphiti integration for persistent memory across sessions'
+ },
+ {
+ icon: ,
+ title: 'Parallel Execution',
+ description: 'Run multiple agents in parallel for faster development cycles'
+ }
+ ];
+
+ return (
+
+
+ {/* Hero Section */}
+
+
+ Welcome to Auto Claude
+
+
+ Build software autonomously with AI-powered agents
+
+
+
+ {/* Features Grid */}
+
+ {features.map((feature, index) => (
+
+ ))}
+
+
+ {/* Description */}
+
+
+ This wizard will help you set up your environment in just a few steps.
+ You can configure your Claude OAuth token, optionally set up memory features,
+ and create your first task.
+