crewswarm 0.9.2 → 0.9.4

package/apps/dashboard/src/tabs/engines-tab.js

@@ -1,175 +0,0 @@
-/**
- * Engines tab — extracted from app.js
- * Deps: getJSON, postJSON, escHtml (from core/)
- */
-
-import { getJSON, postJSON } from '../core/api.js';
-import { escHtml } from '../core/dom.js';
-
-export const ENGINE_ICONS = {
-  opencode:       `<svg viewBox="0 0 24 30" width="20" height="24" fill="#38bdf8"><path d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"/></svg>`,
-  cursor:         `<svg viewBox="0 0 24 24" width="20" height="20" fill="#818cf8"><path d="M4 4l8 16 3-7 7-3L4 4z"/></svg>`,
-  claude:         `<svg viewBox="0 0 24 24" width="20" height="20" fill="#d4a853"><path d="M17.3041 3.541h-3.6718l6.696 16.918H24Zm-10.6082 0L0 20.459h3.7442l1.3693-3.5527h7.0052l1.3693 3.5528h3.7442L10.5363 3.5409Zm-.3712 10.2232 2.2914-5.9456 2.2914 5.9456Z"/></svg>`,
-  codex:          `<svg viewBox="0 0 24 24" width="20" height="20" fill="none"><circle cx="12" cy="12" r="10" stroke="#a78bfa" stroke-width="1.5"/><path d="M8 12l3 3 5-5" stroke="#a78bfa" stroke-width="1.5" fill="none" stroke-linecap="round" stroke-linejoin="round"/></svg>`,
-  "docker-sandbox": `<svg viewBox="0 0 24 24" width="20" height="20" fill="#2496ed"><path d="M13.983 11.078h2.119a.186.186 0 00.186-.185V9.006a.186.186 0 00-.186-.186h-2.119a.185.185 0 00-.185.185v1.888c0 .102.083.185.185.185m-2.954-5.43h2.118a.186.186 0 00.186-.186V3.574a.186.186 0 00-.186-.185h-2.118a.185.185 0 00-.185.185v1.888c0 .102.082.185.185.185m0 2.716h2.118a.187.187 0 00.186-.186V6.29a.186.186 0 00-.186-.185h-2.118a.185.185 0 00-.185.185v1.887c0 .102.082.186.185.186m-2.93 0h2.12a.186.186 0 00.184-.186V6.29a.185.185 0 00-.185-.185H8.1a.185.185 0 00-.185.185v1.887c0 .102.083.186.185.186m-2.943 0h2.119a.186.186 0 00.185-.186V6.29a.185.185 0 00-.185-.185H5.157a.185.185 0 00-.185.185v1.887c0 .102.083.186.185.186m8.763 2.714h2.119a.186.186 0 00.186-.185V9.006a.186.186 0 00-.186-.186h-2.119a.185.185 0 00-.185.185v1.888c0 .102.083.185.185.185m-2.93 0h2.12a.185.185 0 00.184-.185V9.006a.185.185 0 00-.184-.186h-2.12a.185.185 0 00-.184.185v1.888c0 .102.083.185.185.185M23.763 9.89c-.065-.051-.672-.51-1.954-.51-.338.001-.676.03-1.01.087-.248-1.7-1.653-2.53-1.716-2.566l-.344-.199-.226.327c-.284.438-.49.922-.612 1.43-.23.97-.09 1.882.403 2.661-.595.332-1.55.413-1.744.42H.751a.751.751 0 00-.75.748 11.376 11.376 0 00.692 4.062c.545 1.428 1.355 2.48 2.41 3.124 1.18.723 3.1 1.137 5.275 1.137.983.003 1.963-.086 2.93-.266a12.248 12.248 0 003.823-1.389c.98-.567 1.86-1.288 2.61-2.136 1.252-1.418 1.998-2.997 2.553-4.4h.221c1.372 0 2.215-.549 2.68-1.009.309-.293.55-.65.707-1.046l.098-.288Z"/></svg>`,
-};
-
-export function showEngines(helpers) {
-  helpers.hideAllViews();
-  document.getElementById('enginesView').classList.add('active');
-  helpers.setNavActive('navEngines');
-  loadEngines();
-}
-
-// Make toggleEngineGlobal available globally for onclick
-if (typeof window !== 'undefined') {
-  window.toggleEngineGlobal = toggleEngineGlobal;
-}
-
-export function toggleImportEngine() {
-  const f = document.getElementById('importEngineForm');
-  if (f) f.style.display = f.style.display === 'none' ? 'block' : 'none';
-}
-
-export async function importEngineFromUrl() {
-  const inp = document.getElementById('importEngineUrl');
-  const status = document.getElementById('importEngineStatus');
-  const url = inp?.value?.trim();
-  if (!url || !status) return;
-  status.textContent = 'Importing…'; status.style.color = 'var(--text-3)';
-  try {
-    const d = await postJSON('/api/engines/import', { url });
-    if (d.ok) {
-      status.textContent = `✓ Imported ${d.label}`; status.style.color = 'var(--green)';
-      inp.value = '';
-      loadEngines();
-    } else {
-      status.textContent = 'Error: ' + (d.error || 'unknown'); status.style.color = 'var(--red,#f87171)';
-    }
-  } catch(e) {
-    status.textContent = 'Error: ' + e.message; status.style.color = 'var(--red,#f87171)';
-  }
-}
-
-export async function deleteEngine(id) {
-  if (!confirm(`Remove engine "${id}"?`)) return;
-  await fetch(`/api/engines/${encodeURIComponent(id)}`, { method: 'DELETE' });
-  loadEngines();
-}
-
-export async function loadEngines() {
-  const grid = document.getElementById('enginesGrid');
-  if (!grid) return;
-  grid.innerHTML = '<div style="color:var(--text-3);font-size:13px;padding:8px;">Loading…</div>';
-  try {
-    const { engines = [] } = await getJSON('/api/engines');
-    if (!engines.length) {
-      grid.innerHTML = '<div style="color:var(--text-3);font-size:13px;padding:8px;">No engines found.</div>';
-      return;
-    }
-    grid.innerHTML = '';
-    for (const eng of engines) {
-      const card = document.createElement('div');
-      card.className = 'card';
-      card.style.cssText = 'display:flex;flex-direction:column;gap:10px;';
-      const iconHtml = ENGINE_ICONS[eng.icon || eng.id] || `<span style="font-size:20px;">⚙️</span>`;
-      const statusDot = eng.ready ? '🟢' : eng.installed ? '🟡' : '⚫';
-      const statusLabel = eng.ready ? 'Ready'
-        : eng.installed && eng.requiresAuth ? 'Installed — run auth to activate'
-        : eng.installed ? 'Installed — missing env vars'
-        : 'Not installed';
-      const statusColor = eng.ready ? 'var(--green)' : eng.installed ? 'var(--yellow,#fbbf24)' : 'var(--text-3)';
-      const traitsHtml = (eng.traits || []).map(t =>
-        `<li style="font-size:11px;color:var(--text-3);list-style:none;padding:2px 0;">▸ ${escHtml(t)}</li>`
-      ).join('');
-      const missingHtml = eng.missingEnv?.length
-        ? `<div style="font-size:11px;color:var(--yellow,#fbbf24);margin-top:4px;">Missing env: ${eng.missingEnv.map(e => `<code style="background:var(--bg-1);padding:1px 3px;border-radius:3px;">${escHtml(e)}</code>`).join(', ')}</div>`
-        : '';
-      const installHtml = !eng.installed
-        ? `<div style="margin-top:6px;"><div style="font-size:11px;color:var(--text-3);margin-bottom:4px;">Install:</div>
-           <code style="font-size:11px;background:var(--bg-1);padding:4px 8px;border-radius:4px;display:block;word-break:break-all;">${escHtml(eng.installCmd || '')}</code>
-           ${eng.installUrl ? `<a href="${escHtml(eng.installUrl)}" target="_blank" style="font-size:11px;color:var(--accent);margin-top:4px;display:inline-block;">↗ Install guide</a>` : ''}
-          </div>` : '';
-      const authHtml = eng.authMethods?.length
-        ? `<div style="margin-top:8px;border-top:1px solid var(--border);padding-top:10px;">
-            <div style="font-size:11px;font-weight:600;color:var(--text-2);margin-bottom:8px;display:flex;align-items:center;gap:6px;">
-              <span style="font-size:13px;">🔑</span> Auth setup
-              ${eng.authNote ? `<span style="font-weight:400;color:var(--text-3);">— ${escHtml(eng.authNote)}</span>` : ''}
-            </div>
-            ${eng.authMethods.map((m, i) => `
-              <div style="margin-bottom:10px;">
-                <div style="font-size:11px;font-weight:600;color:var(--text-2);margin-bottom:4px;">${escHtml(m.label)}</div>
-                <div style="position:relative;display:flex;align-items:stretch;gap:0;">
-                  <code style="flex:1;font-size:11px;background:var(--bg-1);padding:6px 8px;border-radius:4px 0 0 4px;display:block;word-break:break-all;border:1px solid var(--border);border-right:none;">${escHtml(m.cmd)}</code>
-                  <button onclick="navigator.clipboard.writeText(${escHtml(JSON.stringify(m.cmd))}).then(()=>{this.textContent='\u2713';setTimeout(()=>this.textContent='Copy',1200)})" style="font-size:10px;padding:0 8px;border-radius:0 4px 4px 0;border:1px solid var(--border);background:var(--bg-card2);color:var(--text-2);cursor:pointer;white-space:nowrap;flex-shrink:0;">Copy</button>
-                </div>
-                ${m.note ? `<div style="font-size:10px;color:var(--text-3);margin-top:3px;">${escHtml(m.note)}</div>` : ''}
-              </div>
-            `).join('')}
-          </div>`
-        : (eng.authNote ? `<div style="font-size:11px;color:var(--text-3);margin-top:6px;">🔑 ${escHtml(eng.authNote)}</div>` : '');
-      const bestForHtml = eng.bestFor?.length
-        ? `<div style="font-size:11px;color:var(--text-3);">Best for: ${eng.bestFor.map(a => `<code style="background:var(--bg-1);padding:1px 3px;border-radius:3px;">${escHtml(a)}</code>`).join(' ')}</div>`
-        : '';
-      const deleteBtn = eng.source === 'user'
-        ? `<button onclick="deleteEngine('${escHtml(eng.id)}')" style="font-size:11px;padding:4px 8px;border-radius:5px;cursor:pointer;border:1px solid var(--border);background:transparent;color:var(--text-3);">Remove</button>`
-        : '';
-      
-      // Global enable/disable toggle (only show if engine has envToggle and is ready)
-      const toggleHtml = eng.envToggle && eng.ready
-        ? `<label style="display:flex;align-items:center;gap:8px;cursor:pointer;margin-top:10px;padding:8px;background:var(--surface-2);border-radius:6px;border:1px solid var(--border);">
-             <input type="checkbox" id="toggle-${eng.id}" ${eng.enabled ? 'checked' : ''} onchange="toggleEngineGlobal('${eng.id}')" style="width:14px;height:14px;cursor:pointer;" />
-             <span style="font-size:12px;font-weight:600;color:var(--text-1);">Enable Globally</span>
-             <span style="font-size:11px;color:var(--text-3);">Sets ${escHtml(eng.envToggle)}</span>
-           </label>`
-        : '';
-      
-      card.innerHTML = `
-        <div style="display:flex;align-items:center;justify-content:space-between;gap:10px;">
-          <div style="display:flex;align-items:center;gap:10px;">
-            ${iconHtml}
-            <div>
-              <div style="font-weight:700;font-size:14px;">${escHtml(eng.label)}</div>
-              <div style="font-size:11px;color:${statusColor};">${statusDot} ${escHtml(statusLabel)}</div>
-            </div>
-          </div>
-          <div style="display:flex;gap:6px;align-items:center;">
-            ${eng.docsUrl ? `<a href="${escHtml(eng.docsUrl)}" target="_blank" class="btn-ghost" style="font-size:11px;padding:4px 8px;text-decoration:none;">Docs ↗</a>` : ''}
-            ${deleteBtn}
-          </div>
-        </div>
-        <div style="font-size:12px;color:var(--text-2);line-height:1.5;">${escHtml(eng.description || '')}</div>
-        ${missingHtml}
-        ${installHtml}
-        <ul style="margin:0;padding:0;">${traitsHtml}</ul>
-        ${bestForHtml}
-        ${toggleHtml}
-        ${authHtml}
-      `;
-      grid.appendChild(card);
-    }
-  } catch(e) {
-    grid.innerHTML = `<div style="color:var(--red,#f87171);font-size:13px;">Error: ${escHtml(e.message)}</div>`;
-  }
-}
-
-export async function toggleEngineGlobal(engineId) {
-  const checkbox = document.getElementById(`toggle-${engineId}`);
-  const enabled = checkbox?.checked ?? false;
-  try {
-    await postJSON('/api/engines/toggle', { engineId, enabled });
-    const status = enabled ? 'enabled' : 'disabled';
-    console.log(`Engine ${engineId} ${status} globally`);
-    // Show notification (assuming showNotification is available globally)
-    if (window.showNotification) {
-      window.showNotification(`${engineId} ${status} globally`);
-    }
-  } catch(e) {
-    console.error('Toggle failed:', e);
-    // Revert checkbox on error
-    if (checkbox) checkbox.checked = !enabled;
-    if (window.showNotification) {
-      window.showNotification(`Toggle failed: ${e.message}`, true);
-    }
-  }
-}

