fix: register missing /api/config/reset and /api/starship/apply-theme routes

- Add resetConfig and applyStarshipTheme to frontend api client
- Register handleResetConfig and handleApplyStarshipTheme in server mux

💘 Generated with Crush

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

internal/api/handlers_config.go

@@ -3,8 +3,11 @@ package api
 import (
 	"bytes"
 	"encoding/json"
+	"fmt"
 	"io"
 	"net/http"
+	"os"
+	"path/filepath"
 	"strings"
 	"time"
 
@@ -281,3 +284,203 @@ func (s *Server) handleGetTerminalThemes(w http.ResponseWriter, r *http.Request)
 	}
 	writeJSON(w, map[string]interface{}{"themes": themes})
 }
+
+func (s *Server) handleResetConfig(w http.ResponseWriter, r *http.Request) {
+	if r.Method != "POST" {
+		writeError(w, "POST only", http.StatusMethodNotAllowed)
+		return
+	}
+	dir, err := config.ConfigDir()
+	if err != nil {
+		writeError(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+	path := filepath.Join(dir, "config.yaml")
+	if err := os.Remove(path); err != nil && !os.IsNotExist(err) {
+		writeError(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+	s.config = config.Default()
+	if err := config.Save(s.config); err != nil {
+		writeError(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+	writeJSON(w, map[string]string{"status": "ok"})
+}
+
+func (s *Server) handleApplyStarshipTheme(w http.ResponseWriter, r *http.Request) {
+	if r.Method != "POST" {
+		writeError(w, "POST only", http.StatusMethodNotAllowed)
+		return
+	}
+	var body struct {
+		Theme string `json:"theme"`
+	}
+	if err := json.NewDecoder(r.Body).Decode(&body); err != nil {
+		writeError(w, err.Error(), http.StatusBadRequest)
+		return
+	}
+	if body.Theme == "" {
+		body.Theme = s.config.Terminal.PromptTheme
+	}
+
+	cfgDir, err := config.ConfigDir()
+	if err != nil {
+		writeError(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+	starshipDir := filepath.Join(cfgDir, "starship")
+	if err := os.MkdirAll(starshipDir, 0755); err != nil {
+		writeError(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+	themeFile := filepath.Join(starshipDir, "starship.toml")
+
+	themeContent := getStarshipThemeConfig(body.Theme)
+	if err := os.WriteFile(themeFile, []byte(themeContent), 0644); err != nil {
+		writeError(w, err.Error(), http.StatusInternalServerError)
+		return
+	}
+
+	home, _ := os.UserHomeDir()
+	shellRCs := []string{
+		filepath.Join(home, ".bashrc"),
+		filepath.Join(home, ".zshrc"),
+	}
+	for _, rc := range shellRCs {
+		if _, err := os.Stat(rc); err != nil {
+			continue
+		}
+		content, _ := os.ReadFile(rc)
+		if strings.Contains(string(content), "STARSHIP_CONFIG") {
+			continue
+		}
+		exportLine := fmt.Sprintf("\n# Muyue Starship config\nexport STARSHIP_CONFIG=%s\n", themeFile)
+		f, err := os.OpenFile(rc, os.O_APPEND|os.O_WRONLY, 0644)
+		if err != nil {
+			continue
+		}
+		f.WriteString(exportLine)
+		f.Close()
+	}
+
+	s.config.Terminal.PromptTheme = body.Theme
+	config.Save(s.config)
+
+	writeJSON(w, map[string]interface{}{"status": "ok", "config": themeFile})
+}
+
+func getStarshipThemeConfig(theme string) string {
+	switch theme {
+	case "charm":
+		return `[format]
+before_format = "$"
+format = """
+$username$directory$git_branch$git_status$cmd_duration$line_break$character"""
+
+[character]
+success_symbol = "[➜](bold #00E676)"
+error_symbol = "[✗](bold #FF0033)"
+
+[directory]
+truncation_length = 3
+truncation_symbol = "…/"
+style = "bold #00BCD4"
+
+[username]
+show_on_left = false
+style_user = "bold #FF0033"
+style_root = "bold #FF0033"
+
+[git_branch]
+symbol = " "
+format = "on [$symbol$branch]($style)"
+style = "bold #FFD740"
+
+[git_status]
+format = "[$all_status$ahead_behind]($style) "
+style = "bold #FF1A5E"
+conflicted = "!"
+untracked = "?"
+modified = "~"
+staged = "[+]"
+renamed = "»"
+deleted = "-"
+
+[cmd_duration]
+min_time = 500
+format = "took [$duration]($style)"
+style = "bold #75715E"
+`
+	case "zerotwo":
+		return `[format]
+before_format = "$"
+format = """
+$username$directory$git_branch$git_status$cmd_duration$line_break$character"""
+
+[character]
+success_symbol = "[❯](bold #3B82F6)"
+error_symbol = "[❯](bold #EF4444)"
+
+[directory]
+truncation_length = 3
+truncation_symbol = "…/"
+style = "bold #8B5CF6"
+
+[username]
+show_on_left = false
+style_user = "bold #EC4899"
+style_root = "bold #EF4444"
+
+[git_branch]
+symbol = " "
+format = "on [$symbol$branch]($style)"
+style = "bold #F472B6"
+
+[git_status]
+format = "[$all_status$ahead_behind]($style) "
+style = "bold #EF4444"
+conflicted = "!"
+untracked = "?"
+modified = "~"
+staged = "[+]"
+renamed = "»"
+deleted = "-"
+
+[cmd_duration]
+min_time = 500
+format = "took [$duration]($style)"
+style = "bold #6B7280"
+`
+	default:
+		return `[format]
+before_format = "$"
+format = """
+$username$directory$git_branch$git_status$line_break$character"""
+
+[character]
+success_symbol = "[❯](bold green)"
+error_symbol = "[❯](bold red)"
+
+[directory]
+truncation_length = 3
+truncation_symbol = "…/"
+style = "bold cyan"
+
+[username]
+show_on_left = false
+style_user = "bold red"
+style_root = "bold red"
+
+[git_branch]
+symbol = " "
+format = "on [$symbol$branch]($style)"
+style = "bold yellow"
+
+[cmd_duration]
+min_time = 500
+format = "took [$duration]($style)"
+style = "bold bright-black"
+`
+	}
+}

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/App.jsx

@@ -7,6 +7,7 @@ import Dashboard from './Dashboard'
 import Studio from './Studio'
 import Shell from './Shell'
 import Config from './Config'
+import OnboardingWizard from './OnboardingWizard'
 
 export default function App() {
   const [activeTab, setActiveTab] = useState('dash')
@@ -15,6 +16,7 @@ export default function App() {
   const [updates, setUpdates] = useState([])
   const [tools, setTools] = useState([])
   const [config, setConfig] = useState(null)
+  const [showOnboarding, setShowOnboarding] = useState(false)
   const { t, layout } = useI18n()
 
   const TABS = useMemo(() => [
@@ -32,8 +34,11 @@ export default function App() {
       setConfig(d)
       const theme = d.profile?.preferences?.theme || 'cyberpunk-red'
       applyTheme(getTheme(theme))
+      const hasProfile = d.profile?.name || d.profile?.pseudo
+      if (!hasProfile) setShowOnboarding(true)
     }).catch(() => {
       applyTheme(getTheme('cyberpunk-red'))
+      setShowOnboarding(true)
     })
   }, [])
 
@@ -150,6 +155,8 @@ export default function App() {
           </span>
         </div>
       </footer>
+
+      {showOnboarding && <OnboardingWizard api={api} onComplete={() => setShowOnboarding(false)} />}
     </div>
   )
 }

web/src/components/Config.jsx

@@ -1,15 +1,15 @@
 import { useState, useEffect, useCallback } from 'react'
-import { User, Brain, RefreshCw, Globe, Wrench } from 'lucide-react'
+import { User, Brain, RefreshCw, Globe, Wrench, Monitor } from 'lucide-react'
 import { useI18n, LANGUAGES } from '../i18n'
 import { getLayoutList } from '../i18n/keyboards'
 
 const PANELS = [
   { id: 'profile', icon: User },
   { id: 'providers', icon: Brain },
-  { id: 'terminal', icon: Monitor },
   { id: 'updates', icon: RefreshCw },
   { id: 'locale', icon: Globe },
   { id: 'skills', icon: Wrench },
+  { id: 'system', icon: Monitor },
 ]
 
 export default function Config({ api }) {
@@ -25,7 +25,7 @@ export default function Config({ api }) {
   const [editProfile, setEditProfile] = useState(false)
   const [editProvider, setEditProvider] = useState(null)
   const [profileForm, setProfileForm] = useState({})
-  const [providerForm, setProviderForm] = useState({})
+  const [providerForm, setProviderForm] = useState({}) // keyed by provider name
   const [toast, setToast] = useState(null)
 
 
@@ -107,9 +107,11 @@ export default function Config({ api }) {
     }
   }
 
-  const handleSaveProvider = async () => {
+  const handleSaveProvider = async (name) => {
+    const form = providerForm[name]
+    if (!form) return
     try {
-      await api.saveProvider(providerForm)
+      await api.saveProvider({ name, ...form })
       setEditProvider(null)
       loadData()
       showToast(t('config.saved'))
@@ -119,12 +121,15 @@ export default function Config({ api }) {
   }
 
   const openProviderEdit = (p) => {
-    setProviderForm({
-      name: p.name,
-      api_key: p.apiKey || '',
-      model: p.model || '',
-      base_url: p.baseURL || '',
-    })
+    setProviderForm(prev => ({
+      ...prev,
+      [p.name]: {
+        name: p.name,
+        api_key: p.apiKey || '',
+        model: p.model || '',
+        base_url: p.baseURL || '',
+      },
+    }))
     setEditProvider(p.name)
   }
 
@@ -193,6 +198,9 @@ export default function Config({ api }) {
           {activePanel === 'skills' && (
             <PanelSkills skillList={skillList} t={t} />
           )}
+          {activePanel === 'system' && (
+            <PanelSystem api={api} t={t} />
+          )}
 
         </div>
       </div>
@@ -299,23 +307,26 @@ function PanelProviders({ providers, editProvider, providerForm, setProviderForm
                     className="config-form-input"
                     type="password"
                     placeholder={t('config.tokenPlaceholder')}
-                    value={isEditing ? providerForm.api_key : ''}
+                    value={isEditing ? (providerForm[p.name]?.api_key || '') : ''}
                     onChange={e => {
                       if (!isEditing) openProviderEdit(p)
-                      setProviderForm(f => ({ ...f, api_key: e.target.value }))
+                      setProviderForm(prev => ({
+                        ...prev,
+                        [p.name]: { ...(prev[p.name] || {}), api_key: e.target.value },
+                      }))
                     }}
                   />
                 </div>
                 <div className="provider-setup-token-actions">
                   <button
                     className="sm primary"
-                    disabled={validating === p.name || !providerForm.api_key}
-                    onClick={() => handleValidate(p.name, providerForm.api_key, providerForm.model, providerForm.base_url)}
+                    disabled={validating === p.name || !providerForm[p.name]?.api_key}
+                    onClick={() => handleValidate(p.name, providerForm[p.name]?.api_key, providerForm[p.name]?.model, providerForm[p.name]?.base_url)}
                   >
                     {validating === p.name ? t('config.validating') : t('config.validateKey')}
                   </button>
                   {isValidationTarget && validationStatus?.valid && (
-                    <button className="sm" onClick={handleSaveProvider}>{t('config.save')}</button>
+                    <button className="sm" onClick={() => handleSaveProvider(p.name)}>{t('config.save')}</button>
                   )}
                 </div>
               </div>
@@ -444,6 +455,73 @@ function PanelSkills({ skillList, t }) {
   )
 }
 
+function PanelSystem({ api, t }) {
+  const [resetConfirm, setResetConfirm] = useState(false)
+  const [toast, setToast] = useState(null)
+
+  const showToast = (msg) => {
+    setToast(msg)
+    setTimeout(() => setToast(null), 3000)
+  }
+
+  const handleReset = async () => {
+    try {
+      await api.resetConfig()
+      setResetConfirm(false)
+      showToast(t('config.resetDone'))
+      setTimeout(() => window.location.reload(), 1500)
+    } catch (err) {
+      showToast(`${t('config.error')}: ${err.message}`)
+    }
+  }
+
+  const handleApplyStarship = async () => {
+    try {
+      await api.applyStarshipTheme('charm')
+      showToast(t('config.starshipApplied'))
+    } catch (err) {
+      showToast(`${t('config.error')}: ${err.message}`)
+    }
+  }
+
+  return (
+    <>
+      {toast && <div className="config-toast">{toast}</div>}
+      <div className="config-card">
+        <div className="config-card-row" style={{ marginBottom: 16 }}>
+          <span className="config-card-label" style={{ fontWeight: 600 }}>{t('config.applyStarship')}</span>
+        </div>
+        <div style={{ fontSize: 12, color: 'var(--muted)', marginBottom: 12 }}>
+          {t('config.starshipApplied')}
+        </div>
+        <button className="sm primary" onClick={handleApplyStarship}>
+          {t('config.applyStarship')}
+        </button>
+      </div>
+      <div className="config-card" style={{ marginTop: 12 }}>
+        <div className="config-card-row" style={{ marginBottom: 16 }}>
+          <span className="config-card-label" style={{ fontWeight: 600 }}>{t('config.resetConfig')}</span>
+        </div>
+        {resetConfirm ? (
+          <div>
+            <div style={{ fontSize: 12, color: 'var(--warning)', marginBottom: 12 }}>
+              {t('config.resetConfirm')}
+            </div>
+            <div style={{ display: 'flex', gap: 8 }}>
+              <button className="sm" onClick={() => setResetConfirm(false)}>{t('config.cancel')}</button>
+              <button className="sm danger" onClick={handleReset}>{t('config.resetConfig')}</button>
+            </div>
+          </div>
+        ) : (
+          <button className="sm ghost danger" onClick={() => setResetConfirm(true)}>
+            {t('config.resetConfig')}
+          </button>
+        )}
+      </div>
+    </>
+  )
+}
+
 function FormInput({ label, value, onChange, type = 'text' }) {
   return (
     <div className="config-form-field">

web/src/components/OnboardingWizard.jsx

@@ -0,0 +1,262 @@
+import { useState, useEffect } from 'react'
+import { Sparkles, ArrowRight, ArrowLeft } from 'lucide-react'
+import { useI18n, LANGUAGES } from '../i18n'
+import { getLayoutList } from '../i18n/keyboards'
+
+const STEPS = [
+  { key: 'welcome', title: 'welcome', field: null },
+  { key: 'name', title: 'name', field: 'name' },
+  { key: 'language', title: 'language', field: 'language' },
+  { key: 'keyboard', title: 'keyboard', field: 'keyboard' },
+  { key: 'editor', title: 'editor', field: 'editor' },
+  { key: 'done', title: 'done', field: null },
+]
+
+const EDITOR_SUGGESTIONS = ['vim', 'nvim', 'vscode', 'emacs', 'nano', 'helix']
+
+export default function OnboardingWizard({ api, onComplete }) {
+  const { t, language, keyboard, setLanguage, setKeyboard } = useI18n()
+  const [step, setStep] = useState(0)
+  const [answers, setAnswers] = useState({
+    name: '',
+    language: 'fr',
+    keyboard: 'azerty',
+    editor: '',
+  })
+  const [saving, setSaving] = useState(false)
+  const [error, setError] = useState(null)
+
+  const current = STEPS[step]
+  const layouts = getLayoutList()
+
+  const goNext = () => {
+    if (step < STEPS.length - 1) setStep(step + 1)
+  }
+
+  const goPrev = () => {
+    if (step > 0) setStep(step - 1)
+  }
+
+  useEffect(() => {
+    const handler = (e) => {
+      if (e.key === 'Escape') { goPrev(); return }
+      if (e.key === 'Enter' && current.key !== 'done') { e.preventDefault(); goNext() }
+    }
+    window.addEventListener('keydown', handler)
+    return () => window.removeEventListener('keydown', handler)
+  }, [step, current])
+
+  useEffect(() => {
+    if (current.key === 'done' && !saving) {
+      handleSave()
+    }
+  }, [step])
+
+  const handleSave = async () => {
+    setSaving(true)
+    setError(null)
+    try {
+      await api.saveProfile({
+        name: answers.name,
+        pseudo: answers.name.split(' ')[0] || 'user',
+        editor: answers.editor,
+      })
+      await api.savePreferences({
+        language: answers.language,
+        keyboard_layout: answers.keyboard,
+      })
+      onComplete()
+    } catch (err) {
+      setError(err.message || 'Erreur lors de la sauvegarde')
+      setSaving(false)
+    }
+  }
+
+  return (
+    <div className="onboarding-overlay">
+      <div className="onboarding-card">
+        <div className="onboarding-header">
+          <Sparkles size={20} style={{ color: 'var(--accent)' }} />
+          <span> Muyue Setup</span>
+        </div>
+
+        <div className="onboarding-progress">
+          {STEPS.map((_, i) => (
+            <div key={i} className={`onboarding-dot ${i === step ? 'active' : ''} ${i < step ? 'done' : ''}`} />
+          ))}
+        </div>
+
+        <div className="onboarding-body">
+          {current.key === 'welcome' && (
+            <div className="onboarding-step">
+              <div className="onboarding-title">Bienvenue ! 👋</div>
+              <div className="onboarding-desc">
+                Je suis votre assistant de configuration. Quelques questions rapides pour personnaliser votre expérience.
+              </div>
+            </div>
+          )}
+
+          {current.key === 'name' && (
+            <div className="onboarding-step">
+              <div className="onboarding-title">Comment vous appelez-vous ?</div>
+              <input
+                className="onboarding-input"
+                placeholder="Votre nom..."
+                value={answers.name}
+                onChange={e => setAnswers(a => ({ ...a, name: e.target.value }))}
+                autoFocus
+              />
+            </div>
+          )}
+
+          {current.key === 'language' && (
+            <div className="onboarding-step">
+              <div className="onboarding-title">Quelle langue pr\u00e9f\u00e9rez-vous ?</div>
+              <div className="onboarding-chips">
+                {LANGUAGES.map(lang => (
+                  <div
+                    key={lang.id}
+                    className={`chip ${answers.language === lang.id ? 'active' : ''}`}
+                    onClick={() => setAnswers(a => ({ ...a, language: lang.id }))}
+                  >
+                    {lang.name}
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+
+          {current.key === 'keyboard' && (
+            <div className="onboarding-step">
+              <div className="onboarding-title">Disposition du clavier ?</div>
+              <div className="onboarding-chips">
+                {layouts.map(l => (
+                  <div
+                    key={l.id}
+                    className={`chip ${answers.keyboard === l.id ? 'active' : ''}`}
+                    onClick={() => setAnswers(a => ({ ...a, keyboard: l.id }))}
+                  >
+                    {l.name}
+                  </div>
+                ))}
+              </div>
+            </div>
+          )}
+
+          {current.key === 'editor' && (
+            <div className="onboarding-step">
+              <div className="onboarding-title">Quel \u00e9diteur utilisez-vous ?</div>
+              <div className="onboarding-chips">
+                {EDITOR_SUGGESTIONS.map(ed => (
+                  <div
+                    key={ed}
+                    className={`chip ${answers.editor === ed ? 'active' : ''}`}
+                    onClick={() => setAnswers(a => ({ ...a, editor: ed }))}
+                  >
+                    {ed}
+                  </div>
+                ))}
+              </div>
+              <input
+                className="onboarding-input"
+                style={{ marginTop: 12 }}
+                placeholder="Autre (vim, nvim, vscode...)"
+                value={answers.editor}
+                onChange={e => setAnswers(a => ({ ...a, editor: e.target.value }))}
+                autoFocus
+              />
+            </div>
+          )}
+
+          {current.key === 'done' && (
+            <div className="onboarding-step">
+              {saving ? (
+                <>
+                  <div className="onboarding-title">Configuration en cours...</div>
+                  <div className="onboarding-desc">Sauvegarde de vos préférences.</div>
+                </>
+              ) : error ? (
+                <>
+                  <div className="onboarding-title" style={{ color: 'var(--error)' }}>Erreur</div>
+                  <div className="onboarding-desc" style={{ color: 'var(--error)' }}>{error}</div>
+                  <button className="primary" style={{ alignSelf: 'flex-start', marginTop: 8 }} onClick={() => handleSave()}>Réessayer</button>
+                </>
+              ) : (
+                <>
+                  <div className="onboarding-title">C'est parti ! 🚀</div>
+                  <div className="onboarding-desc">
+                    Votre profil est configuré. Vous pouvez toujours ajuster les paramètres dans l'onglet Configuration.
+                  </div>
+                </>
+              )}
+            </div>
+          )}
+        </div>
+
+        <div className="onboarding-footer">
+          {step > 0 && step < STEPS.length - 1 && (
+            <button className="ghost" onClick={goPrev}>
+              <ArrowLeft size={14} /> Précédent
+            </button>
+          )}
+          <div style={{ flex: 1 }} />
+          {step < STEPS.length - 1 && (
+            <button className="primary" onClick={goNext}>
+              Suivant <ArrowRight size={14} />
+            </button>
+          )}
+        </div>
+      </div>
+
+      <style>{`
+        .onboarding-overlay {
+          position: fixed; inset: 0; z-index: 500;
+          background: rgba(10,10,12,0.85);
+          display: flex; align-items: center; justify-content: center;
+          backdrop-filter: blur(8px);
+        }
+        .onboarding-card {
+          background: var(--bg-elevated);
+          border: 1px solid var(--border);
+          border-radius: var(--radius-lg);
+          width: 480px; max-width: 90vw;
+          box-shadow: 0 24px 64px rgba(0,0,0,0.5);
+          overflow: hidden;
+        }
+        .onboarding-header {
+          display: flex; align-items: center; gap: 8px;
+          padding: 16px 20px; font-size: 14px; font-weight: 700;
+          color: var(--accent); border-bottom: 1px solid var(--border);
+          background: var(--bg-surface);
+        }
+        .onboarding-progress {
+          display: flex; gap: 6px; padding: 14px 20px;
+          background: var(--bg-surface);
+          border-bottom: 1px solid var(--border);
+        }
+        .onboarding-dot {
+          width: 32px; height: 4px; border-radius: 2px;
+          background: var(--bg-input); transition: all 0.3s;
+        }
+        .onboarding-dot.active { background: var(--accent); }
+        .onboarding-dot.done { background: var(--accent-dim); }
+        .onboarding-body { padding: 28px 24px; min-height: 200px; }
+        .onboarding-step { display: flex; flex-direction: column; gap: 16px; }
+        .onboarding-title { font-size: 18px; font-weight: 700; color: var(--text-primary); }
+        .onboarding-desc { font-size: 14px; color: var(--text-tertiary); line-height: 1.6; }
+        .onboarding-input {
+          width: 100%; background: var(--bg-input); border: 1px solid var(--border);
+          border-radius: var(--radius); padding: 10px 14px; color: var(--text-primary);
+          font-size: 14px; outline: none; transition: border-color 0.2s, box-shadow 0.2s;
+        }
+        .onboarding-input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--border-accent); }
+        .onboarding-chips { display: flex; gap: 8px; flex-wrap: wrap; }
+        .onboarding-footer {
+          display: flex; justify-content: flex-end; gap: 8px;
+          padding: 16px 20px; border-top: 1px solid var(--border);
+          background: var(--bg-surface);
+        }
+      `}</style>
+    </div>
+  )
+}

web/src/i18n/en.js

@@ -121,6 +121,7 @@ const en = {
       updates: 'Updates',
       locale: 'Language & Keyboard',
       skills: 'Skills',
+      system: 'System',
     },
     profile: 'Profile',
     name: 'Name',
@@ -180,6 +181,12 @@ const en = {
     fontFamily: 'Font Family',
     preview: 'Preview',
     saving: 'Saving...',
+    resetConfig: 'Reset all',
+    resetConfirm: 'Are you sure? All preferences will be erased.',
+    resetDone: 'Settings reset.',
+    applyStarship: 'Apply starship',
+    starshipApplied: 'Starship theme applied! Restart your shell to see the result.',
+    starshipError: 'Failed to apply starship theme.',
   },
 }
 

web/src/i18n/fr.js

@@ -120,7 +120,8 @@ const fr = {
       terminal: 'Terminal',
       updates: 'Mises \u00e0 jour',
       locale: 'Langue & Clavier',
-      skills: 'Comp\u00e9tences',
+      skills: 'Comp\u00e9ENCES',
+      system: 'Syst\u00e8me',
     },
     profile: 'Profil',
     name: 'Nom',
@@ -143,7 +144,7 @@ const fr = {
     save: 'Enregistrer',
     saved: 'Enregistr\u00e9 !',
     error: 'Erreur',
-    skills: 'Comp\u00e9tences',
+    skills: 'Comp\u00e9ENCES',
     noSkills: 'Aucune comp\u00e9tence install\u00e9e.',
     runSkillsInit: 'Ex\u00e9cutez muyue skills init',
     language: 'Langue',
@@ -167,10 +168,10 @@ const fr = {
     editProfile: 'Modifier',
     editProvider: 'Configurer',
     validateKey: 'Valider',
-    validating: 'Vérification...',
-    keyValid: 'Clé valide',
-    keyInvalid: 'Clé invalide',
-    connectionFailed: 'Connexion échouée',
+    validating: 'V\u00e9rification...',
+    keyValid: 'Cl\u00e9 valide',
+    keyInvalid: 'Cl\u00e9 invalide',
+    connectionFailed: 'Connexion \u00e9chou\u00e9e',
     enterToken: 'Entrez votre token API pour {provider}',
     tokenPlaceholder: 'sk-...',
     setupDescription: 'Configurez le token de votre fournisseur IA pour utiliser l\'assistant.',
@@ -180,6 +181,12 @@ const fr = {
     fontFamily: 'Police',
     preview: 'Aper\u00e7u',
     saving: 'Enregistrement...',
+    resetConfig: 'R\u00e9initialiser',
+    resetConfirm: '\u00cates-vous s\u00fbr ? Toutes les pr\u00e9f\u00e9rences seront effac\u00e9es.',
+    resetDone: 'Param\u00e8tres r\u00e9initialis\u00e9s.',
+    applyStarship: 'Appliquer starship',
+    starshipApplied: 'Th\u00e8me starship appliqu\u00e9 ! Red\u00e9marrez votre shell pour voir le r\u00e9sultat.',
+    starshipError: '\u00c9chec de l\u2019application du th\u00e8me starship.',
   },
 }