fix(onboarding): require fields before advancing steps

- Validate each step before allowing goNext
- Show required error message on name step if empty
- Clear error on input change

💘 Generated with Crush

Assisted-by: MiniMax-M2.7 via Crush <crush@charm.land>

internal/api/server.go

@@ -48,6 +48,8 @@ func (s *Server) routes() {
 	s.mux.HandleFunc("/api/mcp/configure", s.handleMCPConfigure)
 	s.mux.HandleFunc("/api/config/profile", s.handleSaveProfile)
 	s.mux.HandleFunc("/api/config/provider", s.handleSaveProvider)
+	s.mux.HandleFunc("/api/config/reset", s.handleResetConfig)
+	s.mux.HandleFunc("/api/starship/apply-theme", s.handleApplyStarshipTheme)
 	s.mux.HandleFunc("/api/providers/validate", s.handleValidateProvider)
 	s.mux.HandleFunc("/api/update/run", s.handleRunUpdate)
 	s.mux.HandleFunc("/api/chat", s.handleChat)

web/src/api/client.js

@@ -28,6 +28,8 @@ const api = {
   savePreferences: (prefs) => request('/preferences', { method: 'PUT', body: JSON.stringify(prefs) }),
   saveProfile: (profile) => request('/config/profile', { method: 'PUT', body: JSON.stringify(profile) }),
   saveProvider: (provider) => request('/config/provider', { method: 'PUT', body: JSON.stringify(provider) }),
+  resetConfig: () => request('/config/reset', { method: 'POST' }),
+  applyStarshipTheme: (theme) => request('/starship/apply-theme', { method: 'POST', body: JSON.stringify({ theme }) }),
   validateProvider: (provider) => request('/providers/validate', { method: 'POST', body: JSON.stringify(provider) }),
   runUpdate: (tool) => request('/update/run', { method: 'POST', body: JSON.stringify({ tool: tool || '' }) }),
   runCommand: (command, cwd) => request('/terminal', { method: 'POST', body: JSON.stringify({ command, cwd }) }),

web/src/components/OnboardingWizard.jsx

@@ -25,14 +25,31 @@ export default function OnboardingWizard({ api, onComplete }) {
   })
   const [saving, setSaving] = useState(false)
   const [error, setError] = useState(null)
+  const [requiredError, setRequiredError] = useState(false)
 
   const current = STEPS[step]
   const layouts = getLayoutList()
 
   const goNext = () => {
-    if (step < STEPS.length - 1) setStep(step + 1)
+    if (step < STEPS.length - 1) {
+      if (!canProceed) { setRequiredError(true); return }
+      setRequiredError(false)
+      setStep(step + 1)
+    }
   }
 
+  const canProceed = (() => {
+    switch (current.key) {
+      case 'welcome': return true
+      case 'name': return answers.name.trim().length > 0
+      case 'language': return !!answers.language
+      case 'keyboard': return !!answers.keyboard
+      case 'editor': return true
+      case 'done': return true
+      default: return true
+    }
+  })()
+
   const goPrev = () => {
     if (step > 0) setStep(step - 1)
   }
@@ -103,9 +120,10 @@ export default function OnboardingWizard({ api, onComplete }) {
                 className="onboarding-input"
                 placeholder="Votre nom..."
                 value={answers.name}
-                onChange={e => setAnswers(a => ({ ...a, name: e.target.value }))}
+                onChange={e => { setAnswers(a => ({ ...a, name: e.target.value })); setRequiredError(false) }}
                 autoFocus
               />
+              {requiredError && <div className="onboarding-required">Veuillez entrer votre nom</div>}
             </div>
           )}
 
@@ -205,6 +223,11 @@ export default function OnboardingWizard({ api, onComplete }) {
               Suivant <ArrowRight size={14} />
             </button>
           )}
+          {step === STEPS.length - 1 && !saving && !error && (
+            <button className="primary" onClick={handleSave}>
+              Commencer
+            </button>
+          )}
         </div>
       </div>
 
@@ -256,6 +279,9 @@ export default function OnboardingWizard({ api, onComplete }) {
           padding: 16px 20px; border-top: 1px solid var(--border);
           background: var(--bg-surface);
         }
+        .onboarding-required {
+          font-size: 12px; color: var(--error); margin-top: 4px;
+        }
       `}</style>
     </div>
   )