spectoflow 0.22.2 → 0.22.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "spectoflow",
-  "version": "0.22.2",
+  "version": "0.22.3",
   "description": "Agent-agnostic spec-driven development framework + real-time local control plane. Markdown artifacts, intent router, workflow-by-scope.",
   "keywords": [
     "spec-driven-development",

package/templates/dashboard/public/app.js

@@ -35,7 +35,7 @@ function connect(){
   es.onmessage = (ev)=>{
     let m; try{ m=JSON.parse(ev.data); }catch{ return; }
     if(m.type==='change'||m.type==='message') return scheduleLoad(); // messages live from runtime.messages
-    if(m.type==='run-start'||m.type==='run-end') { chatState.forEach(st=>{ st.rawBlock=null; }); return; }
+    if(m.type==='run-start'||m.type==='run-end') { chatState.forEach(st=>{ st.rawBlock=null; }); sseBusy=(m.type==='run-start'); updateChatBusyUI(); return; }
     if(m.type==='run-line') return appendRaw(m.chunk);          // raw output is ephemeral (not logged)
   };
   es.onerror = ()=>{ $('#sync').classList.add('offline'); $('#syncLabel').textContent='offline'; };
@@ -115,7 +115,11 @@ function setChat(open){
 // doRun/doOrchestrate default to the floating widget's textarea/select; the Chat tab has its own
 // #tabRunPrompt/#tabRunAgent (an id can't be shared by two elements) and passes them explicitly —
 // one code path, same endpoints, for both surfaces.
+// isChatBusy() also guards the Ctrl/Cmd+Enter keyboard shortcuts, which call doRun() directly and
+// would otherwise bypass the buttons' own disabled state.
+function isChatBusy(){ return sseBusy || (P&&P.runtime&&P.runtime.orchestration&&P.runtime.orchestration.status==='running'); }
 async function doRun(promptEl,agentEl){
+  if(isChatBusy()) return;
   promptEl=promptEl||$('#runPrompt'); agentEl=agentEl||$('#runAgent');
   const prompt=promptEl.value.trim(); if(!prompt) return;
   const agent=agentEl.value;
@@ -123,6 +127,7 @@ async function doRun(promptEl,agentEl){
   promptEl.value=''; // the prompt renders as a bubble from the message log
 }
 async function doOrchestrate(promptEl){
+  if(isChatBusy()) return;
   promptEl=promptEl||$('#runPrompt');
   const prompt=promptEl.value.trim(); if(!prompt) return;
   await fetch('/api/orchestrate',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({request:prompt})});
@@ -132,6 +137,7 @@ async function approve(decision){ await fetch('/api/orchestrate/approve',{method
 // ---- chat context management: condense the log via the agent, or wipe it (Chat tab only — the
 // floating widget stays "quick access", full controls live where there's room to read them) ----
 async function summarizeChat(agentEl){
+  if(isChatBusy()) return;
   const agent=(agentEl||$('#tabRunAgent'))?.value;
   flash();
   await fetch('/api/chat/summarize',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({agent})});
@@ -145,6 +151,23 @@ async function addComment(id,text,action){ flash(); await fetch('/api/task/'+enc
 async function toggleStep(name){ flash(); await fetch('/api/workflow/toggle',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({name})}); }
 function flash(){ const s=$('#sync'); s.classList.add('saving'); $('#syncLabel').textContent='writing…'; setTimeout(()=>{ s.classList.remove('saving'); $('#syncLabel').textContent='live'; },800); }
 
+// ---- "agent is running" state — no visible feedback used to exist between clicking Send/
+// Orchestrate/Summarize and the result showing up (the only outward sign, on Windows, was a real
+// console window popping up behind the agent's own spawn — now suppressed, so this replaces it):
+// a small spinner + disabled buttons for as long as an agent run is actually in flight. Driven by
+// two signals — SSE run-start/run-end (Send, Summarize, each individual Orchestrate step) and
+// runtime.orchestration.status (stays 'running' across the gaps between orchestrate steps, which
+// SSE run-start/run-end alone would flicker through). ----
+let sseBusy=false;
+function updateChatBusyUI(){
+  const orchStatus=P&&P.runtime&&P.runtime.orchestration&&P.runtime.orchestration.status;
+  const busy=sseBusy||orchStatus==='running';
+  document.body.classList.toggle('chat-busy',!!busy);
+  [$('#runBtn'),$('#orchBtn'),$('#widgetSummarizeBtn'),$('#tabRunBtn'),$('#tabOrchBtn'),$('#tabSummarizeBtn')].forEach(b=>{ if(b) b.disabled=!!busy; });
+  const tabStatus=$('#tabChatStatus'); if(tabStatus) tabStatus.hidden=!busy;
+  const widgetStatus=$('#widgetChatStatus'); if(widgetStatus) widgetStatus.hidden=!busy;
+}
+
 function render(){
   const c = P.config||{};
   i18nSetLang(c.language||'en'); updateStatusLabels(); // language drives the whole UI, not just agent output
@@ -165,7 +188,7 @@ function render(){
   if(meter) meter.title=`${t('kpi.globalProgress')}: ${s.pct}% (${s.done}/${s.total} ${t('kpi.tasksLabel')})`;
   renderOverview(); renderBoard(); renderBacklog(); renderWorkflow(); renderTeam();
   renderChatLog($('#chatLog')); renderChatLog($('#chatTabLog'));
-  renderSidebar(); renderRequests(); renderAttention(); renderInfo(); renderDocs(); renderSettings(); renderFiles(); applySideHidden();
+  renderSidebar(); renderRequests(); renderAttention(); renderInfo(); renderDocs(); renderSettings(); renderFiles(); applySideHidden(); updateChatBusyUI();
   renderCustomDashboards(); // adds/removes nav tabs + panels before applyActiveTab() below reads them
   applyActiveTab(); // re-apply the current tab so an SSE-driven re-render never resets to Board
   applyI18nStatic(); // re-translate the static markup (nav, headers, placeholders…) for this tick's language

package/templates/dashboard/public/i18n.js

@@ -91,7 +91,7 @@ en: {
   'chat.idle':'Type a request — the agent runs headless in this project with full memory (<code>CLAUDE.md → AGENTS.md</code>) and updates the board live.',
   'chat.inputPlaceholder':'e.g. Add a login feature with email + password',
   'chat.orchestrateTitle':'Walk the enabled workflow','chat.summarizeTitle':'Condense the recent activity into a summary','chat.clearTitle':'Clear the chat log',
-  'chat.warn':'⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.',
+  'chat.warn':'⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.','chat.running':'Agent running…',
   'info.title':'Info','info.sub':'Project overview — configuration, counts, specs and active workflow.',
   'info.project':'Project','info.projectType':'Project type','info.mode':'Mode','info.language':'Language',
   'info.activeAgent':'Active agent','info.runners':'Runners','info.noRunners':'No runners configured.',
@@ -203,7 +203,7 @@ fr: {
   'chat.idle':'Tapez une demande — l’agent s’exécute sans supervision dans ce projet avec toute sa mémoire (<code>CLAUDE.md → AGENTS.md</code>) et met le tableau à jour en direct.',
   'chat.inputPlaceholder':'ex. Ajouter une fonctionnalité de connexion par email + mot de passe',
   'chat.orchestrateTitle':'Parcourir le workflow activé','chat.summarizeTitle':'Condenser l’activité récente en un résumé','chat.clearTitle':'Effacer le journal de discussion',
-  'chat.warn':'⚠ Lance un agent réel (<code>config.json → runners</code>) qui peut modifier des fichiers et exécuter des commandes.',
+  'chat.warn':'⚠ Lance un agent réel (<code>config.json → runners</code>) qui peut modifier des fichiers et exécuter des commandes.','chat.running':'Agent en cours d’exécution…',
   'info.title':'Infos','info.sub':'Vue d’ensemble du projet — configuration, comptages, specs et workflow actif.',
   'info.project':'Projet','info.projectType':'Type de projet','info.mode':'Mode','info.language':'Langue',
   'info.activeAgent':'Agent actif','info.runners':'Runners','info.noRunners':'Aucun runner configuré.',
@@ -315,7 +315,7 @@ es: {
   'chat.idle':'Escribe una solicitud — el agente se ejecuta sin supervisión en este proyecto con toda su memoria (<code>CLAUDE.md → AGENTS.md</code>) y actualiza el tablero en vivo.',
   'chat.inputPlaceholder':'p. ej. Añadir un inicio de sesión con email + contraseña',
   'chat.orchestrateTitle':'Recorrer el workflow activado','chat.summarizeTitle':'Condensar la actividad reciente en un resumen','chat.clearTitle':'Borrar el registro del chat',
-  'chat.warn':'⚠ Lanza un agente real (<code>config.json → runners</code>) que puede modificar archivos y ejecutar comandos.',
+  'chat.warn':'⚠ Lanza un agente real (<code>config.json → runners</code>) que puede modificar archivos y ejecutar comandos.','chat.running':'Agente en ejecución…',
   'info.title':'Info','info.sub':'Visión general del proyecto — configuración, recuentos, specs y workflow activo.',
   'info.project':'Proyecto','info.projectType':'Tipo de proyecto','info.mode':'Modo','info.language':'Idioma',
   'info.activeAgent':'Agente activo','info.runners':'Runners','info.noRunners':'No hay runners configurados.',
@@ -427,7 +427,7 @@ de: {
   'chat.idle':'Geben Sie eine Anfrage ein — der Agent läuft eigenständig in diesem Projekt mit vollem Gedächtnis (<code>CLAUDE.md → AGENTS.md</code>) und aktualisiert das Board live.',
   'chat.inputPlaceholder':'z. B. Login mit E-Mail + Passwort hinzufügen',
   'chat.orchestrateTitle':'Den aktivierten Workflow durchlaufen','chat.summarizeTitle':'Die letzten Aktivitäten zu einer Zusammenfassung verdichten','chat.clearTitle':'Chat-Verlauf löschen',
-  'chat.warn':'⚠ Startet einen echten Agenten (<code>config.json → runners</code>), der Dateien ändern und Befehle ausführen kann.',
+  'chat.warn':'⚠ Startet einen echten Agenten (<code>config.json → runners</code>), der Dateien ändern und Befehle ausführen kann.','chat.running':'Agent läuft…',
   'info.title':'Info','info.sub':'Projektübersicht — Konfiguration, Zahlen, Specs und aktiver Workflow.',
   'info.project':'Projekt','info.projectType':'Projekttyp','info.mode':'Modus','info.language':'Sprache',
   'info.activeAgent':'Aktiver Agent','info.runners':'Runner','info.noRunners':'Keine Runner konfiguriert.',
@@ -539,7 +539,7 @@ pt: {
   'chat.idle':'Escreva um pedido — o agente corre sem supervisão neste projeto com toda a sua memória (<code>CLAUDE.md → AGENTS.md</code>) e atualiza o painel em direto.',
   'chat.inputPlaceholder':'ex. Adicionar login com email + palavra-passe',
   'chat.orchestrateTitle':'Percorrer o workflow ativado','chat.summarizeTitle':'Condensar a atividade recente num resumo','chat.clearTitle':'Limpar o registo do chat',
-  'chat.warn':'⚠ Inicia um agente real (<code>config.json → runners</code>) que pode alterar ficheiros e executar comandos.',
+  'chat.warn':'⚠ Inicia um agente real (<code>config.json → runners</code>) que pode alterar ficheiros e executar comandos.','chat.running':'Agente em execução…',
   'info.title':'Info','info.sub':'Visão geral do projeto — configuração, contagens, specs e workflow ativo.',
   'info.project':'Projeto','info.projectType':'Tipo de projeto','info.mode':'Modo','info.language':'Idioma',
   'info.activeAgent':'Agente ativo','info.runners':'Runners','info.noRunners':'Nenhum runner configurado.',
@@ -651,7 +651,7 @@ it: {
   'chat.idle':'Digita una richiesta — l’agente viene eseguito senza supervisione in questo progetto con tutta la sua memoria (<code>CLAUDE.md → AGENTS.md</code>) e aggiorna la bacheca in diretta.',
   'chat.inputPlaceholder':'es. Aggiungi un login con email + password',
   'chat.orchestrateTitle':'Percorri il workflow attivato','chat.summarizeTitle':'Condensa l’attività recente in un riassunto','chat.clearTitle':'Cancella il registro della chat',
-  'chat.warn':'⚠ Avvia un agente reale (<code>config.json → runners</code>) che può modificare file ed eseguire comandi.',
+  'chat.warn':'⚠ Avvia un agente reale (<code>config.json → runners</code>) che può modificare file ed eseguire comandi.','chat.running':'Agente in esecuzione…',
   'info.title':'Info','info.sub':'Panoramica del progetto — configurazione, conteggi, specs e workflow attivo.',
   'info.project':'Progetto','info.projectType':'Tipo di progetto','info.mode':'Modalità','info.language':'Lingua',
   'info.activeAgent':'Agente attivo','info.runners':'Runner','info.noRunners':'Nessun runner configurato.',

package/templates/dashboard/public/index.html

@@ -270,6 +270,7 @@
           </div>
         </div>
         <p class="chat-warn" data-i18n-html="chat.warn">⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.</p>
+        <p class="chat-status" id="tabChatStatus" hidden><span class="spinner" aria-hidden="true"></span><span data-i18n="chat.running">Agent running…</span></p>
       </div>
     </section>
 
@@ -389,6 +390,7 @@
       <button id="orchBtn" class="btn chat-send" data-i18n-title="chat.orchestrateTitle" data-i18n="action.orchestrate" title="Walk the enabled workflow">Orchestrate</button>
     </div>
     <p class="chat-warn" data-i18n-html="chat.warn">⚠ Launches a real agent (<code>config.json → runners</code>) that can modify files &amp; run commands.</p>
+    <p class="chat-status" id="widgetChatStatus" hidden><span class="spinner" aria-hidden="true"></span><span data-i18n="chat.running">Agent running…</span></p>
   </div>
 
   <div class="drawer" id="drawer" aria-hidden="true">

package/templates/dashboard/public/styles.css

@@ -304,7 +304,10 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .files-create-form .bl-add-input { width:100%; }
 .files-create-actions { display:flex; gap:8px; }
 .files-create-actions .btn { font-size:12px; padding:6px 11px; }
-.files-tree { flex:1; min-height:0; overflow:auto; border:1px solid var(--line); border-radius:var(--radius); padding:8px; background:var(--surface); }
+.files-tree { flex:1; min-height:0; overflow:auto; border:1px solid var(--line); border-radius:var(--radius); padding:8px; background:var(--surface); scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
+.files-tree::-webkit-scrollbar { width:8px; }
+.files-tree::-webkit-scrollbar-thumb { background:var(--line); border-radius:8px; }
+.files-tree::-webkit-scrollbar-track { background:transparent; }
 .files-content-col { flex:1; min-width:0; display:flex; flex-direction:column; min-height:0; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); overflow:hidden; }
 .files-empty,.files-binary { padding:40px; text-align:center; color:var(--faint); font-style:italic; }
 .f-row { display:flex; align-items:center; gap:6px; padding:4px 6px; border-radius:6px; cursor:pointer; font-size:12.5px; white-space:nowrap; color:var(--muted); }
@@ -320,6 +323,10 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .files-actions { display:flex; gap:8px; flex-shrink:0; }
 .files-actions .btn { font-size:12px; padding:6px 11px; }
 .files-body-col { flex:1; min-height:0; display:flex; flex-direction:column; }
+.files-view,.files-editor { scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
+.files-view::-webkit-scrollbar,.files-editor::-webkit-scrollbar { width:8px; }
+.files-view::-webkit-scrollbar-thumb,.files-editor::-webkit-scrollbar-thumb { background:var(--line); border-radius:8px; }
+.files-view::-webkit-scrollbar-track,.files-editor::-webkit-scrollbar-track { background:transparent; }
 .files-view { flex:1; min-height:0; overflow:auto; padding:16px 20px; }
 .files-editor { flex:1; min-height:0; width:100%; border:0; resize:none; padding:16px 20px; font-family:var(--mono); font-size:12.5px; line-height:1.6; background:var(--surface); color:var(--ink); outline:none; }
 .files-iframe { flex:1; min-height:0; width:100%; border:0; background:#fff; }
@@ -457,6 +464,13 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .chat-ta:focus { outline:2px solid var(--cool); outline-offset:1px; }
 .chat-send { flex:0 0 auto; align-self:auto; padding:8px 16px; }
 .chat-warn { font-size:10.5px; color:var(--signal); margin:6px 12px 10px; }
+body.chat-busy .chat-warn { display:none; } /* the running status below replaces it — one message at a time */
+.chat-status { display:flex; align-items:center; gap:8px; font-size:11.5px; color:var(--signal); margin:6px 12px 10px; font-weight:600; }
+.chat-status[hidden] { display:none; }
+.chat-status .spinner { width:12px; height:12px; border-radius:50%; flex-shrink:0; border:2px solid color-mix(in srgb,var(--signal) 28%,transparent); border-top-color:var(--signal); animation:chat-spin .7s linear infinite; }
+@keyframes chat-spin { to { transform:rotate(360deg); } }
+.chat-send:disabled,.mini-btn:disabled { opacity:.5; cursor:not-allowed; }
+@media (prefers-reduced-motion: reduce) { .chat-status .spinner { animation:none; } }
 .approval { display:flex; flex-direction:column; gap:8px; padding:10px 12px; background:var(--surface-2); border:1px solid color-mix(in srgb,var(--signal) 40%,var(--line)); border-radius:var(--radius); box-shadow:var(--shadow); }
 .approval .c-actions { display:flex; gap:8px; }
 #orchBtn,#tabOrchBtn { background:var(--cool); color:#04202a; border-color:transparent; font-weight:600; }
@@ -478,7 +492,7 @@ body { background:var(--bg); color:var(--ink); font-family:var(--sans); font-siz
 .chat-tab-input { display:flex; gap:10px; margin-top:10px; }
 .chat-tab-input .chat-ta { flex:1; min-height:56px; max-height:180px; }
 .chat-tab-actions { display:flex; flex-direction:column; gap:8px; flex-shrink:0; }
-.chat-tab-wrap .chat-warn { margin:8px 0 0; }
+.chat-tab-wrap .chat-warn,.chat-tab-wrap .chat-status { margin:8px 0 0; }
 @media (max-width:640px){ .chat-tab-input { flex-direction:column; } .chat-tab-actions { flex-direction:row; } }
 
 /* ---- chart & panel motion --------------------------------------------- */

package/templates/dashboard/runner.js

@@ -77,7 +77,10 @@ function startRun(root, { prompt, agent, logPrompt = true }, emit) {
   runStart(root, run); emit({ type: 'run-start', run }); emit({ type: 'change' });
 
   let child;
-  try { child = spawn(parts[0], [...parts.slice(1), p], { cwd: root, env: process.env }); }
+  // windowsHide: without it, spawning a .cmd-shimmed CLI (e.g. a global npm install of `claude` on
+  // Windows) pops up a real, empty console window on top of the browser — jarring, and pointless
+  // since stdout/stderr are already piped and captured below, never read from that window anyway.
+  try { child = spawn(parts[0], [...parts.slice(1), p], { cwd: root, env: process.env, windowsHide: true }); }
   catch (e) {
     runEnd(root, runId, 1);
     emit({ type: 'run-line', runId, chunk: 'spawn error: ' + e.message + '\n' });

package/templates/dashboard/summarize.js

@@ -38,9 +38,15 @@ function runSummarize(root, { agent } = {}, emit) {
     + '\n\n' + formatLog(messages);
 
   const parts = cmdStr.split(/\s+/).filter(Boolean);
+  const runId = 'summarize-' + Date.now().toString(36);
+  // Emitted before the spawn attempt (same order runner.js uses) so the client's "agent running"
+  // indicator lights up immediately, and so a spawn failure below still gets a matching run-end
+  // rather than leaving that indicator stuck on.
+  if (emit) emit({ type: 'run-start', run: { id: runId } });
   let child;
-  try { child = spawn(parts[0], [...parts.slice(1), prompt], { cwd: root, env: process.env }); }
-  catch (e) { return { error: e.message }; }
+  // windowsHide: without it, spawning a .cmd-shimmed CLI on Windows pops up a real console window.
+  try { child = spawn(parts[0], [...parts.slice(1), prompt], { cwd: root, env: process.env, windowsHide: true }); }
+  catch (e) { if (emit) emit({ type: 'run-end', runId, code: 1 }); return { error: e.message }; }
   try { child.stdin && child.stdin.end(); } catch {}
 
   let out = '';
@@ -63,7 +69,7 @@ function runSummarize(root, { agent } = {}, emit) {
     fresh.messages = (fresh.messages || []).filter((m) => !summarizedIds.has(m.id));
     fresh.messages.push(summary);
     store.writeRuntime(root, fresh);
-    if (emit) { emit({ type: 'message', message: summary }); emit({ type: 'change' }); }
+    if (emit) { emit({ type: 'run-end', runId, code }); emit({ type: 'message', message: summary }); emit({ type: 'change' }); }
   });
   return { child };
 }