fix(shell): remove stray 'impo' typo causing ReferenceError

💘 Generated with Crush

Assisted-by: GLM-5.1 via Crush <crush@charm.land>

internal/api/chat_engine.go

@@ -4,7 +4,6 @@ import (
 	"context"
 	"encoding/json"
 	"net/http"
-	"strings"
 
 	"github.com/muyue/muyue/internal/agent"
 	"github.com/muyue/muyue/internal/orchestrator"
@@ -76,12 +75,8 @@ func (ce *ChatEngine) RunWithTools(ctx context.Context, messages []orchestrator.
 		content := cleanThinkingTags(choice.Message.Content)
 
 		if content != "" {
-			words := strings.Fields(content)
+			if ce.onChunk != nil {
-			for _, w := range words {
+				ce.onChunk(map[string]interface{}{"content": content})
-				chunk := w
-				if ce.onChunk != nil {
-					ce.onChunk(map[string]interface{}{"content": chunk})
-				}
 			}
 			finalContent = content
 		}

internal/api/handlers_info.go

@@ -8,6 +8,7 @@ import (
 	"os"
 	"os/exec"
 	"path/filepath"
+	"regexp"
 	"strings"
 	"time"
 
@@ -495,28 +496,45 @@ func (s *Server) handleProvidersQuota(w http.ResponseWriter, r *http.Request) {
 				if json.Unmarshal(body, &data) == nil {
 					if d, ok := data["data"].(map[string]interface{}); ok {
 						if limits, ok := d["limits"].([]interface{}); ok {
-							timeLimit := map[string]interface{}{}
+							models := make([]map[string]interface{}, 0)
 							for _, l := range limits {
-								if lm, ok := l.(map[string]interface{}); ok && lm["type"] == "TIME_LIMIT" {
+								if lm, ok := l.(map[string]interface{}); ok {
+									name := "Z.AI"
+									if model, ok := lm["model"].(string); ok && model != "" {
+										name = model
+									} else if t, ok := lm["type"].(string); ok && t != "TIME_LIMIT" {
+										name = t
+									}
 									usage, _ := lm["usage"].(float64)
 									remaining, _ := lm["remaining"].(float64)
+									limitVal, hasLimit := lm["limit"].(float64)
 									total := usage + remaining
-									timeLimit = map[string]interface{}{
+									if hasLimit && limitVal > 0 {
-										"model":     "Z.AI",
+										total = limitVal
-										"used":      usage,
+									}
-										"total":     total,
+									if total > 0 {
-										"remaining": remaining,
+										models = append(models, map[string]interface{}{
+											"model":     name,
+											"used":      usage,
+											"total":     total,
+											"remaining": remaining,
+										})
 									}
 								}
 							}
-							if len(timeLimit) > 0 {
+							if len(models) > 0 {
-								q.Data = map[string]interface{}{"models": []map[string]interface{}{timeLimit}}
+								q.Data = map[string]interface{}{"models": models}
 								q.Healthy = true
 							}
 						}
 					}
 				}
 			}
+		case "mimo":
+			q.Healthy = p.APIKey != ""
+			if p.APIKey == "" {
+				q.Error = "no API key"
+			}
 		case "claude", "anthropic":
 			// Claude Code n'a pas d'API externe, vérifier l'installation
 			claudePath := "/usr/bin/claude"
@@ -553,10 +571,11 @@ func (s *Server) handleRecentCommands(w http.ResponseWriter, r *http.Request) {
 			shell = "zsh"
 		}
 		lines := strings.Split(string(data), "\n")
-		start := len(lines) - 25
+		start := len(lines) - 50
 		if start < 0 {
 			start = 0
 		}
+
 		for i := len(lines) - 1; i >= start; i-- {
 			line := strings.TrimSpace(lines[i])
 			if line == "" || strings.HasPrefix(line, "#") {
@@ -573,6 +592,15 @@ func (s *Server) handleRecentCommands(w http.ResponseWriter, r *http.Request) {
 			if line == "" {
 				continue
 			}
+
+			base := strings.Fields(line)[0]
+			if len(base) < 2 {
+				continue
+			}
+			if !regexp.MustCompile(`^[a-zA-Z@./]`).MatchString(base) {
+				continue
+			}
+
 			entries = append(entries, cmdEntry{Cmd: line, Shell: shell})
 		}
 	}

internal/api/terminal.go

@@ -146,13 +146,6 @@ func (s *Server) handleTerminalWS(w http.ResponseWriter, r *http.Request) {
 		return
 	}
 	log.Printf("terminal: pty started successfully")
-	defer func() {
-		ptmx.Close()
-		if cmd.Process != nil {
-			cmd.Process.Kill()
-			cmd.Wait()
-		}
-	}()
 
 	var once sync.Once
 	cleanup := func() {
@@ -164,6 +157,7 @@ func (s *Server) handleTerminalWS(w http.ResponseWriter, r *http.Request) {
 			}
 		})
 	}
+	defer cleanup()
 
 	go func() {
 		buf := make([]byte, 4096)
@@ -171,8 +165,6 @@ func (s *Server) handleTerminalWS(w http.ResponseWriter, r *http.Request) {
 			n, err := ptmx.Read(buf)
 			if err != nil {
 				cleanup()
-				conn.WriteMessage(websocket.CloseMessage,
-					websocket.FormatCloseMessage(websocket.CloseNormalClosure, ""))
 				return
 			}
 			if err := conn.WriteJSON(wsMessage{
@@ -230,12 +222,11 @@ func (s *Server) handleTerminalSessions(w http.ResponseWriter, r *http.Request)
 		return
 	}
 	var body struct {
-		Name     string `json:"name"`
+		Name    string `json:"name"`
-		Host     string `json:"host"`
+		Host    string `json:"host"`
-		Port     int    `json:"port"`
+		Port    int    `json:"port"`
-		User     string `json:"user"`
+		User    string `json:"user"`
-		Password string `json:"password"`
+		KeyPath string `json:"key_path"`
-		KeyPath  string `json:"key_path"`
 	}
 	if err := json.NewDecoder(r.Body).Decode(&body); err != nil {
 		writeError(w, err.Error(), http.StatusBadRequest)

internal/config/config.go

@@ -269,6 +269,12 @@ func Default() *MuyueConfig {
 			BaseURL: "https://api.minimax.io/v1",
 			Active:  true,
 		},
+		{
+			Name:    "mimo",
+			Model:   "MiMo-V2.5-Pro",
+			BaseURL: "https://token-plan-ams.xiaomimimo.com/v1",
+			Active:  false,
+		},
 		{
 			Name:    "zai",
 			Model:   "glm",

internal/orchestrator/orchestrator.go

@@ -476,6 +476,8 @@ func getProviderBaseURL(name string) string {
 		return "https://api.openai.com/v1"
 	case "zai":
 		return "https://api.z.ai/v1"
+	case "mimo":
+		return "https://token-plan-ams.xiaomimimo.com/v1"
 	default:
 		return ""
 	}
@@ -503,11 +505,19 @@ func (o *Orchestrator) sendWithFallback(reqBody ChatRequest, baseURLOverride str
 	if o.provider != nil {
 		providerOrder = append(providerOrder, o.provider)
 	}
+	var zaiProvider *config.AIProvider
 	for _, p := range providers {
 		if o.provider == nil || p.Name != o.provider.Name {
-			providerOrder = append(providerOrder, p)
+			if p.Name == "zai" {
+				zaiProvider = p
+			} else {
+				providerOrder = append(providerOrder, p)
+			}
 		}
 	}
+	if zaiProvider != nil {
+		providerOrder = append(providerOrder, zaiProvider)
+	}
 
 	var lastErr error
 	var triedProviders []string

internal/version/version.go

@@ -7,7 +7,7 @@ import (
 
 const (
 	Name    = "muyue"
-	Version = "0.3.4"
+	Version = "0.3.5"
 	Author  = "La Légion de Muyue"
 )
 

web/src/api/client.js

@@ -105,7 +105,7 @@ const api = {
       }).catch(reject)
     })
   },
-  sendShellChat: (message, context = {}, stream = true, onChunk) => {
+  sendShellChat: (message, context = {}, stream = true, onChunk, signal) => {
     const payload = {
       message,
       cwd: context.cwd || '',
@@ -120,6 +120,7 @@ const api = {
         method: 'POST',
         headers: { 'Content-Type': 'application/json' },
         body: JSON.stringify(payload),
+        signal,
       }).then(async (res) => {
         if (!res.ok) {
           const err = await res.json().catch(() => ({ error: res.statusText }))

web/src/components/App.jsx

@@ -92,6 +92,8 @@ export default function App() {
       { keys: `${layout.keys.shift}+${layout.keys.enter}`, desc: t('statusbar.newLine') },
     ],
     shell: [
+      { keys: `${layout.keys.ctrl}+${layout.keys.shift}+C`, desc: t('statusbar.copy') },
+      { keys: `${layout.keys.ctrl}+${layout.keys.shift}+V`, desc: t('statusbar.paste') },
       { keys: layout.keys.enter, desc: t('statusbar.runCommand') },
       { keys: `${layout.keys.up}/${layout.keys.down}`, desc: t('statusbar.commandHistory') },
     ],

web/src/components/Config.jsx

@@ -1,13 +1,11 @@
 import { useState, useEffect, useCallback } from 'react'
-import { User, Brain, RefreshCw, Globe, Wrench, Monitor } from 'lucide-react'
+import { User, Brain, RefreshCw, Wrench, Monitor, AlertTriangle } from 'lucide-react'
-import { useI18n, LANGUAGES } from '../i18n'
+import { useI18n } from '../i18n'
-import { getLayoutList } from '../i18n/keyboards'
 
 const PANELS = [
   { id: 'profile', icon: User },
   { id: 'providers', icon: Brain },
   { id: 'updates', icon: RefreshCw },
-  { id: 'locale', icon: Globe },
   { id: 'skills', icon: Wrench },
   { id: 'system', icon: Monitor },
 ]
@@ -29,8 +27,6 @@ export default function Config({ api }) {
   const [toast, setToast] = useState(null)
 
 
-  const layouts = getLayoutList()
-
   const loadData = useCallback(() => {
     api.getConfig().then(d => {
       setConfig(d)
@@ -168,13 +164,6 @@ export default function Config({ api }) {
               t={t}
             />
           )}
-          {activePanel === 'locale' && (
-            <PanelLocale
-              language={language} keyboard={keyboard} layouts={layouts}
-              api={api}
-              t={t}
-            />
-          )}
           {activePanel === 'skills' && (
             <PanelSkills skillList={skillList} t={t} />
           )}
@@ -320,33 +309,48 @@ function getFieldLabel(key, t) {
 
 function PanelProviders({ providers, editProvider, providerForm, setProviderForm, setEditProvider, openProviderEdit, handleSaveProvider, api, loadData, t }) {
   const [validating, setValidating] = useState(null)
-  const [validationStatus, setValidationStatus] = useState(null)
+  const [keyStatus, setKeyStatus] = useState({})
 
-  const handleValidate = async (name, apiKey, model, baseUrl) => {
+  const validateKey = async (p) => {
-    setValidating(name)
+    setValidating(p.name)
-    setValidationStatus(null)
     try {
-      await api.validateProvider({ name, api_key: apiKey, model, base_url: baseUrl })
+      await api.validateProvider({ name: p.name, api_key: p.apiKey, model: p.model, base_url: p.baseURL || '' })
-      setValidationStatus({ provider: name, valid: true })
+      setKeyStatus(prev => ({ ...prev, [p.name]: { valid: true, checked: true } }))
     } catch (err) {
-      const msg = err.message || ''
+      setKeyStatus(prev => ({ ...prev, [p.name]: { valid: false, checked: true, error: err.message || 'Clé invalide' } }))
-      if (msg.includes('invalid_api_key')) {
-        setValidationStatus({ provider: name, valid: false, error: t('config.keyInvalid') })
-      } else {
-        setValidationStatus({ provider: name, valid: false, error: `${t('config.connectionFailed')}: ${msg}` })
-      }
     }
     setValidating(null)
   }
 
-  const displayed = providers.filter(p => p.name === 'minimax' || p.name === 'zai')
+  useEffect(() => {
+    providers.forEach(p => {
+      if (p.apiKey && !keyStatus[p.name]) {
+        validateKey(p)
+      } else if (!p.apiKey) {
+        setKeyStatus(prev => ({ ...prev, [p.name]: { valid: false, checked: true, error: 'Aucune clé' } }))
+      }
+    })
+  }, [providers])
+
+  const handleValidate = async (name, apiKey, model, baseUrl) => {
+    setValidating(name)
+    try {
+      await api.validateProvider({ name, api_key: apiKey, model, base_url: baseUrl })
+      setKeyStatus(prev => ({ ...prev, [name]: { valid: true, checked: true } }))
+    } catch (err) {
+      setKeyStatus(prev => ({ ...prev, [name]: { valid: false, checked: true, error: err.message || 'Clé invalide' } }))
+    }
+    setValidating(null)
+  }
+
+  const displayed = providers.filter(p => p.name === 'minimax' || p.name === 'mimo')
 
   return (
     <div className="config-providers-list">
       {displayed.map((p, i) => {
         const isEditing = editProvider === p.name
-        const isValidationTarget = validationStatus?.provider === p.name
         const currentModel = providerForm[p.name]?.model || p.model
+        const status = keyStatus[p.name]
 
         return (
           <div key={i} className="config-card provider-card-v2">
@@ -354,8 +358,8 @@ function PanelProviders({ providers, editProvider, providerForm, setProviderForm
               <div className="provider-card-identity">
                 <span className="provider-card-name">{p.name.toUpperCase()}</span>
                 {p.active && <span className="badge ok" style={{ marginLeft: 6 }}>active</span>}
-                {isValidationTarget && validationStatus?.valid && <span className="badge ok">{t('config.keyValid')}</span>}
+                {status?.checked && status?.valid && <span className="badge ok">✓ {t('config.keyValid')}</span>}
-                {isValidationTarget && !validationStatus?.valid && <span className="badge error">{validationStatus?.error}</span>}
+                {status?.checked && !status?.valid && <span className="badge error">✗ {status.error || t('config.keyInvalid')}</span>}
               </div>
             </div>
 
@@ -402,7 +406,14 @@ function PanelProviders({ providers, editProvider, providerForm, setProviderForm
   )
 }
 
-function PanelUpdates({ updates, checking, updating, needsUpdateCount, installedCount, missingCount, handleCheckUpdates, handleUpdateTool, handleUpdateAll, t }) {
+function PanelUpdates({ updates, tools, checking, updating, needsUpdateCount, installedCount, missingCount, handleCheckUpdates, handleUpdateTool, handleUpdateAll, t }) {
+  const handleInstallTool = (tool) => {
+    window.dispatchEvent(new CustomEvent('navigate-to-shell', {}))
+    window.dispatchEvent(new CustomEvent('ask-ai-terminal', { detail: { message: `Installe l'outil ${tool} sur mon système. Vérifie d'abord s'il est déjà installé, puis installe-le si nécessaire avec les commandes appropriées.` } }))
+  }
+
+  const missingTools = tools.filter(tool => !tool.installed)
+
   return (
     <>
       <div className="config-card">
@@ -425,6 +436,30 @@ function PanelUpdates({ updates, checking, updating, needsUpdateCount, installed
         </div>
       </div>
 
+      {missingTools.length > 0 && (
+        <>
+          <div className="section-title" style={{ marginTop: 12, marginBottom: 4 }}>{t('config.missing') || 'Modules manquants'}</div>
+          <div className="config-update-list">
+            {missingTools.map((tool, i) => (
+              <div key={`miss-${i}`} className="config-update-row">
+                <div className="config-update-info">
+                  <span className="config-update-name">{tool.name}</span>
+                  <span className="config-update-versions">
+                    <span style={{ color: 'var(--danger)' }}>{t('config.notInstalled') || 'Non installé'}</span>
+                  </span>
+                </div>
+                <button
+                  className="sm primary"
+                  onClick={() => handleInstallTool(tool.name)}
+                >
+                  {t('config.install') || 'Installer'}
+                </button>
+              </div>
+            ))}
+          </div>
+        </>
+      )}
+
       {updates.length === 0 ? (
         <div className="config-card">
           <div className="empty-state">{t('config.noUpdates')}</div>
@@ -460,98 +495,7 @@ function PanelUpdates({ updates, checking, updating, needsUpdateCount, installed
   )
 }
 
-function PanelLocale({ language, keyboard, layouts, api, t }) {
-  const { setLanguage, setKeyboard } = useI18n()
-  const [editLocale, setEditLocale] = useState(false)
-  const [draftLang, setDraftLang] = useState(language)
-  const [draftKbd, setDraftKbd] = useState(keyboard)
-  const [saving, setSaving] = useState(false)
-  const [toast, setToast] = useState(null)
 
-  const showToast = (msg) => {
-    setToast(msg)
-    setTimeout(() => setToast(null), 2500)
-  }
-
-  const handleSave = async () => {
-    setSaving(true)
-    try {
-      await api.savePreferences({ language: draftLang, keyboard_layout: draftKbd })
-      setLanguage(draftLang)
-      setKeyboard(draftKbd)
-      setEditLocale(false)
-      showToast(t('config.saved'))
-    } catch (err) {
-      showToast(`${t('config.error')}: ${err.message}`)
-    }
-    setSaving(false)
-  }
-
-  const currentLang = LANGUAGES.find(l => l.id === language)
-  const currentKbd = layouts.find(l => l.id === keyboard)
-
-  return (
-    <div className="config-profile-center">
-      {toast && <div className="config-toast">{toast}</div>}
-      <div className="config-card">
-        <div className="config-card-row">
-          <span className="config-card-label">{t('config.language')}</span>
-          <span className="config-card-value">{currentLang?.name || language}</span>
-        </div>
-        <div className="config-card-row">
-          <span className="config-card-label">{t('config.keyboardLayout')}</span>
-          <span className="config-card-value">{currentKbd?.name || keyboard}</span>
-        </div>
-      </div>
-      {editLocale && (
-        <div className="config-card">
-          <div className="config-card-group">
-            <span className="config-card-group-label">{t('config.language')}</span>
-            <div className="chip-row">
-              {LANGUAGES.map(lang => (
-                <div
-                  key={lang.id}
-                  className={`chip ${draftLang === lang.id ? 'active' : ''}`}
-                  onClick={() => setDraftLang(lang.id)}
-                >
-                  {lang.name}
-                </div>
-              ))}
-            </div>
-          </div>
-          <div className="config-card-group">
-            <span className="config-card-group-label">{t('config.keyboardLayout')}</span>
-            <div className="chip-row">
-              {layouts.map(l => (
-                <div
-                  key={l.id}
-                  className={`chip ${draftKbd === l.id ? 'active' : ''}`}
-                  onClick={() => setDraftKbd(l.id)}
-                >
-                  {l.name}
-                </div>
-              ))}
-            </div>
-          </div>
-        </div>
-      )}
-      <div className="config-card">
-        <div className="config-card-actions" style={{ justifyContent: 'center' }}>
-          {editLocale ? (
-            <>
-              <button className="primary sm" onClick={handleSave} disabled={saving}>
-                {saving ? t('config.saving') : t('config.save')}
-              </button>
-              <button className="ghost sm" onClick={() => setEditLocale(false)}>{t('config.cancel')}</button>
-            </>
-          ) : (
-            <button className="primary sm" onClick={() => { setDraftLang(language); setDraftKbd(keyboard); setEditLocale(true) }}>{t('config.editProfile')}</button>
-          )}
-        </div>
-      </div>
-    </div>
-  )
-}
 
 function PanelSkills({ skillList, t }) {
   const [selected, setSelected] = useState(null)
@@ -634,7 +578,7 @@ function PanelSkills({ skillList, t }) {
 }
 
 function PanelSystem({ api, t }) {
-  const [resetConfirm, setResetConfirm] = useState(false)
+  const [showResetModal, setShowResetModal] = useState(false)
   const [toast, setToast] = useState(null)
 
   const showToast = (msg) => {
@@ -645,7 +589,7 @@ function PanelSystem({ api, t }) {
   const handleReset = async () => {
     try {
       await api.resetConfig()
-      setResetConfirm(false)
+      setShowResetModal(false)
       showToast(t('config.resetDone'))
       setTimeout(() => window.location.reload(), 1500)
     } catch (err) {
@@ -653,49 +597,66 @@ function PanelSystem({ api, t }) {
     }
   }
 
-  const handleApplyStarship = async () => {
+  const handleApplyStarship = () => {
-    try {
+    window.dispatchEvent(new CustomEvent('navigate-to-shell', {}))
-      await api.applyStarshipTheme('charm')
+    window.dispatchEvent(new CustomEvent('ask-ai-terminal', { detail: { message: `Vérifie si starship est installé sur le système. S'il ne l'est pas, installe-le (avec curl ou le gestionnaire de paquets). Ensuite, applique la configuration du thème "charm" pour starship. Assure-toi que starship est bien initialisé dans le shell de l'utilisateur.` } }))
-      showToast(t('config.starshipApplied'))
-    } catch (err) {
-      showToast(`${t('config.error')}: ${err.message}`)
-    }
   }
 
   return (
     <>
       {toast && <div className="config-toast">{toast}</div>}
+
+      <div className="section-title" style={{ marginBottom: 8 }}>Configuration Système</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 }}>
+        <div style={{ fontSize: 12, color: 'var(--text-tertiary)', marginBottom: 12 }}>
-          {t('config.starshipApplied')}
+          Vérifie l'installation de starship et configure le thème charm via l'IA.
         </div>
         <button className="sm primary" onClick={handleApplyStarship}>
           {t('config.applyStarship')}
         </button>
       </div>
-      <div className="config-card" style={{ marginTop: 12 }}>
+
+      <div className="section-title" style={{ marginTop: 20, marginBottom: 8, color: 'var(--danger)' }}>
+        <AlertTriangle size={14} style={{ verticalAlign: 'middle', marginRight: 6 }} />
+        Zone Rouge
+      </div>
+      <div className="config-card" style={{ borderColor: 'var(--danger)', borderWidth: 1, borderStyle: 'solid' }}>
         <div className="config-card-row" style={{ marginBottom: 16 }}>
-          <span className="config-card-label" style={{ fontWeight: 600 }}>{t('config.resetConfig')}</span>
+          <span className="config-card-label" style={{ fontWeight: 600, color: 'var(--danger)' }}>{t('config.resetConfig')}</span>
         </div>
-        {resetConfirm ? (
+        <div style={{ fontSize: 12, color: 'var(--text-tertiary)', marginBottom: 12 }}>
-          <div>
+          Cette action supprimera toute votre configuration et relancera l'application.
-            <div style={{ fontSize: 12, color: 'var(--warning)', marginBottom: 12 }}>
+        </div>
-              {t('config.resetConfirm')}
+        <button className="sm ghost danger" onClick={() => setShowResetModal(true)}>
+          {t('config.resetConfig')}
+        </button>
+      </div>
+
+      {showResetModal && (
+        <div className="shell-modal-overlay" onClick={() => setShowResetModal(false)}>
+          <div className="shell-modal" onClick={e => e.stopPropagation()}>
+            <div className="shell-modal-header" style={{ color: 'var(--danger)' }}>
+              <AlertTriangle size={16} style={{ verticalAlign: 'middle', marginRight: 8 }} />
+              {t('config.resetConfig')}
             </div>
-            <div style={{ display: 'flex', gap: 8 }}>
+            <div className="shell-modal-body">
-              <button className="sm" onClick={() => setResetConfirm(false)}>{t('config.cancel')}</button>
+              <p style={{ color: 'var(--warning)', fontSize: 13, marginBottom: 12 }}>
-              <button className="sm danger" onClick={handleReset}>{t('config.resetConfig')}</button>
+                {t('config.resetConfirm')}
+              </p>
+              <p style={{ color: 'var(--text-tertiary)', fontSize: 12 }}>
+                Cette action est irréversible. Toute votre configuration (profil, clés API, préférences) sera supprimée.
+              </p>
+            </div>
+            <div className="shell-modal-footer">
+              <button className="ghost" onClick={() => setShowResetModal(false)}>{t('config.cancel')}</button>
+              <button className="danger" onClick={handleReset}>{t('config.resetConfig')}</button>
             </div>
           </div>
-        ) : (
+        </div>
-          <button className="sm ghost danger" onClick={() => setResetConfirm(true)}>
+      )}
-            {t('config.resetConfig')}
-          </button>
-        )}
-      </div>
     </>
   )
 }

web/src/components/Dashboard.jsx

@@ -43,7 +43,7 @@ export default function Dashboard({ api, refreshRef }) {
   const [recentCmds, setRecentCmds] = useState([])
   const [processes, setProcesses] = useState([])
   const [metrics, setMetrics] = useState(null)
-  const [copiedIdx, setCopiedIdx] = useState(-1)
+  const [copiedSet, setCopiedSet] = useState(new Set())
   const cpuRef = useRef([])
   const memRef = useRef([])
   const netRxRef = useRef([])
@@ -91,15 +91,16 @@ export default function Dashboard({ api, refreshRef }) {
   }, [loadData, refreshRef])
 
   const minimax = (quota || []).find(p => p.name === 'minimax')
-  const zai = (quota || []).find(p => p.name === 'zai')
+  const mimo = (quota || []).find(p => p.name === 'mimo')
 
-  const EXCLUDE_CMDS = ['ls', 'cd', 'pwd', 'clear', 'exit', 'history']
+  const EXCLUDE_CMDS = ['ls', 'cd', 'pwd', 'clear', 'exit', 'history', 'cat', 'echo', 'grep', 'export', 'alias', 'unalias', 'set', 'unset', 'source', '.', 'fg', 'bg', 'jobs', 'wait', 'true', 'false', 'yes', 'sleep', 'date', 'whoami', 'id', 'uname', 'hostname', 'uptime', 'df', 'free', 'top', 'htop', 'nano', 'vi', 'vim', 'less', 'more', 'tail', 'head', 'man', 'info', 'which', 'whereis', 'type', 'command', 'hash', 'builtin', 'help']
 
   const topCmds = (() => {
     const counts = {}
     for (const c of recentCmds) {
       const base = c.cmd.split(/\s+/)[0]
-      if (EXCLUDE_CMDS.includes(base) || !base) continue
+      if (!base || base.length < 2 || EXCLUDE_CMDS.includes(base)) continue
+      if (!/^[a-zA-Z@.\/]/.test(base)) continue
       counts[base] = (counts[base] || 0) + 1
     }
     return Object.entries(counts)
@@ -108,6 +109,32 @@ export default function Dashboard({ api, refreshRef }) {
       .map(([cmd, count]) => ({ cmd, count }))
   })()
 
+  const maxCount = topCmds.length > 0 ? topCmds[0].count : 1
+
+  const copyCmd = (cmd, key) => {
+    navigator.clipboard.writeText(cmd)
+    setCopiedSet(prev => new Set(prev).add(key))
+    setTimeout(() => setCopiedSet(prev => { const next = new Set(prev); next.delete(key); return next }), 1500)
+  }
+
+  const relativeTime = (ts) => {
+    if (!ts) return ''
+    const diff = Math.floor((Date.now() - new Date(ts).getTime()) / 1000)
+    if (diff < 60) return `${diff}s`
+    if (diff < 3600) return `${Math.floor(diff / 60)}m`
+    if (diff < 86400) return `${Math.floor(diff / 3600)}h`
+    return `${Math.floor(diff / 86400)}d`
+  }
+
+  const recentUnique = (() => {
+    const seen = new Set()
+    return recentCmds.filter(c => {
+      if (seen.has(c.cmd)) return false
+      seen.add(c.cmd)
+      return true
+    })
+  })()
+
   return (
     <div className="dash-grid">
       {/* CPU */}
@@ -159,22 +186,22 @@ export default function Dashboard({ api, refreshRef }) {
               <span className="dash-quota-val" style={{ color: 'var(--text-tertiary)' }}>{minimax.error || 'no data'}</span>
             </div>
           )}
-          {zai && zai.data?.models?.map((m, i) => (
+          {mimo && mimo.data?.models?.map((m, i) => (
             <div key={i} className="dash-quota-row">
-              <span className="dash-quota-name">{String(m.model)}</span>
+              <span className="dash-quota-name">{String(m.model).replace('MiMo-', '')}</span>
               <div className="dash-bar">
                 <div className="dash-bar-fill" style={{ width: `${Math.min(100, (m.used / m.total) * 100)}%` }} />
               </div>
               <span className="dash-quota-val">{m.used}/{m.total}</span>
             </div>
           ))}
-          {zai && !zai.data?.models?.length && (
+          {mimo && !mimo.data?.models?.length && (
             <div className="dash-quota-row">
-              <span className="dash-quota-name">Z.AI</span>
+              <span className="dash-quota-name">MiMo</span>
-              <span className="dash-quota-val" style={{ color: 'var(--text-tertiary)' }}>{zai.error || 'no data'}</span>
+              <span className="dash-quota-val" style={{ color: 'var(--text-tertiary)' }}>{mimo.error || (mimo.healthy ? '✓ configured' : 'no key')}</span>
             </div>
           )}
-          {!minimax && !zai && <span className="dash-quota-val" style={{ color: 'var(--text-tertiary)' }}>No providers</span>}
+          {!minimax && !mimo && <span className="dash-quota-val" style={{ color: 'var(--text-tertiary)' }}>No providers</span>}
         </div>
       </div>
 
@@ -196,26 +223,34 @@ export default function Dashboard({ api, refreshRef }) {
       </div>
 
       {/* Recent Commands */}
-      <div className="dash-card">
+      <div className="dash-card dash-cmd-card">
         <div className="dash-card-head">
           <span className="dash-label">Recent Commands</span>
+          <span className="dash-count">{recentUnique.length}</span>
         </div>
         {topCmds.length > 0 && (
-          <div className="dash-cmd-top">
+          <div className="dash-cmd-freq">
+            <span className="dash-cmd-freq-title">Most used</span>
             {topCmds.map((c, i) => (
-              <div key={i} className={'dash-cmd-chip' + (copiedIdx === i ? ' dash-cmd-chip-copied' : '')} onClick={() => { navigator.clipboard.writeText(c.cmd); setCopiedIdx(i); setTimeout(() => setCopiedIdx(-1), 1200); }}>
+              <div key={i} className="dash-cmd-freq-row" onClick={() => copyCmd(c.cmd, `top-${i}`)} title={c.cmd}>
-                <span className="dash-cmd-chip-name">{copiedIdx === i ? '✓ Copié' : c.cmd}</span>
+                <span className="dash-cmd-freq-name">{copiedSet.has(`top-${i}`) ? '✓ Copié' : c.cmd}</span>
-                <span className="dash-cmd-chip-count">{c.count}×</span>
+                <div className="dash-cmd-freq-bar-wrap">
+                  <div className="dash-cmd-freq-bar" style={{ width: `${(c.count / maxCount) * 100}%` }} />
+                </div>
+                <span className="dash-cmd-freq-count">{c.count}×</span>
               </div>
             ))}
           </div>
         )}
         <div className="dash-cmd-list">
-          {recentCmds.length === 0 && <span className="dash-empty">No history</span>}
+          {recentUnique.length === 0 && <span className="dash-empty">No history</span>}
-          {recentCmds.map((c, i) => (
+          {recentUnique.map((c, i) => (
-            <div key={i} className="dash-cmd-row" title={c.cmd}>
+            <div key={i} className="dash-cmd-row" onClick={() => copyCmd(c.cmd, `list-${i}`)} title={c.cmd + ' · click to copy'}>
-              <span className="dash-cmd-shell">{c.shell}</span>
+              <div className="dash-cmd-left">
-              <span className="dash-cmd-text">{c.cmd.length > 45 ? c.cmd.slice(0, 42) + '...' : c.cmd}</span>
+                <span className="dash-cmd-text">{c.cmd.length > 38 ? c.cmd.slice(0, 35) + '...' : c.cmd}</span>
+                <span className="dash-cmd-time">{relativeTime(c.ts)}</span>
+              </div>
+              <span className="dash-cmd-copy">{copiedSet.has(`list-${i}`) ? '✓' : '⎘'}</span>
             </div>
           ))}
         </div>

web/src/components/Shell.jsx

@@ -1,64 +1,68 @@
-import { useState, useRef, useEffect, useCallback, useMemo } from 'react'
+import { useState, useRef, useEffect, useCallback } from 'react'
-import { Terminal as XTerm } from '@xterm/xterm'
+// === Style thème système pour xterm ===
-import { FitAddon } from '@xterm/addon-fit'
+function getCSSVariable(varName) {
-import { WebLinksAddon } from '@xterm/addon-web-links'
+  if (typeof document === 'undefined') return null;
-import { Plus, X, Monitor, Globe, ChevronDown, Pencil, Trash2, Search, Copy, Send, Eye, Bot } from 'lucide-react'
+  return getComputedStyle(document.documentElement).getPropertyValue(varName).trim() || null;
-import '@xterm/xterm/css/xterm.css'
-import { useI18n } from '../i18n'
-
-const AI_TAB_ID = 0
-const MAX_TABS = 7
-const SHELL_MAX_TOKENS = 100000
-const TABS_STORAGE_KEY = 'muyue_shell_tabs'
-
-function renderContent(text) {
-  const parts = []
-  const codeBlockRegex = /(```[\s\S]*?```)/g
-  let match
-  let lastIndex = 0
-  while ((match = codeBlockRegex.exec(text)) !== null) {
-    if (match.index > lastIndex) {
-      parts.push({ type: 'text', content: text.slice(lastIndex, match.index) })
-    }
-    const full = match[1]
-    const firstNewline = full.indexOf('\n')
-    const lang = firstNewline > -1 ? full.slice(3, firstNewline).trim() : ''
-    const code = firstNewline > -1 ? full.slice(firstNewline + 1, -3) : full.slice(3, -3)
-    parts.push({ type: 'code', lang, content: code })
-    lastIndex = match.index + full.length
-  }
-  if (lastIndex < text.length) {
-    parts.push({ type: 'text', content: text.slice(lastIndex) })
-  }
-  return parts
 }
 
-function formatText(text) {
+function parseHexColor(hex) {
-  let html = text
+  if (!hex || hex.startsWith('var(')) return null;
-    .replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;')
+  hex = hex.replace('#', '');
+  if (hex.length === 3) hex = hex.split('').map(c => c + c).join('');
+  if (hex.length !== 6) return null;
+  const r = parseInt(hex.slice(0, 2), 16);
+  const g = parseInt(hex.slice(2, 4), 16);
+  const b = parseInt(hex.slice(4, 6), 16);
+  return { r, g, b };
+}
 
-  html = html
+function toRgbString(hex) {
-    .replace(/\*\*(.+?)\*\*/g, '<strong>$1</strong>')
+  const c = parseHexColor(hex);
-    .replace(/`([^`]+)`/g, '<code class="inline-code">$1</code>')
+  if (!c) return '#000000';
-    .replace(/^### (.+)$/gm, '<h4 class="msg-h4">$1</h4>')
+  return `#${c.r.toString(16).padStart(2, '0')}${c.g.toString(16).padStart(2, '0')}${c.b.toString(16).padStart(2, '0')}`;
-    .replace(/^## (.+)$/gm, '<h3 class="msg-h3">$1</h3>')
+}
-    .replace(/^# (.+)$/gm, '<h2 class="msg-h2">$1</h2>')
-    .replace(/^\s*[-*] (.+)$/gm, '<div class="msg-bullet">• $1</div>')
-    .replace(/^\s*(\d+)[.)] (.+)$/gm, '<div class="msg-step"><span class="msg-step-num">$1</span> $2</div>')
-    .replace(/\n/g, '<br/>')
 
-  html = html
+function buildSystemTheme() {
-    .replace(/<br\/>\s*<br\/>/g, '<br/>')
+  const bg = getCSSVariable('--bg-base') || '#0F0D10';
-    .replace(/<br\/>\s*(<h[234]|<div class="msg-)/g, '$1')
+  const fg = getCSSVariable('--text-primary') || '#EAE0E2';
-    .replace(/(<\/h[234]|<\/div>)\s*<br\/>/g, '$1')
+  const accent = getCSSVariable('--accent-light') || '#FF1A5E';
-    .replace(/\s+on\w+=["'][^"']*["']/gi, '')
+  const accentDim = getCSSVariable('--accent-dim') || '#6B2033';
-    .replace(/javascript:/gi, '')
+  const success = '#00E676';
-    .replace(/data:/gi, '')
+  const warning = '#FFD740';
-
+  const error = getCSSVariable('--accent-bright') || '#FF1744';
-  return html
+  const bgSurface = getCSSVariable('--bg-surface') || bg;
+  const bgElevated = getCSSVariable('--bg-elevated') || bgSurface;
+  const textSecondary = getCSSVariable('--text-secondary') || fg;
+  const textTertiary = getCSSVariable('--text-tertiary') || textSecondary;
+  
+  return {
+    background: toRgbString(bg),
+    foreground: toRgbString(fg),
+    cursor: toRgbString(accent),
+    cursorAccent: toRgbString(bg),
+    selectionBackground: `${toRgbString(accentDim)}44`,
+    selectionForeground: '#FFFFFF',
+    black: toRgbString(bgElevated),
+    red: toRgbString(error),
+    green: toRgbString(success),
+    yellow: toRgbString(warning),
+    blue: toRgbString(getCSSVariable('--accent') || '#448AFF'),
+    magenta: toRgbString(accent),
+    cyan: '#00BCD4',
+    white: toRgbString(fg),
+    brightBlack: toRgbString(bgSurface),
+    brightRed: toRgbString(accent),
+    brightGreen: toRgbString(success),
+    brightYellow: toRgbString(warning),
+    brightBlue: toRgbString(getCSSVariable('--accent-muted') || '#82B1FF'),
+    brightMagenta: toRgbString(getCSSVariable('--accent-soft') || '#FF80AB'),
+    brightCyan: '#84FFFF',
+    brightWhite: '#FFFFFF',
+  };
 }
 
 const THEMES = {
+  system: buildSystemTheme(),
   default: {
     background: '#0A0A0C', foreground: '#EAE0E2', cursor: '#FF0033',
     cursorAccent: '#0A0A0C', selectionBackground: '#FF003344', selectionForeground: '#ffffff',
@@ -116,14 +120,17 @@ const THEMES = {
 }
 
 function getTheme(themeName) {
-  return THEMES[themeName] || THEMES.default
+  if (themeName === 'system' || themeName === 'default') {
+    return buildSystemTheme()
+  }
+  return THEMES[themeName] || buildSystemTheme()
 }
 
 function createTerminal(container, settings = {}) {
-  const theme = getTheme(settings.theme || 'default')
+  const theme = getTheme(settings.theme || 'system')
   const term = new XTerm({
     cursorBlink: true,
-    fontSize: settings.fontSize || 14,
+    fontSize: settings.fontSize || 12,
     fontFamily: settings.fontFamily || "'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'SF Mono', 'Menlo', monospace",
     theme,
     allowTransparency: false,
@@ -134,25 +141,68 @@ function createTerminal(container, settings = {}) {
   const webLinksAddon = new WebLinksAddon()
   term.loadAddon(fitAddon)
   term.loadAddon(webLinksAddon)
+
+  term.attachCustomKeyEventHandler((e) => {
+    if (e.type !== 'keydown') return true
+    const ctrl = e.ctrlKey || e.metaKey
+    const shift = e.shiftKey
+
+    if (ctrl && shift && e.key === 'C') {
+      e.preventDefault()
+      e.stopPropagation()
+      const selection = term.getSelection()
+      if (selection) navigator.clipboard.writeText(selection)
+      return false
+    }
+
+    if (ctrl && shift && e.key === 'V') {
+      e.preventDefault()
+      e.stopPropagation()
+      navigator.clipboard.readText().then(text => {
+        if (text) term.paste(text)
+      }).catch(() => {})
+      return false
+    }
+
+    return true
+  })
+
   term.open(container)
   fitAddon.fit()
 
   return { term, fitAddon }
 }
 
-function connectWebSocket(term, fitAddon, initPayload) {
+function connectWebSocket(term, fitAddon, initPayload, onStateChange, onFirstMessage) {
   const proto = window.location.protocol === 'https:' ? 'wss:' : 'ws:'
   const ws = new WebSocket(`${proto}//${window.location.host}/api/ws/terminal`)
 
   ws.addEventListener('open', () => {
     ws.send(JSON.stringify(initPayload))
     const dims = fitAddon.proposeDimensions()
-    if (dims) {
+    // Envoyer resize avec dimensions minimales garanties (24x80)
-      ws.send(JSON.stringify({ type: 'resize', rows: dims.rows, cols: dims.cols }))
+    const rows = dims?.rows || 24
-    }
+    const cols = dims?.cols || 80
+    ws.send(JSON.stringify({ type: 'resize', rows, cols }))
+    // Forcer un fit après l'ouverture
+    setTimeout(() => {
+      try {
+        fitAddon.fit()
+        const newDims = fitAddon.proposeDimensions()
+        if (newDims && newDims.rows > 0 && newDims.cols > 0) {
+          ws.send(JSON.stringify({ type: 'resize', rows: newDims.rows, cols: newDims.cols }))
+        }
+      } catch (e) { console.warn('[Shell] fit failed:', e) }
+    }, 50)
+    if (onStateChange) onStateChange(true)
   })
 
+  let firstMessage = true
   ws.addEventListener('message', (event) => {
+    if (firstMessage) {
+      firstMessage = false
+      if (onFirstMessage) onFirstMessage()
+    }
     try {
       const msg = JSON.parse(event.data)
       if (msg.type === 'output') {
@@ -167,16 +217,12 @@ function connectWebSocket(term, fitAddon, initPayload) {
 
   ws.addEventListener('close', () => {
     term.write('\r\n\x1b[33m— Connection closed —\x1b[0m\r\n')
+    if (onStateChange) onStateChange(false)
   })
 
   ws.addEventListener('error', () => {
     term.write('\r\n\x1b[31m— Connection error —\x1b[0m\r\n')
-  })
+    if (onStateChange) onStateChange(false)
-
-  term.onData((data) => {
-    if (ws.readyState === WebSocket.OPEN) {
-      ws.send(JSON.stringify({ type: 'input', data }))
-    }
   })
 
   term.onResize(({ rows, cols }) => {
@@ -192,32 +238,48 @@ export default function Shell({ api }) {
   const { t } = useI18n()
   const tabsRef = useRef({})
   const nextIdRef = useRef(1)
-  const settingsRef = useRef({ fontSize: 14, fontFamily: "'JetBrains Mono', 'Fira Code', monospace", theme: 'default' })
+  const settingsRef = useRef({ fontSize: 12, fontFamily: "'JetBrains Mono', 'Fira Code', monospace", theme: 'system' })
+  const pendingCommandsRef = useRef({})
 
-  const savedTabs = (() => {
+  const [tabs, setTabs] = useState(() => {
     try {
       const raw = localStorage.getItem(TABS_STORAGE_KEY)
       if (raw) {
         const parsed = JSON.parse(raw)
-        if (Array.isArray(parsed) && parsed.length > 0) {
+        if (Array.isArray(parsed) && parsed.length > 0 && parsed.length <= MAX_TABS) {
-          return parsed.map(t => ({ ...t, connected: false }))
+          return parsed.map((t, i) => ({ 
+            id: t.id || i + 1, 
+            name: t.name || `Tab ${i + 1}`, 
+            type: t.type || 'local', 
+            shell: t.shell || '',
+            host: t.host,
+            port: t.port,
+            user: t.user,
+            key_path: t.key_path,
+            connected: false 
+          }))
         }
       }
-    } catch {}
+    } catch (e) { 
-    return null
+      console.warn('[Shell] Failed to parse saved tabs:', e)
-  })()
+      localStorage.removeItem(TABS_STORAGE_KEY)
-
-  const [tabs, setTabs] = useState(savedTabs || [
-    { id: AI_TAB_ID, name: 'AI Terminal', type: 'ai', shell: '', connected: false, ai: true },
-    { id: 1, name: 'Local Shell', type: 'local', shell: '', connected: false },
-  ])
-  const [activeTab, setActiveTab] = useState(() => {
-    if (savedTabs) {
-      const aiTab = savedTabs.find(t => t.ai)
-      return aiTab ? aiTab.id : savedTabs[0].id
     }
-    return AI_TAB_ID
+    return [
+      { id: 1, name: 'Local Shell', type: 'local', shell: '', connected: false },
+    ]
   })
+  const [activeTab, setActiveTab] = useState(() => {
+    try {
+      const raw = localStorage.getItem(TABS_STORAGE_KEY)
+      if (raw) {
+        const parsed = JSON.parse(raw)
+        if (Array.isArray(parsed) && parsed.length > 0) return parsed[0]?.id || 1
+      }
+    } catch {}
+    return 1
+  })
+  const activeTabRef = useRef(activeTab)
+  useEffect(() => { activeTabRef.current = activeTab }, [activeTab])
   const [sshConnections, setSshConnections] = useState([])
   const [systemTerminals, setSystemTerminals] = useState([])
   const [showMenu, setShowMenu] = useState(false)
@@ -225,9 +287,9 @@ export default function Shell({ api }) {
   const [editingTab, setEditingTab] = useState(null)
   const [editName, setEditName] = useState('')
   const [terminalSettings, setTerminalSettings] = useState({
-    fontSize: 14,
+    fontSize: 12,
     fontFamily: "'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'SF Mono', 'Menlo', monospace",
-    theme: 'default',
+    theme: 'system',
   })
 
   useEffect(() => { settingsRef.current = terminalSettings }, [terminalSettings])
@@ -244,20 +306,14 @@ export default function Shell({ api }) {
   const [analyzing, setAnalyzing] = useState(false)
   const [showAnalysis, setShowAnalysis] = useState(false)
   const [analysisContent, setAnalysisContent] = useState('')
-  const [renderTick, setRenderTick] = useState(0)
   const aiMessagesRef = useRef(null)
   const aiLoadedRef = useRef(false)
+  const aiLoadingRef = useRef(false)
 
   useEffect(() => {
     aiMessagesRef.current?.scrollTo(0, aiMessagesRef.current.scrollHeight)
   }, [aiMessages])
 
-  useEffect(() => {
-    const ms = aiLoading ? 1000 : 5000
-    const iv = setInterval(() => setRenderTick(t => t + 1), ms)
-    return () => clearInterval(iv)
-  }, [aiLoading])
-
   useEffect(() => {
     api.getShellAnalysis?.().then(d => {
       if (d?.analysis) setAnalysisContent(d.analysis)
@@ -296,9 +352,9 @@ export default function Shell({ api }) {
     api.getConfig().then(d => {
       if (d.terminal) {
         setTerminalSettings({
-          fontSize: d.terminal.font_size || 14,
+          fontSize: d.terminal.font_size || 12,
           fontFamily: d.terminal.font_family || "'JetBrains Mono', 'Fira Code', 'Cascadia Code', 'SF Mono', 'Menlo', monospace",
-          theme: d.terminal.theme || 'default',
+          theme: d.terminal.theme || 'system',
         })
       }
     }).catch(() => {})
@@ -308,7 +364,7 @@ export default function Shell({ api }) {
     if (tabsRef.current[tabId]) return
 
     const container = document.getElementById(`terminal-${tabId}`)
-    if (!container || container.offsetHeight === 0) return
+    if (!container) return
 
     const s = settingsRef.current
     const { term, fitAddon } = createTerminal(container, {
@@ -335,76 +391,246 @@ export default function Shell({ api }) {
       }
     }
 
-    const ws = connectWebSocket(term, fitAddon, initPayload)
+    let disposed = false
 
-    ws.onopen = () => {
+    const saveBuffer = () => {
-      setTabs(prev => prev.map(t => t.id === tabId ? { ...t, connected: true } : t))
+      try {
+        const buf = term.buffer.active
+        const lines = []
+        for (let i = 0; i < buf.length; i++) {
+          const line = buf.getLine(i)
+          if (line) lines.push(line.translateToString(true))
+        }
+        const savedBuffers = JSON.parse(sessionStorage.getItem(TERMINAL_BUFFER_KEY) || '{}')
+        savedBuffers[tabId] = lines.join('\n')
+        sessionStorage.setItem(TERMINAL_BUFFER_KEY, JSON.stringify(savedBuffers))
+      } catch (e) { console.warn('[Shell] Buffer save failed:', e) }
     }
 
-    ws.onclose = () => {
+    const onWsState = (connected) => {
-      setTabs(prev => prev.map(t => t.id === tabId ? { ...t, connected: false } : t))
+      if (disposed) return
+      if (!connected) saveBuffer()
+      setTabs(prev => prev.map(t => t.id === tabId ? { ...t, connected } : t))
     }
 
-    ws.onerror = () => {
+    const restoreBuffer = () => {
-      setTabs(prev => prev.map(t => t.id === tabId ? { ...t, connected: false } : t))
+      try {
+        const savedBuffers = JSON.parse(sessionStorage.getItem(TERMINAL_BUFFER_KEY) || '{}')
+        if (savedBuffers[tabId]) {
+          term.write('\x1b[90m— session restaurée —\x1b[0m\r\n')
+          term.write(savedBuffers[tabId])
+        }
+      } catch (e) { console.warn('[Shell] Buffer restore failed:', e) }
     }
 
+    const ws = connectWebSocket(term, fitAddon, initPayload, onWsState, restoreBuffer)
+
+    const clearBufferOnClear = () => {
+      try {
+        const buf = term.buffer.active
+        const lineY = buf.length - 1
+        const line = buf.getLine(lineY)
+        if (line) {
+          const text = line.translateToString(true).trim().toLowerCase()
+          if (text === 'clear' || text === '$ clear' || text.endsWith(' clear')) {
+            const savedBuffers = JSON.parse(sessionStorage.getItem(TERMINAL_BUFFER_KEY) || '{}')
+            delete savedBuffers[tabId]
+            sessionStorage.setItem(TERMINAL_BUFFER_KEY, JSON.stringify(savedBuffers))
+          }
+        }
+      } catch (e) { console.warn('[Shell] Clear detection failed:', e) }
+    }
+
+    term.onData((data) => {
+      if (data === '\r') clearBufferOnClear()
+      if (ws.readyState === WebSocket.OPEN) {
+        ws.send(JSON.stringify({ type: 'input', data }))
+      }
+    })
+
     const onResize = () => {
-      const el = document.getElementById(`terminal-${tabId}`)
+      fitAddon.fit()
-      if (el && el.offsetParent !== null) {
-        fitAddon.fit()
-      }
     }
 
     const resizeObserver = new ResizeObserver(onResize)
     resizeObserver.observe(container)
     window.addEventListener('resize', onResize)
 
-    tabsRef.current[tabId] = { term, fitAddon, ws, resizeObserver, onResize }
+    const bufferSaveInterval = setInterval(() => { if (!disposed) saveBuffer() }, 5000)
+
+    console.log(`[Shell] initTerminal tab=${tabId} type=${tab.type} name="${tab.name}" shell="${tab.shell || '(default)'}"`)
+    tabsRef.current[tabId] = { term, fitAddon, ws, resizeObserver, onResize, bufferSaveInterval, saveBuffer, disposed: () => disposed }
+    tabsRef.current[tabId]._markDisposed = () => { disposed = true }
+    console.log(`[Shell] initTerminal tab=${tabId} done, tabsRef keys:`, Object.keys(tabsRef.current))
+
+    const pending = pendingCommandsRef.current[tabId]
+    if (pending && pending.length > 0) {
+      console.log(`[Shell] Flushing ${pending.length} pending commands for tab ${tabId}`)
+      for (const cmd of pending) {
+        if (ws.readyState === WebSocket.OPEN) {
+          ws.send(JSON.stringify({ type: 'input', data: cmd + '\r' }))
+        }
+      }
+      delete pendingCommandsRef.current[tabId]
+    }
   }, [])
 
-  useEffect(() => {
+  const initPendingTabs = useCallback(() => {
-    const tab = tabs.find(t => t.id === activeTab)
+    for (const tab of tabsRef.current._tabList || []) {
-    if (!tab) return
+      if (!tabsRef.current[tab.id]) {
+        const container = document.getElementById(`terminal-${tab.id}`)
+        if (container && container.offsetHeight > 0) {
+          initTerminal(tab.id, tab)
+        }
+      }
+    }
+    requestAnimationFrame(() => {
+      for (const tab of tabsRef.current._tabList || []) {
+        const entry = tabsRef.current[tab.id]
+        if (entry) entry.fitAddon.fit()
+      }
+      setTimeout(() => {
+        for (const tab of tabsRef.current._tabList || []) {
+          const entry = tabsRef.current[tab.id]
+          if (entry) entry.fitAddon.fit()
+        }
+      }, 150)
+    })
+  }, [initTerminal])
 
-    const tryInit = (attempt) => {
+  useEffect(() => {
-      if (attempt > 10) return
+    tabsRef.current._tabList = tabs
-      const container = document.getElementById(`terminal-${tab.id}`)
+  }, [tabs])
-      if (!container || container.offsetHeight === 0) {
+
-        setTimeout(() => tryInit(attempt + 1), 100)
+  useEffect(() => {
+    let cancelled = false
+    const pending = []
+
+    // Forcer le layout à se calculer
+    const forceLayout = () => {
+      const el = document.querySelector('.shell-terminal-col')
+      if (el) {
+        el.style.height = ''
+        el.style.minHeight = ''
+        // Forcer reflow
+        void el.offsetHeight
+      }
+    }
+
+    const tryInitTab = (tab, attempt) => {
+      if (cancelled) return
+      if (attempt > 20) {
+        console.warn(`[Shell] max attempts reached for tab ${tab.id}`)
         return
       }
+      
+      forceLayout()
+      const shellCol = document.querySelector('.shell-terminal-col')
+      if (!shellCol) {
+        pending.push(setTimeout(() => tryInitTab(tab, attempt + 1), 150))
+        return
+      }
+      
+      const container = document.getElementById(`terminal-${tab.id}`)
+      if (!container) {
+        pending.push(setTimeout(() => tryInitTab(tab, attempt + 1), 100))
+        return
+      }
+      
+      const rect = container.getBoundingClientRect()
+      if (rect.height < 10 || rect.width < 10) {
+        pending.push(setTimeout(() => tryInitTab(tab, attempt + 1), 100))
+        return
+      }
+      
       if (!tabsRef.current[tab.id]) {
         initTerminal(tab.id, tab)
       }
-      requestAnimationFrame(() => {
+      
-        const entry = tabsRef.current[tab.id]
+      // Multiple fit attempts avec délais croissants
-        if (entry) entry.fitAddon.fit()
+      const fitAttempts = [0, 50, 100, 200, 400]
+      fitAttempts.forEach(delay => {
+        setTimeout(() => {
+          if (cancelled) return
+          const entry = tabsRef.current[tab.id]
+          if (entry && entry.fitAddon) {
+            try {
+              entry.fitAddon.fit()
+            } catch (e) { console.warn(`[Shell] fit attempt ${delay}ms failed:`, e) }
+          }
+        }, delay)
       })
     }
 
-    tryInit(0)
+    const wrapper = document.querySelector('.shell-layout')?.parentElement
-  }, [activeTab, tabs, initTerminal])
+    let observer
+    if (wrapper) {
+      observer = new MutationObserver(() => {
+        if (!wrapper.classList.contains('tab-hidden') && wrapper.offsetParent !== null) {
+          initPendingTabs()
+        }
+      })
+      observer.observe(wrapper, { attributes: true, attributeFilter: ['class'] })
+    }
+
+    return () => {
+      cancelled = true
+      pending.forEach(clearTimeout)
+      observer?.disconnect()
+    }
+  }, [tabs, initTerminal, initPendingTabs])
+
+  useEffect(() => {
+    const entry = tabsRef.current[activeTab]
+    if (entry) {
+      requestAnimationFrame(() => {
+        if (activeTabRef.current === activeTab) {
+          entry.fitAddon.fit()
+        }
+      })
+    }
+  }, [activeTab])
 
   useEffect(() => {
     const iv = setInterval(() => {
-      for (const tab of tabs) {
+      const wrapper = document.querySelector('.shell-layout')?.parentElement
-        const entry = tabsRef.current[tab.id]
+      if (wrapper && wrapper.classList.contains('tab-hidden')) return
-        if (entry) {
+      const entry = tabsRef.current[activeTabRef.current]
-          const el = document.getElementById(`terminal-${tab.id}`)
+      if (entry) {
-          if (el && el.offsetParent !== null) {
+        entry.fitAddon.fit()
-            entry.fitAddon.fit()
-          }
-        }
       }
     }, 2000)
     return () => clearInterval(iv)
   }, [tabs])
 
+  useEffect(() => {
+    return () => {
+      for (const [tabId, entry] of Object.entries(tabsRef.current)) {
+        entry._markDisposed?.()
+        if (entry.bufferSaveInterval) clearInterval(entry.bufferSaveInterval)
+        window.removeEventListener('resize', entry.onResize)
+        entry.resizeObserver?.disconnect()
+        entry.ws?.close()
+        entry.term?.dispose()
+      }
+      tabsRef.current = {}
+    }
+  }, [])
+
   useEffect(() => {
     const onKey = (e) => {
       if (e.target.tagName === 'INPUT' || e.target.tagName === 'TEXTAREA') return
-      if (!e.altKey) return
+      if (!e.altKey && !(e.key === 'Tab' && e.shiftKey)) return
+
+      if (e.key === 'Tab' && e.shiftKey) {
+        const shellTab = document.querySelector('.shell-layout')
+        if (!shellTab || shellTab.closest('.tab-hidden')) return
+        e.preventDefault()
+        const idx = tabs.findIndex(t => t.id === activeTab)
+        const next = (idx + 1) % tabs.length
+        setActiveTab(tabs[next].id)
+        return
+      }
 
       const num = parseInt(e.key)
       if (num >= 1 && num <= tabs.length) {
@@ -420,7 +646,7 @@ export default function Shell({ api }) {
     if (tabs.length >= MAX_TABS) return
     const id = nextIdRef.current++
     const newTab = { id, name: name || `${t('shell.localShell')} ${tabs.length}`, type: 'local', shell: shell || '', connected: false }
-    setTabs(prev => { const next = [...prev, newTab]; localStorage.setItem(TABS_STORAGE_KEY, JSON.stringify(next.map(t => ({ id: t.id, name: t.name, type: t.type, shell: t.shell, ai: t.ai || false, host: t.host, port: t.port, user: t.user, key_path: t.key_path })))); return next })
+    setTabs(prev => { const next = [...prev, newTab]; localStorage.setItem(TABS_STORAGE_KEY, JSON.stringify(next.map(t => ({ id: t.id, name: t.name, type: t.type, shell: t.shell, host: t.host, port: t.port, user: t.user, key_path: t.key_path })))); return next })
     setActiveTab(id)
     setShowMenu(false)
   }
@@ -438,32 +664,53 @@ export default function Shell({ api }) {
       key_path: conn.key_path || '',
       connected: false,
     }
-    setTabs(prev => { const next = [...prev, newTab]; localStorage.setItem(TABS_STORAGE_KEY, JSON.stringify(next.map(t => ({ id: t.id, name: t.name, type: t.type, shell: t.shell, ai: t.ai || false, host: t.host, port: t.port, user: t.user, key_path: t.key_path })))); return next })
+    setTabs(prev => { const next = [...prev, newTab]; localStorage.setItem(TABS_STORAGE_KEY, JSON.stringify(next.map(t => ({ id: t.id, name: t.name, type: t.type, shell: t.shell, host: t.host, port: t.port, user: t.user, key_path: t.key_path })))); return next })
     setActiveTab(id)
     setShowMenu(false)
   }
 
   const closeTab = (tabId, e) => {
     if (e) e.stopPropagation()
-    const tab = tabs.find(t => t.id === tabId)
-    if (!tab || tab.ai || tabs.length <= 1) return
 
-    if (tabsRef.current[tabId]) {
+    const entry = tabsRef.current[tabId]
-      const { ws, resizeObserver, onResize, term } = tabsRef.current[tabId]
+    if (entry) {
-      window.removeEventListener('resize', onResize)
+      entry._markDisposed?.()
-      resizeObserver.disconnect()
+      entry.saveBuffer?.()
-      ws.close()
+      if (entry.bufferSaveInterval) clearInterval(entry.bufferSaveInterval)
-      term.dispose()
+      window.removeEventListener('resize', entry.onResize)
+      entry.resizeObserver.disconnect()
+      entry.ws.close()
+      entry.term.dispose()
       delete tabsRef.current[tabId]
     }
 
+    try {
+      const savedBuffers = JSON.parse(sessionStorage.getItem(TERMINAL_BUFFER_KEY) || '{}')
+      delete savedBuffers[tabId]
+      sessionStorage.setItem(TERMINAL_BUFFER_KEY, JSON.stringify(savedBuffers))
+    } catch (e) { console.warn('[Shell] Buffer cleanup failed:', e) }
+
     setTabs(prev => {
+      if (prev.length <= 1) return prev
       const next = prev.filter(t => t.id !== tabId)
       if (activeTab === tabId && next.length > 0) {
         setActiveTab(next[next.length - 1].id)
       }
       return next
     })
+
+    // Redimensionner le nouveau tab actif
+    setTimeout(() => {
+      const newActiveTabId = next.length > 0 ? next[next.length - 1].id : null
+      if (newActiveTabId) {
+        const entry = tabsRef.current[newActiveTabId]
+        if (entry && entry.fitAddon) {
+          try {
+            entry.fitAddon.fit()
+          } catch (e) { console.warn('[Shell] fit after close failed:', e) }
+        }
+      }
+    }, 100)
   }
 
   const startRename = (tabId, e) => {
@@ -502,133 +749,105 @@ export default function Shell({ api }) {
     }
   }
 
-  const sendToTerminal = useCallback((code) => {
+  const sendToTerminal = useCallback((code, tabId) => {
-    const aiEntry = tabsRef.current[AI_TAB_ID]
+    const targetId = tabId || activeTabRef.current
-    if (aiEntry?.ws && aiEntry.ws.readyState === WebSocket.OPEN) {
+    const entry = tabsRef.current[targetId]
-      aiEntry.ws.send(JSON.stringify({ type: 'input', data: code + '\r' }))
+    if (!entry) {
+      console.warn(`[Shell] sendToTerminal: tab ${targetId} not ready. Queueing. tabsRef:`, Object.keys(tabsRef.current), 'activeTab:', activeTabRef.current, 'requested:', tabId)
+      if (!pendingCommandsRef.current[targetId]) pendingCommandsRef.current[targetId] = []
+      pendingCommandsRef.current[targetId].push(code)
+      return
     }
+    if (!entry.ws || entry.ws.readyState !== WebSocket.OPEN) {
+      console.warn(`[Shell] sendToTerminal: WS not open for tab ${targetId} (state=${entry.ws?.readyState}). Queueing.`)
+      if (!pendingCommandsRef.current[targetId]) pendingCommandsRef.current[targetId] = []
+      pendingCommandsRef.current[targetId].push(code)
+      return
+    }
+    console.log(`[Shell] sendToTerminal: tab ${targetId} ← ${code.length} chars`)
+    entry.ws.send(JSON.stringify({ type: 'input', data: code + '\r' }))
   }, [])
 
   const focusAiTerminal = useCallback(() => {
-    setActiveTab(AI_TAB_ID)
+    const entry = tabsRef.current[activeTabRef.current]
-    setTimeout(() => {
+    if (entry) entry.term.focus()
-      const entry = tabsRef.current[AI_TAB_ID]
-      if (entry) entry.term.focus()
-    }, 150)
   }, [])
 
-  const handleAiSend = async () => {
+  const _sendAiMessage = useCallback(async (text, fromEvent = false) => {
-    if (!aiInput.trim() || aiLoading || aiAtLimit) return
+    if (!text || !text.trim() || aiLoadingRef.current || aiAtLimit) return
-    const text = aiInput.trim()
+    const trimmed = text.trim()
-    setAiInput('')
+    aiLoadingRef.current = true
-    focusAiTerminal()
 
-    if (text === '/clear') {
+    if (!fromEvent) {
+      setAiInput('')
+      setTimeout(() => focusAiTerminal(), 0)
+    }
+
+    if (trimmed === '/clear') {
       try {
         await api.clearShellChat()
         setAiMessages([{ role: 'assistant', content: t('shell.aiWelcome') || 'Contexte effacé. Prêt.' }])
         setAiTokens(0)
         setAiAtLimit(false)
       } catch {}
+      aiLoadingRef.current = false
       return
     }
 
-    if (text === '/help') {
+    if (trimmed === '/help') {
       setAiMessages(prev => [...prev,
-        { role: 'user', content: text },
+        { role: 'user', content: trimmed },
         { role: 'assistant', content: 'Commandes disponibles:\n• /clear — Effacer la conversation\n• /help — Afficher l\'aide\n\nJe ne peux pas exécuter de code. Les blocs de code proposés peuvent être copiés ou envoyés directement au terminal actif.' }
       ])
+      aiLoadingRef.current = false
       return
     }
 
-    setAiMessages(prev => [...prev, { role: 'user', content: text }])
+    const currentTab = activeTabRef.current
+    console.log(`[Shell] _sendAiMessage: activeTab=${currentTab}, fromEvent=${fromEvent}, text="${trimmed.slice(0, 50)}"`)
+    setAiMessages(prev => [...prev, { role: 'user', content: trimmed, _tabId: currentTab }])
     setAiLoading(true)
 
     try {
       let accumulated = ''
-      await api.sendShellChat(text, {}, true, (partial) => {
+      await api.sendShellChat(trimmed, {}, true, (partial) => {
         accumulated = partial
         setAiMessages(prev => {
           const filtered = prev.filter(m => !m._streaming)
-          return [...filtered, { role: 'assistant', content: partial, _streaming: true }]
+          return [...filtered, { role: 'assistant', content: partial, _streaming: true, _tabId: currentTab }]
         })
       })
 
       setAiMessages(prev => {
         const filtered = prev.filter(m => !m._streaming)
-        return [...filtered, { role: 'assistant', content: accumulated }]
+        return [...filtered, { role: 'assistant', content: accumulated, _tabId: currentTab }]
       })
-      // Refresh token count
       api.getShellChatHistory().then(d => {
         setAiTokens(d.tokens || 0)
         setAiAtLimit(d.at_limit || false)
       }).catch(() => {})
     } catch (err) {
-      if (err.message.includes('context limit')) {
+      if (err.message?.includes('context limit')) {
         setAiAtLimit(true)
       }
       setAiMessages(prev => [...prev.filter(m => !m._streaming), { role: 'assistant', content: `Erreur: ${err.message}` }])
     }
     setAiLoading(false)
-  }
+    aiLoadingRef.current = false
+  }, [api, t, aiAtLimit, focusAiTerminal])
+
+  const handleAiSend = () => _sendAiMessage(aiInput, false)
 
   useEffect(() => {
     const handler = (e) => {
       const msg = e.detail?.message
       if (!msg) return
       setAiInput(msg)
-      setActiveTab(AI_TAB_ID)
+      setTimeout(() => _sendAiMessage(msg, true), 100)
-      setTimeout(() => {
-        handleAiSendDirect(msg)
-      }, 100)
     }
     window.addEventListener('ask-ai-terminal', handler)
     return () => window.removeEventListener('ask-ai-terminal', handler)
-  }, [])
+  }, [_sendAiMessage])
-
-  const handleAiSendDirect = async (text) => {
-    if (!text || aiLoading || aiAtLimit) return
-    setAiInput('')
-
-    if (text === '/clear') {
-      try {
-        await api.clearShellChat()
-        setAiMessages([{ role: 'assistant', content: t('shell.aiWelcome') || 'Contexte effacé. Prêt.' }])
-        setAiTokens(0)
-        setAiAtLimit(false)
-      } catch {}
-      return
-    }
-
-    setAiMessages(prev => [...prev, { role: 'user', content: text }])
-    setAiLoading(true)
-
-    try {
-      let accumulated = ''
-      await api.sendShellChat(text, {}, true, (partial) => {
-        accumulated = partial
-        setAiMessages(prev => {
-          const filtered = prev.filter(m => !m._streaming)
-          return [...filtered, { role: 'assistant', content: partial, _streaming: true }]
-        })
-      })
-
-      setAiMessages(prev => {
-        const filtered = prev.filter(m => !m._streaming)
-        return [...filtered, { role: 'assistant', content: accumulated }]
-      })
-      api.getShellChatHistory().then(d => {
-        setAiTokens(d.tokens || 0)
-        setAiAtLimit(d.at_limit || false)
-      }).catch(() => {})
-    } catch (err) {
-      if (err.message.includes('context limit')) {
-        setAiAtLimit(true)
-      }
-      setAiMessages(prev => [...prev.filter(m => !m._streaming), { role: 'assistant', content: `Erreur: ${err.message}` }])
-    }
-    setAiLoading(false)
-  }
 
   const handleAnalyze = async () => {
     setAnalyzing(true)
@@ -657,14 +876,13 @@ export default function Shell({ api }) {
             {tabs.map((tab, i) => (
               <div
                 key={tab.id}
-                className={`shell-tab ${activeTab === tab.id ? 'active' : ''} ${tab.ai ? 'ai-tab' : ''}`}
+                className={`shell-tab ${activeTab === tab.id ? 'active' : ''}`}
                 onClick={() => setActiveTab(tab.id)}
-                onDoubleClick={(e) => !tab.ai && startRename(tab.id, e)}
+                onDoubleClick={(e) => startRename(tab.id, e)}
               >
                 <span className={`connection-dot ${tab.connected ? 'on' : 'off'}`} />
-                {tab.ai && <Bot size={12} />}
+                {tab.type === 'ssh' && <Globe size={12} />}
-                {!tab.ai && tab.type === 'ssh' && <Globe size={12} />}
+                {tab.type === 'local' && <Monitor size={12} />}
-                {!tab.ai && tab.type === 'local' && <Monitor size={12} />}
                 {editingTab === tab.id ? (
                   <input
                     className="shell-tab-rename"
@@ -679,7 +897,7 @@ export default function Shell({ api }) {
                   <span className="shell-tab-name">{tab.name}</span>
                 )}
                 <span className="shell-tab-index">{i + 1}</span>
-                {!tab.ai && tabs.length > 1 && (
+                {tabs.length > 1 && (
                   <button
                     className="shell-tab-close"
                     onClick={(e) => closeTab(tab.id, e)}
@@ -757,8 +975,7 @@ export default function Shell({ api }) {
             <div
               key={tab.id}
               id={`terminal-${tab.id}`}
-              className="shell-xterm-instance"
+              className={`shell-xterm-instance${activeTab === tab.id ? ' active' : ''}`}
-              style={{ display: activeTab === tab.id ? 'block' : 'none' }}
             />
           ))}
         </div>
@@ -799,7 +1016,7 @@ export default function Shell({ api }) {
         </div>
         <div className="ai-panel-messages" ref={aiMessagesRef}>
           {aiMessages.map((msg, i) => (
-            <ShellAIMessage key={`${i}-${renderTick}`} msg={msg} sendToTerminal={sendToTerminal} renderTick={renderTick} />
+            <ShellAIMessage key={i} msg={msg} sendToTerminal={sendToTerminal} terminalTabId={msg._tabId || activeTab} />
           ))}
           {aiLoading && <div style={{ textAlign: 'center', padding: 8 }}><span className="spinner" /></div>}
         </div>
@@ -807,7 +1024,7 @@ export default function Shell({ api }) {
           <input
             value={aiInput}
             onChange={e => setAiInput(e.target.value)}
-            onKeyDown={e => e.key === 'Enter' && handleAiSend()}
+            onKeyDown={e => { if (e.key === 'Enter') { e.preventDefault(); e.stopPropagation(); handleAiSend() } }}
             placeholder={aiAtLimit ? '/clear pour continuer' : t('shell.askAi')}
             disabled={aiAtLimit && aiInput !== '/clear'}
           />
@@ -891,7 +1108,7 @@ export default function Shell({ api }) {
   )
 }
 
-function ShellAIMessage({ msg, sendToTerminal, renderTick }) {
+function ShellAIMessage({ msg, sendToTerminal, terminalTabId }) {
   const role = msg.role === 'user' ? 'user' : msg.role === 'system' ? 'system' : 'assistant'
   const content = msg.content || ''
 
@@ -910,21 +1127,21 @@ function ShellAIMessage({ msg, sendToTerminal, renderTick }) {
       {parts.map((part, i) => {
         if (part.type === 'code') {
           return (
-            <div key={`${i}-${renderTick}`} className="shell-code-block">
+            <div key={i} className="shell-code-block">
               {part.lang && <div className="shell-code-lang">{part.lang}</div>}
               <pre><code>{part.content}</code></pre>
               <div className="shell-code-actions">
                 <button onClick={() => navigator.clipboard.writeText(part.content)} title="Copier">
                   <Copy size={12} /> Copier
                 </button>
-                <button onClick={() => sendToTerminal(part.content)} title="Envoyer au terminal">
+                <button onClick={() => sendToTerminal(part.content, terminalTabId)} title="Envoyer au terminal">
                   <Send size={12} /> Terminal
                 </button>
               </div>
             </div>
           )
         }
-        return <span key={`${i}-${renderTick}`} dangerouslySetInnerHTML={{ __html: formatText(part.content) }} />
+        return <span key={i} dangerouslySetInnerHTML={{ __html: formatText(part.content) }} />
       })}
     </div>
   )

web/src/components/Studio.jsx

@@ -47,7 +47,16 @@ function renderContent(text) {
     lastIndex = match.index + full.length
   }
   if (lastIndex < text.length) {
-    parts.push({ type: 'text', content: text.slice(lastIndex) })
+    const remaining = text.slice(lastIndex)
+    const openBlock = remaining.match(/```(\w*)\n?([\s\S]*)$/)
+    if (openBlock) {
+      if (openBlock.index > 0) {
+        parts.push({ type: 'text', content: remaining.slice(0, openBlock.index) })
+      }
+      parts.push({ type: 'code', lang: openBlock[1] || '', content: openBlock[2] || '' })
+    } else {
+      parts.push({ type: 'text', content: remaining })
+    }
   }
   return parts
 }
@@ -188,7 +197,7 @@ function FeedItem({ msg }) {
     )
   }
 
-  const cleanContent = displayContent.replace(/<think[^>]*>[\s\S]*?<\/think>/gi, '')
+  let cleanContent = displayContent.replace(/<think[^>]*>[\s\S]*?<\/think>/gi, '')
 
   return (
     <div className={`feed-item ${msg.role}`}>
@@ -300,7 +309,6 @@ export default function Studio({ api }) {
   const [tokenInfo, setTokenInfo] = useState({ used: 0, max: 100000, summarizeAt: 80000 })
   const [contextCollapsed, setContextCollapsed] = useState(false)
   const [messagesCollapsed, setMessagesCollapsed] = useState(false)
-  const [renderTick, setRenderTick] = useState(0)
   const messagesEnd = useRef(null)
   const feedRef = useRef(null)
   const textareaRef = useRef(null)
@@ -333,12 +341,6 @@ export default function Studio({ api }) {
     messagesEnd.current?.scrollIntoView({ behavior: 'smooth' })
   }, [messages, streaming, streamThinking, streamToolCalls])
 
-  useEffect(() => {
-    const ms = loading ? 1000 : 5000
-    const iv = setInterval(() => setRenderTick(t => t + 1), ms)
-    return () => clearInterval(iv)
-  }, [loading])
-
   useEffect(() => {
     const onTab = (e) => {
       if (e.key !== 'Tab') return
@@ -450,15 +452,15 @@ export default function Studio({ api }) {
         api.getProviders().then(data => {
           const providers = data.providers || []
           const minimax = providers.find(p => p.name.toUpperCase() === 'MINIMAX')
-          const zai = providers.find(p => p.name.toUpperCase() === 'ZAI')
+          const mimo = providers.find(p => p.name.toUpperCase() === 'MIMO')
-          if (!minimax || !zai) {
+          if (!minimax || !mimo) {
-            setMessages(prev => [...prev, { id: Date.now().toString(), role: 'assistant', content: 'MiniMax et ZAI doivent être configurés pour utiliser `/model change`.', time: new Date().toISOString() }])
+            setMessages(prev => [...prev, { id: Date.now().toString(), role: 'assistant', content: 'MiniMax et MiMo doivent être configurés pour utiliser `/model change`.', time: new Date().toISOString() }])
             return
           }
           const active = providers.find(p => p.active)
           const activeName = active ? active.name.toUpperCase() : ''
-          const switchTo = activeName === 'MINIMAX' ? 'ZAI' : 'MINIMAX'
+          const switchTo = activeName === 'MINIMAX' ? 'MIMO' : 'MINIMAX'
-          const target = switchTo === 'MINIMAX' ? minimax : zai
+          const target = switchTo === 'MINIMAX' ? minimax : mimo
           api.saveProvider({ name: target.name, active: true }).then(() => {
             setMessages(prev => [...prev, { id: Date.now().toString(), role: 'assistant', content: `✓ Provider changé: **${target.name}** (${target.model})`, time: new Date().toISOString() }])
           }).catch(() => {
@@ -530,6 +532,8 @@ export default function Studio({ api }) {
         if (event && event.tool_call) {
           toolCalls = [...toolCalls, { call: event.tool_call, result: null }]
           setStreamToolCalls([...toolCalls])
+          accumulated = ''
+          setStreaming('')
           return
         }
         if (event && event.tool_result) {
@@ -556,6 +560,11 @@ export default function Studio({ api }) {
         aiMsg.content = JSON.stringify({
           content: finalContent,
           tool_calls: toolCalls.map(tc => tc.call),
+          tool_results: toolCalls.map(tc => ({
+            tool_call_id: tc.call?.tool_call_id,
+            result: tc.result?.content || '',
+            is_error: tc.result?.is_error || false,
+          })),
         })
       }
       setMessages(prev => [...prev, aiMsg])
@@ -639,7 +648,7 @@ export default function Studio({ api }) {
       return (
         <>
           {messages.slice(0, visibleCount).map(msg => (
-            <FeedItem key={`${msg.id}-${renderTick}`} msg={msg} />
+            <FeedItem key={msg.id} msg={msg} />
           ))}
           <div className="feed-collapsed-messages" onClick={handleToggleCollapsed}>
             <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2">
@@ -652,7 +661,7 @@ export default function Studio({ api }) {
       )
     }
     return messages.map(msg => (
-      <FeedItem key={`${msg.id}-${renderTick}`} msg={msg} />
+      <FeedItem key={msg.id} msg={msg} />
     ))
   }
 

web/src/i18n/en.js

@@ -16,6 +16,8 @@ const en = {
     switchWindow: 'Switch window',
     sendMessage: 'Send message',
     newLine: 'New line',
+    copy: 'Copy',
+    paste: 'Paste',
     runCommand: 'Run command',
     commandHistory: 'Command history',
   },

web/src/i18n/fr.js

@@ -16,6 +16,8 @@ const fr = {
     switchWindow: 'Changer de fen\u00eatre',
     sendMessage: 'Envoyer le message',
     newLine: 'Nouvelle ligne',
+    copy: 'Copier',
+    paste: 'Coller',
     runCommand: 'Ex\u00e9cuter',
     commandHistory: 'Historique',
   },

web/src/styles/global.css

@@ -155,7 +155,7 @@ input::placeholder { color: var(--text-disabled); }
 .header-clock { font-family: var(--font-mono); font-size: 12px; color: var(--accent); font-weight: 600; }
 
 .content { flex: 1; overflow: hidden; position: relative; }
-.content > div { height: 100%; }
+.content > div { position: absolute; inset: 0; overflow: hidden; }
 .tab-hidden { display: none; }
 
 .statusbar {
@@ -276,8 +276,8 @@ input::placeholder { color: var(--text-disabled); }
 .sidebar-tab:hover { background: var(--bg-card); color: var(--text-primary); }
 .sidebar-tab.active { background: var(--accent); color: #fff; font-weight: 600; }
 
-.shell-layout { display: flex; height: 100%; }
+.shell-layout { display: flex; height: 100%; overflow: hidden; }
-.shell-terminal-col { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
+.shell-terminal-col { flex: 1; display: flex; flex-direction: column; min-width: 0; overflow: hidden; }
 
 .shell-tabs-bar {
   display: flex; align-items: center; background: var(--bg-surface);
@@ -382,12 +382,18 @@ input::placeholder { color: var(--text-disabled); }
 }
 .shell-menu-divider { height: 1px; background: var(--border); margin: 4px 6px; }
 
-.shell-xterm-wrapper { flex: 1; background: var(--bg); overflow: hidden; position: relative; }
+.shell-xterm-wrapper { flex: 1; min-height: 0; background: var(--bg); overflow: hidden; position: relative; }
 .shell-xterm-instance {
-  position: absolute; inset: 0; padding: 4px;
+  position: absolute;
-  display: block !important;
+  inset: 0;
+  visibility: hidden;
+  pointer-events: none;
 }
-.shell-xterm-instance .xterm { height: 100%; padding: 4px; }
+.shell-xterm-instance.active {
+  visibility: visible;
+  pointer-events: auto;
+}
+.shell-xterm-instance .xterm { height: 100%; }
 
 .connection-dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex-shrink: 0; }
 .connection-dot.on { background: var(--success); box-shadow: 0 0 6px var(--success); }
@@ -396,7 +402,7 @@ input::placeholder { color: var(--text-disabled); }
 .shell-tab.ai-tab .shell-tab-name { color: var(--accent); }
 .shell-tab.ai-tab { border-bottom-color: var(--accent); }
 
-.shell-ai-col { width: 320px; border-left: 1px solid var(--border); background: var(--bg-surface); display: flex; flex-direction: column; flex-shrink: 0; }
+.shell-ai-col { width: 320px; max-width: 320px; border-left: 1px solid var(--border); background: var(--bg-surface); display: flex; flex-direction: column; flex-shrink: 0; overflow: hidden; }
 .ai-panel-header { padding: 12px 16px; border-bottom: 1px solid var(--border); font-weight: 700; font-size: 13px; color: var(--accent); display: flex; align-items: center; justify-content: space-between; }
 .shell-analyze-btn {
   display: flex; align-items: center; gap: 4px;
@@ -626,7 +632,7 @@ input::placeholder { color: var(--text-disabled); }
   position: relative;
   background: var(--bg-card); border: 1px solid var(--border);
   border-radius: var(--radius-lg); padding: 14px 16px;
-  display: flex; flex-direction: column; gap: 8px;
+  display: flex; flex-direction: column; justify-content: center; gap: 8px;
   overflow: hidden;
 }
 
@@ -691,34 +697,38 @@ input::placeholder { color: var(--text-disabled); }
 }
 
 /* Commands */
-.dash-cmd-list { display: flex; flex-direction: column; gap: 3px; max-height: 270px; overflow-y: auto; }
+.dash-cmd-card .dash-cmd-list { max-height: 220px; }
+.dash-cmd-list { display: flex; flex-direction: column; gap: 2px; overflow-y: auto; }
 .dash-cmd-row {
-  display: flex; align-items: center; gap: 6px;
+  display: flex; align-items: center; justify-content: space-between; gap: 8px;
-  padding: 3px 0; overflow: hidden;
+  padding: 5px 8px; border-radius: var(--radius-sm);
-}
+  background: var(--bg-surface); cursor: pointer;
-.dash-cmd-shell {
+  transition: background 0.12s;
-  font-size: 9px; font-family: var(--font-mono); color: var(--text-disabled);
-  background: var(--bg-input); padding: 1px 4px; border-radius: 3px;
-  text-transform: uppercase; flex-shrink: 0;
 }
+.dash-cmd-row:hover { background: var(--accent-bg); }
+.dash-cmd-left { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
 .dash-cmd-text {
-  font-size: 11px; font-family: var(--font-mono); color: var(--text-secondary);
+  font-size: 11px; font-family: var(--font-mono); color: var(--text-primary);
   white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
-  flex: 1; min-width: 0;
 }
+.dash-cmd-time { font-size: 9px; color: var(--text-disabled); }
+.dash-cmd-copy { font-size: 13px; color: var(--text-disabled); flex-shrink: 0; }
+.dash-cmd-row:hover .dash-cmd-copy { color: var(--accent); }
+
+.dash-cmd-freq { display: flex; flex-direction: column; gap: 6px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
+.dash-cmd-freq-title { font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--text-disabled); letter-spacing: 0.05em; margin-bottom: 2px; }
+.dash-cmd-freq-row {
+  display: flex; align-items: center; gap: 8px; cursor: pointer;
+  padding: 3px 4px; border-radius: var(--radius-sm);
+  transition: background 0.12s;
+}
+.dash-cmd-freq-row:hover { background: var(--accent-bg); }
+.dash-cmd-freq-name { font-size: 12px; font-weight: 600; font-family: var(--font-mono); color: var(--text-primary); width: 100px; flex-shrink: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.dash-cmd-freq-bar-wrap { flex: 1; height: 6px; background: var(--bg-input); border-radius: 3px; overflow: hidden; }
+.dash-cmd-freq-bar { height: 100%; background: var(--accent); border-radius: 3px; transition: width 0.3s ease; }
+.dash-cmd-freq-count { font-size: 10px; font-family: var(--font-mono); color: var(--accent); width: 28px; text-align: right; flex-shrink: 0; }
 
 .dash-cmd-top { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
-.dash-cmd-chip {
-  display: flex; align-items: center; gap: 6px;
-  padding: 6px 12px; border-radius: var(--radius);
-  background: var(--bg-surface); border: 1px solid var(--border);
-  cursor: pointer; transition: all 0.15s;
-}
-.dash-cmd-chip:hover { border-color: var(--accent-dim); background: var(--accent-bg); }
-.dash-cmd-chip-copied { border-color: var(--accent) !important; background: var(--accent-bg) !important; }
-.dash-cmd-chip-copied .dash-cmd-chip-name { color: var(--accent); }
-.dash-cmd-chip-name { font-size: 13px; font-weight: 700; font-family: var(--font-mono); color: var(--text-primary); }
-.dash-cmd-chip-count { font-size: 10px; font-family: var(--font-mono); color: var(--accent); }
 
 /* Services */
 .dash-services { display: flex; flex-direction: column; gap: 6px; }
@@ -1048,3 +1058,76 @@ input::placeholder { color: var(--text-disabled); }
   word-break: break-word;
   background: var(--bg);
 }
+
+/* === XTerm Custom Styling === */
+/* Styles for xterm.js integrated with Muyue theme */
+.shell-xterm-instance .xterm {
+  padding: 4px 8px;
+}
+
+.shell-xterm-instance .xterm-viewport {
+  background-color: var(--bg-base) !important;
+}
+
+.shell-xterm-instance .xterm-screen {
+  background-color: var(--bg-base);
+}
+
+/* Scrollbar styling for xterm */
+.shell-xterm-instance .xterm-viewport::-webkit-scrollbar {
+  width: 8px;
+}
+
+.shell-xterm-instance .xterm-viewport::-webkit-scrollbar-track {
+  background: var(--bg-surface);
+}
+
+.shell-xterm-instance .xterm-viewport::-webkit-scrollbar-thumb {
+  background: var(--accent-dim);
+  border-radius: 4px;
+}
+
+.shell-xterm-instance .xterm-viewport::-webkit-scrollbar-thumb:hover {
+  background: var(--accent-dark);
+}
+
+/* Selection styling */
+.shell-xterm-instance .xterm-selection {
+  background: var(--accent-dim) !important;
+}
+
+/* Focus ring styling */
+.shell-xterm-instance .xterm:focus .xterm-helper-text-container {
+  box-shadow: none;
+}
+
+/* Ensure consistent font rendering */
+.shell-xterm-instance .xterm .xterm-char-measure-element {
+  font-family: var(--font-mono) !important;
+}
+
+/* Bell animation styling */
+.shell-xterm-instance .xterm-bell {
+  animation: xterm-bell-flash 0.3s ease-out;
+}
+
+@keyframes xterm-bell-flash {
+  0% { opacity: 1; }
+  50% { opacity: 0.5; }
+  100% { opacity: 0; }
+}
+
+/* Cursor styling */
+.shell-xterm-instance .xterm-cursor {
+  outline: none !important;
+}
+
+/* Link styling for web links addon */
+.shell-xterm-instance .xterm-link {
+  color: var(--accent-light) !important;
+  text-decoration: underline;
+}
+
+.shell-xterm-instance .xterm-link:hover {
+  color: var(--accent-muted) !important;
+}