package/apps/dashboard/src/tabs/memory-tab.js

@@ -1,182 +0,0 @@
-/**
- * Memory tab — shared memory visualization and management
- */
-
-import { getJSON, postJSON } from '../core/api.js';
-import { showNotification } from '../core/dom.js';
-
-let _state = null;
-
-export function initMemoryTab(state) {
-  _state = state;
-}
-
-export async function showMemory() {
-  // Note: View activation is handled by showMemoryView() in app.js via hideAllViews() + classList.add('active')
-  // Just load the data here
-  await loadMemoryStats();
-}
-
-export async function loadMemoryStats() {
-  try {
-    const data = await getJSON('/api/memory/stats');
-    
-    // Update fact stats
-    const factStatsEl = document.getElementById('memoryFactStats');
-    if (factStatsEl && data.agentMemory) {
-      const stats = data.agentMemory;
-      factStatsEl.innerHTML = `
-        Total facts: <strong>${stats.totalFacts || 0}</strong><br>
-        Critical facts: <strong>${stats.criticalFacts || 0}</strong><br>
-        Providers: ${stats.providers?.join(', ') || 'none'}<br>
-        ${stats.oldestFact ? `Oldest: ${new Date(stats.oldestFact).toLocaleDateString()}<br>` : ''}
-        ${stats.newestFact ? `Newest: ${new Date(stats.newestFact).toLocaleDateString()}` : ''}
-      `;
-    }
-    
-    // Update keeper stats
-    const keeperStatsEl = document.getElementById('memoryKeeperStats');
-    if (keeperStatsEl && data.agentKeeper) {
-      const stats = data.agentKeeper;
-      keeperStatsEl.innerHTML = `
-        Total entries: <strong>${stats.entries || 0}</strong><br>
-        Storage: <strong>${stats.bytes ? (stats.bytes / 1024).toFixed(1) + 'KB' : '0KB'}</strong><br>
-        ${stats.byTier ? `By tier: ${Object.entries(stats.byTier).map(([k,v]) => `${k}=${v}`).join(', ')}<br>` : ''}
-        ${stats.byAgent ? `By agent: ${Object.entries(stats.byAgent).map(([k,v]) => `${k}=${v}`).join(', ')}` : ''}
-      `;
-    }
-    
-    // Update storage info
-    const storageInfoEl = document.getElementById('memoryStorageInfo');
-    if (storageInfoEl) {
-      storageInfoEl.innerHTML = `
-        Location: <code style="font-size:11px;background:var(--bg-2);padding:2px 6px;border-radius:3px;">${data.storageDir || 'N/A'}</code><br>
-        Status: <strong style="color:var(--green);">${data.available ? '✅ Active' : '⚠️ Unavailable'}</strong><br>
-        <span style="font-size:10px;color:var(--text-3);">Set CREW_MEMORY_DIR to customize location</span>
-      `;
-    }
-  } catch (err) {
-    showNotification(`Failed to load memory stats: ${err.message}`, 'error');
-    console.error('[memory] Stats load failed:', err);
-  }
-}
-
-export async function searchMemory() {
-  const queryEl = document.getElementById('memorySearchQuery');
-  if (!queryEl) return;
-  
-  const query = queryEl.value.trim();
-  if (!query) {
-    showNotification('Enter a search query', 'error');
-    return;
-  }
-  
-  const resultsEl = document.getElementById('memorySearchResults');
-  if (!resultsEl) return;
-  
-  resultsEl.style.display = 'block';
-  resultsEl.innerHTML = '<div style="padding:12px;color:var(--text-2);">Searching...</div>';
-  
-  try {
-    const data = await postJSON('/api/memory/search', { query, maxResults: 20 });
-    
-    if (!data.hits || data.hits.length === 0) {
-      resultsEl.innerHTML = '<div style="padding:12px;color:var(--text-2);">No results found</div>';
-      return;
-    }
-    
-    const html = data.hits.map(hit => {
-      const sourceColor = hit.source === 'agentkeeper' ? 'var(--blue)' : 
-                         hit.source === 'agent-memory' ? 'var(--green)' : 'var(--purple)';
-      const preview = hit.text.length > 300 ? hit.text.slice(0, 300) + '...' : hit.text;
-      
-      return `
-        <div style="padding:12px;border-left:3px solid ${sourceColor};background:var(--bg-2);border-radius:6px;margin-bottom:8px;">
-          <div style="display:flex;align-items:center;gap:8px;margin-bottom:6px;">
-            <span style="font-size:10px;font-weight:600;color:${sourceColor};text-transform:uppercase;">${hit.source}</span>
-            <span style="font-size:11px;font-weight:600;color:var(--text-1);flex:1;">${escapeHtml(hit.title)}</span>
-            <span style="font-size:10px;color:var(--text-3);font-family:monospace;">score: ${hit.score.toFixed(3)}</span>
-          </div>
-          <div style="font-size:11px;color:var(--text-2);line-height:1.5;white-space:pre-wrap;">${escapeHtml(preview)}</div>
-          ${hit.metadata ? `<div style="font-size:10px;color:var(--text-3);margin-top:6px;">${JSON.stringify(hit.metadata)}</div>` : ''}
-        </div>
-      `;
-    }).join('');
-    
-    resultsEl.innerHTML = `
-      <div style="padding:8px 0;font-size:12px;color:var(--text-2);">
-        Found <strong>${data.hits.length}</strong> result(s) for "<strong>${escapeHtml(query)}</strong>"
-      </div>
-      ${html}
-    `;
-  } catch (err) {
-    resultsEl.innerHTML = `<div style="padding:12px;color:var(--red);">Search failed: ${escapeHtml(err.message)}</div>`;
-    showNotification(`Memory search failed: ${err.message}`, 'error');
-  }
-}
-
-export async function migrateMemory() {
-  const resultEl = document.getElementById('memoryActionResult');
-  if (!resultEl) return;
-  
-  resultEl.style.display = 'block';
-  resultEl.innerHTML = '<div style="color:var(--text-2);">Migrating brain.md entries to shared memory...</div>';
-  
-  try {
-    const data = await postJSON('/api/memory/migrate', {});
-    
-    if (data.ok) {
-      resultEl.innerHTML = `
-        <div style="color:var(--green);">✅ Migration complete</div>
-        <div style="margin-top:6px;font-size:11px;">
-          Imported: ${data.imported}, Skipped: ${data.skipped}, Errors: ${data.errors}
-        </div>
-      `;
-      showNotification('Brain.md migrated successfully', 'success');
-      await loadMemoryStats();
-    } else {
-      resultEl.innerHTML = `<div style="color:var(--red);">❌ Migration failed: ${escapeHtml(data.error || 'unknown error')}</div>`;
-      showNotification(`Migration failed: ${data.error}`, 'error');
-    }
-  } catch (err) {
-    resultEl.innerHTML = `<div style="color:var(--red);">❌ Migration failed: ${escapeHtml(err.message)}</div>`;
-    showNotification(`Migration failed: ${err.message}`, 'error');
-  }
-}
-
-export async function compactMemory() {
-  const resultEl = document.getElementById('memoryActionResult');
-  if (!resultEl) return;
-  
-  resultEl.style.display = 'block';
-  resultEl.innerHTML = '<div style="color:var(--text-2);">Compacting AgentKeeper store...</div>';
-  
-  try {
-    const data = await postJSON('/api/memory/compact', {});
-    
-    if (data.entriesBefore !== undefined) {
-      const bytesFreedKB = (data.bytesFreed / 1024).toFixed(1);
-      resultEl.innerHTML = `
-        <div style="color:var(--green);">✅ Compaction complete</div>
-        <div style="margin-top:6px;font-size:11px;">
-          Entries: ${data.entriesBefore} → ${data.entriesAfter}<br>
-          Space freed: ${bytesFreedKB}KB
-        </div>
-      `;
-      showNotification('AgentKeeper compacted successfully', 'success');
-      await loadMemoryStats();
-    } else {
-      resultEl.innerHTML = `<div style="color:var(--red);">❌ Compaction failed: ${escapeHtml(data.error || 'unknown error')}</div>`;
-      showNotification(`Compaction failed: ${data.error}`, 'error');
-    }
-  } catch (err) {
-    resultEl.innerHTML = `<div style="color:var(--red);">❌ Compaction failed: ${escapeHtml(err.message)}</div>`;
-    showNotification(`Compaction failed: ${err.message}`, 'error');
-  }
-}
-
-function escapeHtml(str) {
-  const div = document.createElement('div');
-  div.textContent = str;
-  return div.innerHTML;
-}