@yemi33/squad 0.1.13 → 0.1.14

package/dashboard.html

@@ -47,6 +47,43 @@
   .status-badge.working { background: rgba(210,153,34,0.15); color: var(--yellow); border: 1px solid var(--yellow); animation: pulse 1.5s infinite; }
   .status-badge.done { background: rgba(63,185,80,0.15); color: var(--green); border: 1px solid var(--green); }
   .agent-action { font-size: 11px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
+  .modal-qa { border-top: 1px solid var(--border); padding: 10px 20px; }
+  .modal-qa-thread { max-height: 200px; overflow-y: auto; margin-bottom: 8px; }
+  .modal-qa-q { font-size: 12px; color: var(--blue); margin-bottom: 4px; font-weight: 600; }
+  .modal-qa-q .selection-ref { font-weight: 400; color: var(--muted); font-style: italic; display: block; font-size: 10px; margin-top: 2px; }
+  .modal-qa-a { font-size: 12px; color: var(--text); margin-bottom: 12px; padding: 8px 10px; background: var(--surface2); border-radius: 6px; border-left: 2px solid var(--blue); white-space: pre-wrap; word-break: break-word; line-height: 1.5; }
+  .modal-qa-loading { font-size: 11px; color: var(--muted); padding: 8px 10px; display: flex; align-items: center; gap: 8px; }
+  .modal-qa-loading .dot-pulse { display: inline-flex; gap: 3px; }
+  .modal-qa-loading .dot-pulse span { width: 5px; height: 5px; background: var(--blue); border-radius: 50%; animation: dotPulse 1.2s infinite; }
+  .modal-qa-loading .dot-pulse span:nth-child(2) { animation-delay: 0.2s; }
+  .modal-qa-loading .dot-pulse span:nth-child(3) { animation-delay: 0.4s; }
+  @keyframes dotPulse { 0%, 80%, 100% { opacity: 0.3; transform: scale(0.8); } 40% { opacity: 1; transform: scale(1); } }
+  .modal-qa-input-wrap { display: flex; gap: 6px; }
+  .modal-qa-input { flex: 1; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 6px 10px; font-size: 12px; color: var(--text); font-family: inherit; }
+  .modal-qa-input:focus { border-color: var(--blue); outline: none; }
+  .modal-qa-btn { background: var(--blue); color: #fff; border: none; border-radius: 4px; padding: 6px 14px; font-size: 12px; cursor: pointer; }
+  .modal-qa-btn:hover { opacity: 0.9; }
+  .modal-qa-btn:disabled { opacity: 0.4; cursor: not-allowed; }
+  .ask-selection-btn { display: none; position: fixed; z-index: 500; background: var(--blue); color: #fff; font-size: 11px; padding: 5px 12px; border-radius: 4px; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,0.3); }
+  .ask-selection-btn:hover { opacity: 0.9; }
+  .plan-card { background: var(--surface2); border: 1px solid var(--border); border-radius: 6px; padding: 12px; margin-bottom: 8px; }
+  .plan-card.awaiting { border-left: 3px solid var(--yellow, #d29922); }
+  .plan-card.approved { border-left: 3px solid var(--green); }
+  .plan-card.rejected { border-left: 3px solid var(--red); opacity: 0.6; }
+  .plan-card.revision-requested { border-left: 3px solid var(--purple, #a855f7); }
+  .plan-card-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
+  .plan-card-title { font-size: 13px; font-weight: 600; color: var(--text); }
+  .plan-card-meta { font-size: 10px; color: var(--muted); margin-top: 4px; display: flex; gap: 8px; flex-wrap: wrap; }
+  .plan-card-actions { display: flex; gap: 4px; margin-top: 8px; flex-wrap: wrap; }
+  .plan-btn { font-size: 11px; padding: 4px 10px; border-radius: 4px; cursor: pointer; border: 1px solid var(--border); background: var(--surface); color: var(--text); transition: all 0.15s; }
+  .plan-btn:hover { border-color: var(--text); }
+  .plan-btn.approve { color: var(--green); border-color: var(--green); }
+  .plan-btn.approve:hover { background: rgba(63,185,80,0.1); }
+  .plan-btn.revise { color: var(--yellow, #d29922); border-color: var(--yellow, #d29922); }
+  .plan-btn.revise:hover { background: rgba(210,153,34,0.1); }
+  .plan-btn.reject { color: var(--red); border-color: var(--red); }
+  .plan-btn.reject:hover { background: rgba(248,81,73,0.1); }
+  .plan-feedback-input { width: 100%; margin-top: 6px; padding: 6px 8px; font-size: 11px; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; color: var(--text); font-family: inherit; resize: vertical; min-height: 50px; }
   .token-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; margin-bottom: 12px; }
   .token-tile { background: var(--surface2); border: 1px solid var(--border); border-radius: 6px; padding: 10px 12px; }
   .token-tile-label { font-size: 10px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.5px; }
@@ -450,10 +487,12 @@
     <div class="cmd-hints">
       <span><code>@agent</code> assign</span>
       <span><code>@everyone</code> fan-out</span>
+      <span><code>#project</code> target</span>
       <span><code>!high</code> / <code>!low</code> priority</span>
-      <span><code>/note</code> team note</span>
+      <span><code>/plan</code> feature plan</span>
       <span><code>/prd</code> PRD item</span>
-      <span><code>#project</code> target project</span>
+      <span><code>/note</code> team note</span>
+      <span>or just type a task</span>
       <button class="cmd-history-btn" onclick="cmdShowHistory()">Past Commands</button>
     </div>
     <div class="cmd-toast" id="cmd-toast"></div>
@@ -481,6 +520,11 @@
     <div id="pr-content"><p class="pr-empty">No pull requests yet.</p></div>
   </section>
 
+  <section>
+    <h2>Plans <span class="count" id="plans-count">0</span></h2>
+    <div id="plans-list"><p class="empty">No plans yet. Use /plan in the command center to create one.</p></div>
+  </section>
+
   <section>
     <h2>Notes Inbox <span class="count" id="inbox-count">0</span></h2>
     <div class="inbox-list" id="inbox-list">Loading...</div>
@@ -555,9 +599,19 @@
       </div>
     </div>
     <div class="modal-body" id="modal-body"></div>
+    <div class="modal-qa" id="modal-qa">
+      <div class="modal-qa-thread" id="modal-qa-thread"></div>
+      <div class="modal-qa-input-wrap">
+        <input type="text" class="modal-qa-input" id="modal-qa-input" placeholder="Ask about this document (or select text first)..." onkeydown="if(event.key==='Enter')modalAskSubmit()">
+        <button class="modal-qa-btn" id="modal-qa-btn" onclick="modalAskSubmit()">Ask</button>
+      </div>
+    </div>
   </div>
 </div>
 
+<!-- Floating "Ask about selection" button -->
+<div class="ask-selection-btn" id="ask-selection-btn" onclick="modalAskAboutSelection()">Ask about this</div>
+
 <script>
 let inboxData = [];
 let agentData = [];
@@ -668,7 +722,26 @@ function renderDetailContent(detail, tab) {
   } else if (tab === 'charter') {
     el.innerHTML = '<div class="section">' + escHtml(detail.charter || 'No charter found.') + '</div>';
   } else if (tab === 'history') {
-    el.innerHTML = '<div class="section">' + escHtml(detail.history || 'No history yet.') + '</div>';
+    let html = '';
+    // Recent dispatch results
+    if (detail.recentDispatches && detail.recentDispatches.length > 0) {
+      html += '<h4>Recent Dispatches</h4><table class="pr-table" style="margin-bottom:16px"><thead><tr><th>Task</th><th>Type</th><th>Result</th><th>Completed</th></tr></thead><tbody>';
+      detail.recentDispatches.forEach(d => {
+        const isError = d.result === 'error';
+        const color = isError ? 'var(--red)' : 'var(--green)';
+        const reason = d.reason ? ' title="' + escHtml(d.reason) + '"' : '';
+        html += '<tr>' +
+          '<td style="max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="' + escHtml(d.task) + '">' + escHtml(d.task.slice(0, 80)) + '</td>' +
+          '<td><span class="dispatch-type ' + d.type + '">' + escHtml(d.type) + '</span></td>' +
+          '<td style="color:' + color + '"' + reason + '>' + escHtml(d.result) + (isError && d.reason ? ' <span style="font-size:10px;color:var(--muted)">(' + escHtml(d.reason.slice(0, 50)) + ')</span>' : '') + '</td>' +
+          '<td style="font-size:10px;color:var(--muted)">' + (d.completed_at ? new Date(d.completed_at).toLocaleString() : '') + '</td>' +
+        '</tr>';
+      });
+      html += '</tbody></table>';
+    }
+    // Raw history.md
+    html += '<h4>Task History</h4><div class="section">' + escHtml(detail.history || 'No history yet.') + '</div>';
+    el.innerHTML = html;
   } else if (tab === 'output') {
     el.innerHTML = '<div class="section">' + escHtml(detail.outputLog || 'No output log. The coordinator will save agent output here when tasks complete.') + '</div>';
   }
@@ -932,7 +1005,15 @@ function openModal(i) {
   document.getElementById('modal-body').textContent = item.content;
   document.getElementById('modal').classList.add('open');
 }
-function closeModal() { document.getElementById('modal').classList.remove('open'); }
+function closeModal() {
+  document.getElementById('modal').classList.remove('open');
+  // Clear Q&A state
+  _modalDocContext = { title: '', content: '', selection: '' };
+  document.getElementById('modal-qa-thread').innerHTML = '';
+  document.getElementById('modal-qa-input').value = '';
+  document.getElementById('modal-qa-input').placeholder = 'Ask about this document (or select text first)...';
+  document.getElementById('ask-selection-btn').style.display = 'none';
+}
 
 document.addEventListener('keydown', e => {
   if (e.key === 'Escape') { closeDetail(); closeModal(); }
@@ -1173,9 +1254,9 @@ async function refresh() {
     renderMetrics(data.metrics || {});
     renderWorkItems(data.workItems || []);
     renderSkills(data.skills || []);
-    // Refresh KB less frequently (every 3rd cycle = ~12s)
+    // Refresh KB and plans less frequently (every 3rd cycle = ~12s)
     if (!window._kbRefreshCount) window._kbRefreshCount = 0;
-    if (window._kbRefreshCount++ % 3 === 0) refreshKnowledgeBase();
+    if (window._kbRefreshCount++ % 3 === 0) { refreshKnowledgeBase(); refreshPlans(); }
   } catch(e) { console.error('refresh error', e); }
 }
 
@@ -1526,7 +1607,7 @@ function detectWorkItemType(text) {
   const t = text.toLowerCase();
   const patterns = [
     { type: 'ask',      words: ['explain', 'why does', 'why is', 'what does', 'how do i', 'how do you', 'what\'s the', 'tell me', 'can you explain', 'walk me through'] },
-    { type: 'explore',  words: ['explore', 'investigate', 'understand', 'analyze', 'audit', 'document', 'architecture', 'how does', 'what is', 'look into', 'research', 'survey', 'map out', 'codebase'] },
+    { type: 'explore',  words: ['explore', 'investigate', 'understand', 'analyze', 'audit', 'document', 'architecture', 'how does', 'what is', 'look into', 'research', 'survey', 'map out', 'codebase', 'make a note of', 'find out'] },
     { type: 'fix',      words: ['fix', 'bug', 'broken', 'crash', 'error', 'issue', 'patch', 'repair', 'resolve', 'regression', 'failing', 'doesn\'t work', 'not working'] },
     { type: 'review',   words: ['review', 'code review', 'check pr', 'look at pr', 'audit code', 'inspect'] },
     { type: 'test',     words: ['test', 'write tests', 'add tests', 'unit test', 'e2e test', 'coverage', 'testing', 'build', 'run locally', 'localhost', 'start the', 'spin up', 'verify', 'check if it works'] },
@@ -1557,9 +1638,9 @@ function cmdParseInput(raw) {
   if (/^\/decide\b/i.test(text) || /^\/note\b/i.test(text) || rememberPattern.test(text)) {
     result.intent = 'note';
     text = text.replace(/^\/decide\s*/i, '').replace(/^\/note\s*/i, '').replace(rememberPattern, '').trim();
-  } else if (/^\/plan\b/i.test(text)) {
+  } else if (/^\/plan\b/i.test(text) || /^(make a plan|plan out|plan for|plan how|create a plan|design a plan|come up with a plan|draft a plan|write a plan)\b/i.test(text)) {
     result.intent = 'plan';
-    text = text.replace(/^\/plan\s*/i, '');
+    text = text.replace(/^\/plan\s*/i, '').replace(/^(make a plan for|plan out how|plan for how|plan how|create a plan for|design a plan for|come up with a plan for|draft a plan for|write a plan for|make a plan|plan out|create a plan|design a plan|come up with a plan|draft a plan|write a plan)\s*/i, '').trim();
     // Extract branch strategy flag
     if (/--parallel\b/i.test(text)) {
       result.branchStrategy = 'parallel';
@@ -1968,6 +2049,249 @@ async function cmdSubmitPrd(parsed) {
   const projLabel = (parsed.projects || []).length > 0 ? ' (' + parsed.projects.join(', ') + ')' : '';
   showToast('cmd-toast', 'PRD item ' + (data.id || id) + ' added' + projLabel, true);
 }
+// ─── Modal Q&A (Ask about document) ──────────────────────────────────────────
+
+let _modalDocContext = { title: '', content: '', selection: '' };
+
+// Track text selection in modal body for the floating "Ask about this" button
+document.addEventListener('mouseup', function(e) {
+  const btn = document.getElementById('ask-selection-btn');
+  const modalBody = document.getElementById('modal-body');
+  const sel = window.getSelection();
+  const text = sel?.toString()?.trim();
+
+  if (text && text.length > 5 && modalBody?.contains(sel?.anchorNode)) {
+    _modalDocContext.selection = text;
+    btn.style.display = 'block';
+    btn.style.left = e.pageX + 'px';
+    btn.style.top = (e.pageY - 35) + 'px';
+  } else {
+    btn.style.display = 'none';
+  }
+});
+
+function modalAskAboutSelection() {
+  document.getElementById('ask-selection-btn').style.display = 'none';
+  const input = document.getElementById('modal-qa-input');
+  input.value = '';
+  input.placeholder = 'Ask about: "' + _modalDocContext.selection.slice(0, 60) + '..."';
+  input.focus();
+}
+
+async function modalAskSubmit() {
+  const input = document.getElementById('modal-qa-input');
+  const question = input.value.trim();
+  if (!question) return;
+  if (!_modalDocContext.content) return;
+
+  const thread = document.getElementById('modal-qa-thread');
+  const btn = document.getElementById('modal-qa-btn');
+
+  // Show question
+  let qHtml = '<div class="modal-qa-q">' + escHtml(question);
+  if (_modalDocContext.selection) {
+    qHtml += '<span class="selection-ref">Re: "' + escHtml(_modalDocContext.selection.slice(0, 100)) + ((_modalDocContext.selection.length > 100) ? '...' : '') + '"</span>';
+  }
+  qHtml += '</div>';
+  thread.innerHTML += qHtml;
+
+  // Show loading
+  const loadingId = 'qa-loading-' + Date.now();
+  thread.innerHTML += '<div class="modal-qa-loading" id="' + loadingId + '"><div class="dot-pulse"><span></span><span></span><span></span></div> Thinking...</div>';
+  thread.scrollTop = thread.scrollHeight;
+
+  input.value = '';
+  input.placeholder = 'Ask another question...';
+  btn.disabled = true;
+
+  try {
+    const res = await fetch('/api/ask-about', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({
+        question,
+        document: _modalDocContext.content,
+        title: _modalDocContext.title,
+        selection: _modalDocContext.selection || '',
+      }),
+    });
+    const data = await res.json();
+    const loadingEl = document.getElementById(loadingId);
+    if (loadingEl) loadingEl.remove();
+
+    if (data.ok && data.answer) {
+      thread.innerHTML += '<div class="modal-qa-a">' + escHtml(data.answer) + '</div>';
+    } else {
+      thread.innerHTML += '<div class="modal-qa-a" style="color:var(--red)">Error: ' + escHtml(data.error || 'No answer') + '</div>';
+    }
+  } catch (e) {
+    const loadingEl = document.getElementById(loadingId);
+    if (loadingEl) loadingEl.remove();
+    thread.innerHTML += '<div class="modal-qa-a" style="color:var(--red)">Error: ' + escHtml(e.message) + '</div>';
+  }
+
+  _modalDocContext.selection = ''; // Clear selection after asking
+  btn.disabled = false;
+  thread.scrollTop = thread.scrollHeight;
+  input.focus();
+}
+
+// Override closeModal to clear Q&A state
+const _origCloseModal = typeof closeModal === 'function' ? closeModal : null;
+
+// ─── Plans (Approval Gate) ────────────────────────────────────────────────────
+
+async function refreshPlans() {
+  try {
+    const plans = await fetch('/api/plans').then(r => r.json());
+    renderPlans(plans);
+  } catch {}
+}
+
+function renderPlans(plans) {
+  const el = document.getElementById('plans-list');
+  const countEl = document.getElementById('plans-count');
+  countEl.textContent = plans.length;
+
+  if (plans.length === 0) {
+    el.innerHTML = '<p class="empty">No plans yet. Use /plan in the command center to create one.</p>';
+    return;
+  }
+
+  const statusLabels = { 'awaiting-approval': 'Awaiting Approval', 'approved': 'Approved', 'rejected': 'Rejected', 'revision-requested': 'Revision Requested', 'completed': 'Completed', 'active': 'Active' };
+  const statusClass = (s) => s === 'awaiting-approval' ? 'awaiting' : s || '';
+
+  el.innerHTML = plans.map(p => {
+    const status = p.status || 'active';
+    const label = statusLabels[status] || status;
+    const needsAction = status === 'awaiting-approval';
+    const isRevision = status === 'revision-requested';
+
+    let actions = '';
+    if (needsAction) {
+      actions = '<div class="plan-card-actions">' +
+        '<button class="plan-btn approve" onclick="planApprove(\'' + escHtml(p.file) + '\')">Approve</button>' +
+        '<button class="plan-btn" style="color:var(--blue);border-color:var(--blue)" onclick="planDiscuss(\'' + escHtml(p.file) + '\')">Discuss &amp; Revise</button>' +
+        '<button class="plan-btn reject" onclick="planReject(\'' + escHtml(p.file) + '\')">Reject</button>' +
+        '<button class="plan-btn" onclick="planView(\'' + escHtml(p.file) + '\')">View Full Plan</button>' +
+      '</div>' +
+      '<div id="revise-input-' + escHtml(p.file).replace(/\./g, '-') + '" style="display:none">' +
+        '<textarea class="plan-feedback-input" placeholder="What should be changed? Be specific..." id="revise-feedback-' + escHtml(p.file).replace(/\./g, '-') + '"></textarea>' +
+        '<div class="plan-card-actions" style="margin-top:4px">' +
+          '<button class="plan-btn revise" onclick="planSubmitRevise(\'' + escHtml(p.file) + '\')">Submit Revision Request</button>' +
+          '<button class="plan-btn" onclick="planHideRevise(\'' + escHtml(p.file) + '\')">Cancel</button>' +
+        '</div>' +
+      '</div>';
+    } else if (isRevision) {
+      actions = '<div class="plan-card-meta" style="margin-top:6px;color:var(--purple,#a855f7)">Revision in progress: ' + escHtml((p.revisionFeedback || '').slice(0, 100)) + '</div>';
+    } else if (status === 'approved' || status === 'active') {
+      actions = '<div class="plan-card-actions"><button class="plan-btn" onclick="planView(\'' + escHtml(p.file) + '\')">View</button></div>';
+    }
+
+    return '<div class="plan-card ' + statusClass(status) + '">' +
+      '<div class="plan-card-header">' +
+        '<div><div class="plan-card-title">' + escHtml(p.summary || p.file) + '</div>' +
+          '<div class="plan-card-meta">' +
+            '<span style="font-weight:600;color:' + (needsAction ? 'var(--yellow,#d29922)' : status === 'approved' ? 'var(--green)' : 'var(--muted)') + '">' + label + '</span>' +
+            '<span>' + escHtml(p.project) + '</span>' +
+            '<span>' + p.itemCount + ' items</span>' +
+            '<span>' + escHtml(p.branchStrategy) + '</span>' +
+            (p.generatedBy ? '<span>by ' + escHtml(p.generatedBy) + '</span>' : '') +
+            (p.generatedAt ? '<span>' + p.generatedAt + '</span>' : '') +
+          '</div>' +
+        '</div>' +
+      '</div>' +
+      actions +
+    '</div>';
+  }).join('');
+}
+
+async function planApprove(file) {
+  try {
+    await fetch('/api/plans/approve', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ file }) });
+    showToast('cmd-toast', 'Plan approved — work will begin on next engine tick', true);
+    refreshPlans();
+  } catch (e) { showToast('cmd-toast', 'Error: ' + e.message, false); }
+}
+
+async function planReject(file) {
+  if (!confirm('Reject this plan? It will not be executed.')) return;
+  const reason = prompt('Reason for rejection (optional):') || '';
+  try {
+    await fetch('/api/plans/reject', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ file, reason }) });
+    showToast('cmd-toast', 'Plan rejected', true);
+    refreshPlans();
+  } catch (e) { showToast('cmd-toast', 'Error: ' + e.message, false); }
+}
+
+function planShowRevise(file) {
+  const id = 'revise-input-' + file.replace(/\./g, '-');
+  document.getElementById(id).style.display = 'block';
+}
+
+function planHideRevise(file) {
+  const id = 'revise-input-' + file.replace(/\./g, '-');
+  document.getElementById(id).style.display = 'none';
+}
+
+async function planSubmitRevise(file) {
+  const id = 'revise-feedback-' + file.replace(/\./g, '-');
+  const feedback = document.getElementById(id).value.trim();
+  if (!feedback) { showToast('cmd-toast', 'Please enter feedback', false); return; }
+  try {
+    const res = await fetch('/api/plans/revise', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ file, feedback }) });
+    const data = await res.json();
+    showToast('cmd-toast', 'Revision requested — agent will update the plan (' + data.workItemId + ')', true);
+    planHideRevise(file);
+    refreshPlans();
+  } catch (e) { showToast('cmd-toast', 'Error: ' + e.message, false); }
+}
+
+async function planDiscuss(file) {
+  try {
+    const res = await fetch('/api/plans/discuss', {
+      method: 'POST', headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ file })
+    });
+    const data = await res.json();
+    if (!res.ok) throw new Error(data.error);
+
+    // Show the launch command in a modal
+    const content = `To discuss and revise this plan interactively, run this command in a terminal:\n\n` +
+      `━━━ Bash / Git Bash ━━━\n${data.command}\n\n` +
+      `━━━ PowerShell ━━━\n${data.psCommand}\n\n` +
+      `━━━━━━━━━━━━━━━━━━━━━━━\n\n` +
+      `This launches an interactive Claude session with the plan pre-loaded.\n` +
+      `Chat naturally to review and refine. When you're satisfied, say "approve" and the session will write the approved plan back to disk.\n\n` +
+      `The engine will pick it up on the next tick and start dispatching work.`;
+
+    document.getElementById('modal-title').textContent = 'Discuss Plan: ' + file;
+    document.getElementById('modal-body').textContent = content;
+    document.getElementById('modal').classList.add('open');
+  } catch (e) {
+    showToast('cmd-toast', 'Error: ' + e.message, false);
+  }
+}
+
+async function planView(file) {
+  try {
+    const plan = await fetch('/api/plans/' + encodeURIComponent(file)).then(r => r.json());
+    const items = (plan.missing_features || []).map((f, i) =>
+      (i + 1) + '. [' + f.id + '] ' + f.name + ' (' + f.estimated_complexity + ', ' + f.priority + ')' +
+      (f.depends_on?.length ? ' → depends on: ' + f.depends_on.join(', ') : '') +
+      '\n   ' + (f.description || '').slice(0, 150)
+    ).join('\n\n');
+    const text = 'Project: ' + plan.project + '\nStrategy: ' + (plan.branch_strategy || 'parallel') +
+      '\nBranch: ' + (plan.feature_branch || 'per-item') +
+      '\nStatus: ' + (plan.status || 'active') +
+      '\n\n--- Items ---\n\n' + items +
+      (plan.open_questions?.length ? '\n\n--- Open Questions ---\n\n' + plan.open_questions.join('\n') : '');
+    document.getElementById('modal-title').textContent = plan.plan_summary || file;
+    document.getElementById('modal-body').textContent = text;
+    document.getElementById('modal').classList.add('open');
+  } catch (e) { console.error(e); }
+}
+
 // ─── Knowledge Base ──────────────────────────────────────────────────────────
 let _kbData = {};
 let _kbActiveTab = 'all';

package/dashboard.js

@@ -75,7 +75,7 @@ function getAgentDetail(id) {
   const agentDir = path.join(SQUAD_DIR, 'agents', id);
   const charter = safeRead(path.join(agentDir, 'charter.md')) || 'No charter found.';
   const history = safeRead(path.join(agentDir, 'history.md')) || 'No history yet.';
-  const outputLog = safeRead(path.join(agentDir, 'output.md')) || '';
+  const outputLog = safeRead(path.join(agentDir, 'output.log')) || '';
 
   const statusJson = safeRead(path.join(agentDir, 'status.json'));
   let statusData = null;
@@ -86,7 +86,25 @@ function getAgentDetail(id) {
     .filter(f => f.includes(id))
     .map(f => ({ name: f, content: safeRead(path.join(inboxDir, f)) || '' }));
 
-  return { charter, history, statusData, outputLog, inboxContents };
+  // Recent completed dispatches for this agent (last 10)
+  let recentDispatches = [];
+  try {
+    const dispatch = JSON.parse(safeRead(path.join(SQUAD_DIR, 'engine', 'dispatch.json')) || '{}');
+    recentDispatches = (dispatch.completed || [])
+      .filter(d => d.agent === id)
+      .slice(-10)
+      .reverse()
+      .map(d => ({
+        id: d.id,
+        task: d.task || '',
+        type: d.type || '',
+        result: d.result || '',
+        reason: d.reason || '',
+        completed_at: d.completed_at || '',
+      }));
+  } catch {}
+
+  return { charter, history, statusData, outputLog, inboxContents, recentDispatches };
 }
 
 function getAgents() {
@@ -858,6 +876,279 @@ const server = http.createServer(async (req, res) => {
     return;
   }
 
+  // GET /api/plans — list all plan files with status
+  if (req.method === 'GET' && req.url === '/api/plans') {
+    const plansDir = path.join(SQUAD_DIR, 'plans');
+    const files = safeReadDir(plansDir).filter(f => f.endsWith('.json'));
+    const plans = files.map(f => {
+      const plan = JSON.parse(safeRead(path.join(plansDir, f)) || '{}');
+      return {
+        file: f,
+        project: plan.project || '',
+        summary: plan.plan_summary || '',
+        status: plan.status || 'active',
+        branchStrategy: plan.branch_strategy || 'parallel',
+        featureBranch: plan.feature_branch || '',
+        itemCount: (plan.missing_features || []).length,
+        generatedBy: plan.generated_by || '',
+        generatedAt: plan.generated_at || '',
+        requiresApproval: plan.requires_approval || false,
+        revisionFeedback: plan.revision_feedback || null,
+      };
+    }).sort((a, b) => b.generatedAt.localeCompare(a.generatedAt));
+    return jsonReply(res, 200, plans);
+  }
+
+  // GET /api/plans/:file — read full plan JSON
+  const planFileMatch = req.url.match(/^\/api\/plans\/([^?]+)$/);
+  if (planFileMatch && req.method === 'GET') {
+    const file = decodeURIComponent(planFileMatch[1]);
+    if (file.includes('..') || file.includes('/') || file.includes('\\')) return jsonReply(res, 400, { error: 'invalid' });
+    const content = safeRead(path.join(SQUAD_DIR, 'plans', file));
+    if (!content) return jsonReply(res, 404, { error: 'not found' });
+    res.setHeader('Content-Type', 'application/json; charset=utf-8');
+    res.setHeader('Access-Control-Allow-Origin', '*');
+    res.end(content);
+    return;
+  }
+
+  // POST /api/plans/approve — approve a plan for execution
+  if (req.method === 'POST' && req.url === '/api/plans/approve') {
+    try {
+      const body = await readBody(req);
+      if (!body.file) return jsonReply(res, 400, { error: 'file required' });
+      const planPath = path.join(SQUAD_DIR, 'plans', body.file);
+      const plan = JSON.parse(safeRead(planPath) || '{}');
+      plan.status = 'approved';
+      plan.approvedAt = new Date().toISOString();
+      plan.approvedBy = body.approvedBy || os.userInfo().username;
+      safeWrite(planPath, plan);
+      return jsonReply(res, 200, { ok: true, status: 'approved' });
+    } catch (e) { return jsonReply(res, 400, { error: e.message }); }
+  }
+
+  // POST /api/plans/reject — reject a plan
+  if (req.method === 'POST' && req.url === '/api/plans/reject') {
+    try {
+      const body = await readBody(req);
+      if (!body.file) return jsonReply(res, 400, { error: 'file required' });
+      const planPath = path.join(SQUAD_DIR, 'plans', body.file);
+      const plan = JSON.parse(safeRead(planPath) || '{}');
+      plan.status = 'rejected';
+      plan.rejectedAt = new Date().toISOString();
+      plan.rejectedBy = body.rejectedBy || os.userInfo().username;
+      if (body.reason) plan.rejectionReason = body.reason;
+      safeWrite(planPath, plan);
+      return jsonReply(res, 200, { ok: true, status: 'rejected' });
+    } catch (e) { return jsonReply(res, 400, { error: e.message }); }
+  }
+
+  // POST /api/plans/revise — request revision with feedback, dispatches agent to revise
+  if (req.method === 'POST' && req.url === '/api/plans/revise') {
+    try {
+      const body = await readBody(req);
+      if (!body.file || !body.feedback) return jsonReply(res, 400, { error: 'file and feedback required' });
+      const planPath = path.join(SQUAD_DIR, 'plans', body.file);
+      const plan = JSON.parse(safeRead(planPath) || '{}');
+      plan.status = 'revision-requested';
+      plan.revision_feedback = body.feedback;
+      plan.revisionRequestedAt = new Date().toISOString();
+      plan.revisionRequestedBy = body.requestedBy || os.userInfo().username;
+      safeWrite(planPath, plan);
+
+      // Create a work item to revise the plan
+      const wiPath = path.join(SQUAD_DIR, 'work-items.json');
+      let items = [];
+      const existing = safeRead(wiPath);
+      if (existing) { try { items = JSON.parse(existing); } catch {} }
+      const maxNum = items.reduce(function(max, i) {
+        const m = (i.id || '').match(/(\d+)$/);
+        return m ? Math.max(max, parseInt(m[1])) : max;
+      }, 0);
+      const id = 'W' + String(maxNum + 1).padStart(3, '0');
+      items.push({
+        id, title: 'Revise plan: ' + (plan.plan_summary || body.file),
+        type: 'plan-to-prd', priority: 'high',
+        description: 'Revision requested on plan file: plans/' + body.file + '\n\nFeedback:\n' + body.feedback + '\n\nRevise the plan to address this feedback. Read the existing plan, apply the feedback, and overwrite the file with the updated version. Set status back to "awaiting-approval".',
+        status: 'pending', created: new Date().toISOString(), createdBy: 'dashboard:revision',
+        project: plan.project || '',
+        planFile: body.file,
+      });
+      safeWrite(wiPath, items);
+      return jsonReply(res, 200, { ok: true, status: 'revision-requested', workItemId: id });
+    } catch (e) { return jsonReply(res, 400, { error: e.message }); }
+  }
+
+  // POST /api/plans/discuss — generate a plan discussion session script
+  if (req.method === 'POST' && req.url === '/api/plans/discuss') {
+    try {
+      const body = await readBody(req);
+      if (!body.file) return jsonReply(res, 400, { error: 'file required' });
+      const planPath = path.join(SQUAD_DIR, 'plans', body.file);
+      const planContent = safeRead(planPath);
+      if (!planContent) return jsonReply(res, 404, { error: 'plan not found' });
+
+      const plan = JSON.parse(planContent);
+      const projectName = plan.project || 'Unknown';
+
+      // Build the session launch script
+      const sessionName = 'plan-review-' + body.file.replace(/\.json$/, '');
+      const sysPrompt = `You are a Plan Advisor helping a human review and refine a feature plan before it gets dispatched to an agent squad.
+
+## Your Role
+- Help the user understand, question, and refine the plan
+- Accept feedback and update the plan accordingly
+- When the user is satisfied, write the approved plan back to disk
+
+## The Plan File
+Path: ${planPath}
+Project: ${projectName}
+
+## How This Works
+1. The user will discuss the plan with you — answer questions, suggest changes
+2. When they want changes, update the plan items (add/remove/reorder/modify)
+3. When they say ANY of these (or similar intent):
+   - "approve", "go", "ship it", "looks good", "lgtm"
+   - "clear context and implement", "clear context and go"
+   - "go build it", "start working", "dispatch", "execute"
+   - "do it", "proceed", "let's go", "send it"
+
+   Then:
+   a. Read the current plan file fresh from disk
+   b. Update status to "approved", set approvedAt and approvedBy
+   c. Write it back to ${planPath} using the Write tool
+   d. Print exactly: "Plan approved and saved. The engine will dispatch work on the next tick. You can close this session."
+   e. Then EXIT the session — use /exit or simply stop responding. The user does NOT need to interact further.
+
+4. If they say "reject" or "cancel":
+   - Update status to "rejected"
+   - Write it back
+   - Confirm and exit.
+
+## Important
+- Always read the plan file fresh before writing (another process may have modified it)
+- Preserve all existing fields when writing back
+- Use the Write tool to save changes
+- You have full file access — you can also read the project codebase for context
+- When the user signals approval, ALWAYS write the file and exit. Do not ask for confirmation — their intent is clear.`;
+
+      const initialPrompt = `Here's the plan awaiting your review:
+
+**${plan.plan_summary || body.file}**
+Project: ${projectName}
+Strategy: ${plan.branch_strategy || 'parallel'}
+Branch: ${plan.feature_branch || 'per-item'}
+Items: ${(plan.missing_features || []).length}
+
+${(plan.missing_features || []).map((f, i) =>
+  `${i + 1}. **${f.id}: ${f.name}** (${f.estimated_complexity}, ${f.priority})${f.depends_on?.length ? ' → depends on: ' + f.depends_on.join(', ') : ''}
+   ${f.description || ''}`
+).join('\n\n')}
+
+${plan.open_questions?.length ? '\n**Open Questions:**\n' + plan.open_questions.map(q => '- ' + q).join('\n') : ''}
+
+What would you like to discuss or change? When you're happy, say "approve" and I'll finalize it.`;
+
+      // Write session files
+      const sessionDir = path.join(SQUAD_DIR, 'engine');
+      const sysFile = path.join(sessionDir, `plan-discuss-sys-${Date.now()}.md`);
+      const promptFile = path.join(sessionDir, `plan-discuss-prompt-${Date.now()}.md`);
+      safeWrite(sysFile, sysPrompt);
+      safeWrite(promptFile, initialPrompt);
+
+      // Generate the launch command
+      const cmd = `claude --system-prompt "$(cat '${sysFile.replace(/\\/g, '/')}')" --name "${sessionName}" --add-dir "${SQUAD_DIR.replace(/\\/g, '/')}" < "${promptFile.replace(/\\/g, '/')}"`;
+
+      // Also generate a PowerShell-friendly version
+      const psCmd = `Get-Content "${promptFile}" | claude --system-prompt (Get-Content "${sysFile}" -Raw) --name "${sessionName}" --add-dir "${SQUAD_DIR}"`;
+
+      return jsonReply(res, 200, {
+        ok: true,
+        sessionName,
+        command: cmd,
+        psCommand: psCmd,
+        sysFile,
+        promptFile,
+        planFile: body.file,
+      });
+    } catch (e) { return jsonReply(res, 400, { error: e.message }); }
+  }
+
+  // POST /api/ask-about — ask a question about a document with context, answered by Haiku
+  if (req.method === 'POST' && req.url === '/api/ask-about') {
+    try {
+      const body = await readBody(req);
+      if (!body.question) return jsonReply(res, 400, { error: 'question required' });
+      if (!body.document) return jsonReply(res, 400, { error: 'document required' });
+
+      const prompt = `You are answering a question about a document from a software engineering squad's knowledge base.
+
+## Document
+${body.title ? '**Title:** ' + body.title + '\n' : ''}
+${body.document.slice(0, 15000)}
+
+${body.selection ? '## Highlighted Selection\n\nThe user highlighted this specific part:\n> ' + body.selection.slice(0, 2000) + '\n' : ''}
+
+## Question
+
+${body.question}
+
+## Instructions
+
+Answer concisely and directly. Reference specific parts of the document. If the answer isn't in the document, say so. Use markdown formatting.`;
+
+      const sysPrompt = 'You are a concise technical assistant. Answer based on the document provided. No preamble.';
+
+      // Write temp files
+      const id = Date.now();
+      const promptPath = path.join(SQUAD_DIR, 'engine', 'ask-prompt-' + id + '.md');
+      const sysPath = path.join(SQUAD_DIR, 'engine', 'ask-sys-' + id + '.md');
+      safeWrite(promptPath, prompt);
+      safeWrite(sysPath, sysPrompt);
+
+      // Spawn Haiku
+      const spawnScript = path.join(SQUAD_DIR, 'engine', 'spawn-agent.js');
+      const childEnv = { ...process.env };
+      for (const key of Object.keys(childEnv)) {
+        if (key === 'CLAUDECODE' || key.startsWith('CLAUDE_CODE') || key.startsWith('CLAUDECODE_')) delete childEnv[key];
+      }
+
+      const { spawn: cpSpawn } = require('child_process');
+      const proc = cpSpawn(process.execPath, [
+        spawnScript, promptPath, sysPath,
+        '--output-format', 'text', '--max-turns', '1', '--model', 'haiku',
+        '--permission-mode', 'bypassPermissions', '--verbose',
+      ], { cwd: SQUAD_DIR, stdio: ['pipe', 'pipe', 'pipe'], env: childEnv });
+
+      let stdout = '';
+      let stderr = '';
+      proc.stdout.on('data', d => { stdout += d.toString(); });
+      proc.stderr.on('data', d => { stderr += d.toString(); });
+
+      // Timeout 60s
+      const timeout = setTimeout(() => { try { proc.kill('SIGTERM'); } catch {} }, 60000);
+
+      proc.on('close', (code) => {
+        clearTimeout(timeout);
+        try { fs.unlinkSync(promptPath); } catch {}
+        try { fs.unlinkSync(sysPath); } catch {}
+        if (code === 0 && stdout.trim()) {
+          return jsonReply(res, 200, { ok: true, answer: stdout.trim() });
+        } else {
+          return jsonReply(res, 500, { error: 'Failed to get answer', stderr: stderr.slice(0, 200) });
+        }
+      });
+
+      proc.on('error', (err) => {
+        clearTimeout(timeout);
+        try { fs.unlinkSync(promptPath); } catch {}
+        try { fs.unlinkSync(sysPath); } catch {}
+        return jsonReply(res, 500, { error: err.message });
+      });
+      return; // Don't fall through — response handled in callbacks
+    } catch (e) { return jsonReply(res, 400, { error: e.message }); }
+  }
+
   // POST /api/inbox/persist — promote an inbox item to team notes
   if (req.method === 'POST' && req.url === '/api/inbox/persist') {
     try {

package/engine.js

@@ -3083,6 +3083,13 @@ function materializePlansAsWorkItems(config) {
     const plan = safeJson(path.join(PLANS_DIR, file));
     if (!plan?.missing_features) continue;
 
+    // Human approval gate: plans start as 'awaiting-approval' and must be approved before work begins
+    // Plans without a status (legacy) or with status 'approved' are allowed through
+    const planStatus = plan.status || (plan.requires_approval ? 'awaiting-approval' : null);
+    if (planStatus === 'awaiting-approval' || planStatus === 'rejected' || planStatus === 'revision-requested') {
+      continue; // Skip — waiting for human approval or revision
+    }
+
     const projectName = plan.project || file.replace(/-\d{4}-\d{2}-\d{2}\.json$/, '');
     const project = getProjects(config).find(p => p.name?.toLowerCase() === projectName.toLowerCase());
     if (!project) continue;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yemi33/squad",
-  "version": "0.1.13",
+  "version": "0.1.14",
   "description": "Multi-agent AI dev team that runs from ~/.squad/ — five autonomous agents share a single engine, dashboard, and knowledge base",
   "bin": {
     "squad": "bin/squad.js"

package/playbooks/plan-to-prd.md

@@ -33,6 +33,8 @@ This file is NOT checked into the repo. The engine reads it on every tick and di
   "generated_by": "{{agent_id}}",
   "generated_at": "{{date}}",
   "plan_summary": "{{plan_summary}}",
+  "status": "awaiting-approval",
+  "requires_approval": true,
   "branch_strategy": "shared-branch|parallel",
   "feature_branch": "feat/plan-short-name",
   "missing_features": [