@yemi33/minions 0.1.2212 → 0.1.2214

package/dashboard/js/command-center.js

@@ -17,6 +17,158 @@ var _ccSending = false; // true if active tab is sending (UI indicator only)
 // Clear stale sending state on page load — SSE streams don't survive refresh
 try { localStorage.removeItem('cc-sending'); } catch {}
 
+// ── P-2a6d8e74 — Image attachments (paste / drag-drop) ──────────────────────
+// Pending images for the NEXT CC turn. Each entry: { mimeType, dataBase64,
+// filename, dataUrl }. dataBase64 is the raw (prefix-stripped) base64 sent to
+// the server; dataUrl (full data: URI) is for the local thumbnail only.
+// Cleared after every dispatch (v1 sends images for the current turn only).
+var _ccAttachments = [];
+// Client-side limits MIRROR the server (dashboard.js _validateCcImages) — they
+// are UX-only pre-screening; the server remains the single trust boundary.
+var CC_IMG_MAX_COUNT = 4;
+var CC_IMG_MAX_BYTES = 5 * 1024 * 1024; // 5 MB decoded, per image
+var CC_IMG_MIME_ALLOW = ['image/png', 'image/jpeg', 'image/gif', 'image/webp'];
+
+// Read one File/Blob into the attachment shape. Resolves { error } on a
+// client-side limit miss so the caller can toast and skip it.
+function _ccReadImageFile(file) {
+  return new Promise(function(resolve) {
+    var mime = String(file && file.type || '').toLowerCase();
+    if (CC_IMG_MIME_ALLOW.indexOf(mime) === -1) { resolve({ error: 'Unsupported image type' + (mime ? ': ' + mime : '') }); return; }
+    if (file.size > CC_IMG_MAX_BYTES) { resolve({ error: (file.name || 'image') + ' is too large (max 5 MB)' }); return; }
+    var reader = new FileReader();
+    reader.onload = function() {
+      var result = String(reader.result || '');
+      var comma = result.indexOf(',');
+      var dataBase64 = comma >= 0 ? result.slice(comma + 1) : '';
+      if (!dataBase64) { resolve({ error: 'Could not read image data' }); return; }
+      resolve({ mimeType: mime, dataBase64: dataBase64, filename: file.name || 'pasted-image.png', dataUrl: result });
+    };
+    reader.onerror = function() { resolve({ error: 'Could not read ' + (file.name || 'image') }); };
+    reader.readAsDataURL(file);
+  });
+}
+
+// Add image files (from paste, drop, or the command bar). Non-images are
+// ignored; over-limit / oversized files are toasted and skipped. Exposed so
+// command-input.js can forward clipboard images into the CC drawer.
+async function ccAddImageFiles(fileList) {
+  var files = [];
+  for (var i = 0; i < (fileList ? fileList.length : 0); i++) {
+    var f = fileList[i];
+    if (f && String(f.type || '').indexOf('image/') === 0) files.push(f);
+  }
+  if (!files.length) return false;
+  var added = 0;
+  for (var j = 0; j < files.length; j++) {
+    if (_ccAttachments.length >= CC_IMG_MAX_COUNT) { showToast('cmd-toast', 'Max ' + CC_IMG_MAX_COUNT + ' images per message', false); break; }
+    var res = await _ccReadImageFile(files[j]);
+    if (res.error) { showToast('cmd-toast', res.error, false); continue; }
+    _ccAttachments.push(res);
+    added++;
+  }
+  if (added) _ccRenderAttachments();
+  return added > 0;
+}
+
+function ccRemoveAttachment(idx) {
+  if (idx >= 0 && idx < _ccAttachments.length) { _ccAttachments.splice(idx, 1); _ccRenderAttachments(); }
+}
+
+function _ccClearAttachments() {
+  if (!_ccAttachments.length) return;
+  _ccAttachments = [];
+  _ccRenderAttachments();
+}
+
+// Render the thumbnail chips above the input. Built with createElement +
+// textContent / .src (no innerHTML) so untrusted filenames and base64 data
+// can never become an XSS sink and the no-unsanitized lint gate stays clean.
+function _ccRenderAttachments() {
+  var box = document.getElementById('cc-attachments');
+  if (!box) return;
+  box.textContent = '';
+  if (!_ccAttachments.length) { box.style.display = 'none'; return; }
+  box.style.display = 'flex';
+  _ccAttachments.forEach(function(att, i) {
+    var chip = document.createElement('div');
+    chip.className = 'cc-attach-chip';
+    var img = document.createElement('img');
+    img.className = 'cc-attach-thumb';
+    img.src = att.dataUrl;
+    img.alt = att.filename;
+    var name = document.createElement('span');
+    name.className = 'cc-attach-name';
+    name.textContent = att.filename;
+    name.title = att.filename;
+    var rm = document.createElement('button');
+    rm.className = 'cc-attach-remove';
+    rm.type = 'button';
+    rm.title = 'Remove';
+    rm.textContent = '×';
+    rm.onclick = function() { ccRemoveAttachment(i); };
+    chip.appendChild(img);
+    chip.appendChild(name);
+    chip.appendChild(rm);
+    box.appendChild(chip);
+  });
+}
+
+// Snapshot the pending attachments as the server payload shape
+// ([{ mimeType, dataBase64, filename }] — no local-only dataUrl).
+function _ccImagesPayload() {
+  return _ccAttachments.map(function(a) { return { mimeType: a.mimeType, dataBase64: a.dataBase64, filename: a.filename }; });
+}
+
+// Small "📎 N image(s) attached" note appended to the user bubble so a sent
+// turn visibly records its attachments. n is a number — safe to interpolate.
+function _ccAttachmentBadge(n) {
+  if (!n) return '';
+  return '<div class="cc-msg-attach-note">📎 ' + n + ' image' + (n === 1 ? '' : 's') + ' attached</div>';
+}
+
+// Inline event handlers wired from layout.html. Paste intercepts image
+// clipboard items (and lets normal text paste through); drag/drop accepts
+// image files dropped anywhere on the drawer.
+function ccHandlePaste(e) {
+  var items = (e.clipboardData && e.clipboardData.items) || [];
+  var imgs = [];
+  for (var i = 0; i < items.length; i++) {
+    if (items[i] && items[i].kind === 'file' && String(items[i].type || '').indexOf('image/') === 0) {
+      var f = items[i].getAsFile();
+      if (f) imgs.push(f);
+    }
+  }
+  if (!imgs.length) return; // no image — allow the default text paste
+  e.preventDefault();
+  ccAddImageFiles(imgs);
+}
+
+function ccHandleDragOver(e) {
+  var types = (e.dataTransfer && e.dataTransfer.types) || [];
+  if (Array.prototype.indexOf.call(types, 'Files') === -1) return;
+  e.preventDefault();
+  if (e.dataTransfer) e.dataTransfer.dropEffect = 'copy';
+  var dz = document.getElementById('cc-drawer');
+  if (dz) dz.classList.add('cc-dragover');
+}
+
+function ccHandleDragLeave() {
+  var dz = document.getElementById('cc-drawer');
+  if (dz) dz.classList.remove('cc-dragover');
+}
+
+function ccHandleDrop(e) {
+  var dz = document.getElementById('cc-drawer');
+  if (dz) dz.classList.remove('cc-dragover');
+  var files = (e.dataTransfer && e.dataTransfer.files) || [];
+  var hasImage = false;
+  for (var i = 0; i < files.length; i++) { if (String(files[i].type || '').indexOf('image/') === 0) { hasImage = true; break; } }
+  if (!hasImage) return; // let non-image drops fall through
+  e.preventDefault();
+  ccAddImageFiles(files);
+}
+
 function _ccStripActionBlockFromText(value) {
   var text = value || '';
   if (!text) return text;
@@ -947,6 +1099,11 @@ async function _ccDoSend(message, skipUserMsg, forceTabId, intentMetadata) {
   var activeTabId = forceTabId || _ccActiveTabId;
   var activeTab = _ccTabs.find(function(t) { return t.id === activeTabId; }) || _ccActiveTab();
   if (!activeTab) return;
+  // P-2a6d8e74 — snapshot + clear pending image attachments for this turn.
+  // Only fresh user sends carry images (retries/programmatic sends set
+  // skipUserMsg and reuse the already-dispatched text). v1 = current turn only.
+  var sendImages = (!skipUserMsg && _ccAttachments.length) ? _ccImagesPayload() : [];
+  if (sendImages.length) _ccClearAttachments();
   activeTab._sending = true;
   activeTab._sendStartedAt = Date.now();
   activeTab._abortController = new AbortController();
@@ -959,7 +1116,7 @@ async function _ccDoSend(message, skipUserMsg, forceTabId, intentMetadata) {
   // Scoped helper — always targets the originating tab, even if user switches tabs
   function addMsg(role, html, skipSave, meta) { ccAddMessage(role, html, skipSave, activeTabId, meta); }
 
-  if (!skipUserMsg) addMsg('user', escHtml(message));
+  if (!skipUserMsg) addMsg('user', escHtml(message) + _ccAttachmentBadge(sendImages.length));
 
   // Remove queue indicator before processing (it'll be re-added if more queued)
   var existingQueueEl = document.getElementById('cc-queue-indicator');
@@ -1067,7 +1224,7 @@ async function _ccDoSend(message, skipUserMsg, forceTabId, intentMetadata) {
       if (!isReconnect && res.status === 429 && (!activeTab._429retries || activeTab._429retries < 3)) {
         activeTab._429retries = (activeTab._429retries || 0) + 1;
         await new Promise(function(r) { setTimeout(r, 1500); });
-        return await _ccConsumeStream({ message: message, tabId: activeTabId, sessionId: activeTab.sessionId || null, transcript: _ccBuildTranscript(activeTab), intentMetadata: intentMetadata || null }, false);
+        return await _ccConsumeStream({ message: message, tabId: activeTabId, sessionId: activeTab.sessionId || null, images: sendImages.length ? sendImages : undefined, transcript: _ccBuildTranscript(activeTab), intentMetadata: intentMetadata || null }, false);
       }
       activeTab._429retries = 0;
       var errText = await res.text();
@@ -1263,7 +1420,7 @@ async function _ccDoSend(message, skipUserMsg, forceTabId, intentMetadata) {
     while (true) {
       var consume = await _ccConsumeStream(
         reconnectAttempts === 0
-          ? { message: message, tabId: activeTabId, sessionId: activeTab.sessionId || null, transcript: _ccBuildTranscript(activeTab), intentMetadata: intentMetadata || null }
+          ? { message: message, tabId: activeTabId, sessionId: activeTab.sessionId || null, transcript: _ccBuildTranscript(activeTab), intentMetadata: intentMetadata || null, images: sendImages.length ? sendImages : undefined }
           : { tabId: activeTabId, sessionId: activeTab.sessionId || null, reconnect: true },
         reconnectAttempts > 0
       );
@@ -2193,4 +2350,4 @@ if (document.readyState === 'loading') {
   ccInitResize();
 }
 
-window.MinionsCC = { toggleCommandCenter, ccNewSession, ccNewTab, ccSwitchTab, ccCloseTab, ccRenderTabBar, ccRestoreMessages, ccSaveState, ccUpdateSessionIndicator, ccAddMessage, ccSend, ccAbort, ccExecuteAction, ccPrActionFollowup };
+window.MinionsCC = { toggleCommandCenter, ccNewSession, ccNewTab, ccSwitchTab, ccCloseTab, ccRenderTabBar, ccRestoreMessages, ccSaveState, ccUpdateSessionIndicator, ccAddMessage, ccSend, ccAbort, ccExecuteAction, ccPrActionFollowup, ccAddImageFiles, ccRemoveAttachment, ccHandlePaste, ccHandleDragOver, ccHandleDragLeave, ccHandleDrop };

package/dashboard/js/command-input.js

@@ -146,6 +146,26 @@ async function cmdSubmit() {
   return;
 }
 
+// P-2a6d8e74 — paste a screenshot into the top command bar: open the Command
+// Center drawer and forward the clipboard images into its attachment tray.
+// Non-image pastes fall through to the default textarea behavior.
+function cmdHandlePaste(e) {
+  const items = (e.clipboardData && e.clipboardData.items) || [];
+  const imgs = [];
+  for (let i = 0; i < items.length; i++) {
+    if (items[i] && items[i].kind === 'file' && String(items[i].type || '').indexOf('image/') === 0) {
+      const f = items[i].getAsFile();
+      if (f) imgs.push(f);
+    }
+  }
+  if (!imgs.length) return; // text paste — leave it to the textarea
+  e.preventDefault();
+  if (!_ccOpen) toggleCommandCenter();
+  if (window.MinionsCC && typeof window.MinionsCC.ccAddImageFiles === 'function') {
+    window.MinionsCC.ccAddImageFiles(imgs);
+  }
+}
+
 // Render the parsed meta chips below input
 function cmdRenderMeta() {
   const el = document.getElementById('cmd-meta');
@@ -272,4 +292,4 @@ function cmdInsertPopupItem(id) {
   cmdRenderMeta();
 }
 
-window.MinionsCmdInput = { cmdAutoResize, cmdUpdateHighlight, syncHighlightScroll, cmdInputChanged, cmdKeyDown, cmdSubmit, cmdRenderMeta, cmdShowMentions, cmdShowProjects, cmdHidePopup, cmdInsertPopupItem };
+window.MinionsCmdInput = { cmdAutoResize, cmdUpdateHighlight, syncHighlightScroll, cmdInputChanged, cmdKeyDown, cmdSubmit, cmdRenderMeta, cmdShowMentions, cmdShowProjects, cmdHidePopup, cmdInsertPopupItem, cmdHandlePaste };

package/dashboard/js/render-work-items.js

@@ -699,6 +699,9 @@ function _wiRenderDetail(item) {
       return ' <span class="pr-badge needs-attention" style="font-size:var(--text-xs);margin-left:4px" title="See &quot;Why this is blocked&quot; below">&#x26A0; Needs attention</span>';
     })() +
     '</div>';
+  // Work item id — shown in the modal body (not just the title) so operators can
+  // read/copy the canonical id (W-… or sched-…) when deeplinking in from a note.
+  html += field('ID', '<code style="font-size:var(--text-sm);background:var(--surface2);padding:2px 6px;border-radius:var(--radius-sm)">' + escapeHtml(item.id || '—') + '</code>');
   // W-mq08kuog001110a6 — "Why this is blocked" section, rendered FIRST so the
   // human eye lands on the unblocking reason before scrolling through agent,
   // source, dates, etc. _preDispatchEval reasons are evaluator prose and can
@@ -1073,6 +1076,12 @@ function openInboxNote(filename) {
       titleEl.textContent = filename + ' (archived)';
       // eslint-disable-next-line no-unsanitized/property -- reason: renderMd() escapes note content before assembling HTML; filename is set via textContent
       bodyEl.innerHTML = '<div style="font-size:var(--text-md);line-height:1.7;color:var(--muted)">' + renderMd(content) + '</div>';
+      // Wire Doc Chat for the deeplinked archive note, mirroring the live-inbox
+      // openModal() path (render-prs.js). Without this the archive branch opened
+      // the note as plain text with no Q&A panel, so deeplinking into a note
+      // from a (completed) work item sometimes silently dropped doc-chat.
+      _modalDocContext = { title: filename + ' (archived)', content: content, selection: '' };
+      _modalFilePath = 'notes/archive/' + filename; showModalQa();
       document.getElementById('modal').classList.add('open');
       // P-34fa5d79 — Source-WI chip for archive notes. Same convention as the
       // live-inbox branch above; parsed off the freshly-fetched content.

package/dashboard/layout.html

@@ -44,7 +44,7 @@
 
 <!-- Command Center Drawer -->
 <div id="cc-overlay" style="display:none;position:fixed;inset:0;background:rgba(0,0,0,0.4);z-index:340" onclick="toggleCommandCenter()"></div>
-<div id="cc-drawer" style="display:none;position:fixed;top:0;right:0;bottom:0;width:420px;background:var(--surface);border-left:1px solid var(--border);z-index:350;flex-direction:column;overscroll-behavior:contain">
+<div id="cc-drawer" style="display:none;position:fixed;top:0;right:0;bottom:0;width:420px;background:var(--surface);border-left:1px solid var(--border);z-index:350;flex-direction:column;overscroll-behavior:contain" ondragover="ccHandleDragOver(event)" ondragleave="ccHandleDragLeave(event)" ondrop="ccHandleDrop(event)">
   <div id="cc-resize-handle" class="cc-resize-handle"></div>
   <div style="padding:12px 16px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between">
     <div style="display:flex;align-items:center;gap:8px">
@@ -59,11 +59,13 @@
   <div id="cc-tab-bar" style="display:flex;gap:8px;padding:4px 12px;border-bottom:1px solid var(--border);overflow:hidden;align-items:center;flex-shrink:0"></div>
   <div id="cc-messages" style="flex:1;overflow-y:auto;padding:12px 16px;display:flex;flex-direction:column;gap:10px"></div>
   <div style="padding:12px 16px;border-top:1px solid var(--border)">
+    <!-- P-2a6d8e74 — image attachment thumbnail chips (paste / drag-drop); hidden until images are attached -->
+    <div id="cc-attachments" style="display:none;flex-wrap:wrap;gap:6px;margin-bottom:8px"></div>
     <div style="display:flex;gap:8px">
-      <textarea id="cc-input" rows="2" placeholder="Ask anything or give a command..." style="flex:1;padding:8px 10px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:var(--text-md);resize:none;font-family:inherit" onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();ccSend()}"></textarea>
+      <textarea id="cc-input" rows="2" placeholder="Ask anything or give a command... (paste or drop an image)" style="flex:1;padding:8px 10px;background:var(--bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:var(--text-md);resize:none;font-family:inherit" onpaste="ccHandlePaste(event)" onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();ccSend()}"></textarea>
       <button onclick="ccSend()" style="background:var(--blue);color:#fff;border:none;border-radius:6px;padding:8px 14px;font-size:var(--text-md);font-weight:600;cursor:pointer;align-self:flex-end">Send</button>
     </div>
-    <div id="cc-powered-by" style="font-size:var(--text-xs);color:var(--muted);margin-top:4px">Full minions context. Enter to send, Shift+Enter for newline.</div>
+    <div id="cc-powered-by" style="font-size:var(--text-xs);color:var(--muted);margin-top:4px">Full minions context. Enter to send, Shift+Enter for newline. Paste or drop images to attach.</div>
   </div>
 </div>
 

package/dashboard/pages/home.html

@@ -3,7 +3,7 @@
         <div class="cmd-input-wrap" id="cmd-input-wrap">
           <div class="cmd-highlight-layer" id="cmd-highlight" aria-hidden="true"></div>
           <textarea id="cmd-input" rows="1" placeholder='What do you need? e.g. "Fix the auth bug @dallas", "explain the dispatch flow", or "/note always use feature flags"'
-            oninput="cmdInputChanged()" onkeydown="cmdKeyDown(event)" onscroll="syncHighlightScroll()"></textarea>
+            oninput="cmdInputChanged()" onkeydown="cmdKeyDown(event)" onscroll="syncHighlightScroll()" onpaste="cmdHandlePaste(event)"></textarea>
           <button class="cmd-send-btn" id="cmd-send-btn" onclick="cmdSubmit()">Send <kbd>Ctrl+Enter</kbd></button>
         </div>
         <div class="cmd-mention-popup" id="cmd-mention-popup"></div>

package/dashboard/styles.css

@@ -1146,6 +1146,20 @@
   .cc-resize-handle:hover::after, .cc-resize-handle.active::after { opacity: 1; background: var(--blue); }
   body.cc-resizing { cursor: col-resize !important; user-select: none !important; }
 
+  /* ── P-2a6d8e74 — CC image attachment chips + drag-drop affordance ───── */
+  #cc-drawer.cc-dragover { outline: 2px dashed var(--blue); outline-offset: -2px; }
+  .cc-attach-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 180px;
+    padding: 4px 6px; background: var(--surface2); border: 1px solid var(--border);
+    border-radius: var(--radius-sm); font-size: var(--text-xs); }
+  .cc-attach-thumb { width: 28px; height: 28px; object-fit: cover; border-radius: 3px;
+    flex-shrink: 0; background: var(--bg); }
+  .cc-attach-name { color: var(--muted); white-space: nowrap; overflow: hidden;
+    text-overflow: ellipsis; }
+  .cc-attach-remove { flex-shrink: 0; background: none; border: none; color: var(--muted);
+    cursor: pointer; font-size: var(--text-md); line-height: 1; padding: 0 2px; }
+  .cc-attach-remove:hover { color: var(--red); }
+  .cc-msg-attach-note { margin-top: 4px; font-size: var(--text-xs); opacity: 0.85; }
+
   .modal-body { padding: var(--space-7) var(--space-8); overflow-y: auto; overflow-x: auto; white-space: pre-wrap; font-size: var(--text-md); line-height: 1.7; color: var(--muted); font-family: Consolas, monospace; }
 
   /* ── Settings: left-rail tabbed layout (W-mpmwxkcn000646cc) ─────────────