@axiomatic-labs/claudeflow 2.13.75 → 2.13.77

package/lib/panel.js

@@ -286,6 +286,29 @@ function getEnforcementInfo(cwd) {
   };
 }
 
+function getValidatorsInfo(cwd) {
+  const file = path.join(cwd, '.claudeflow', 'tmp', 'validators-state.json');
+  let state = null;
+  try {
+    const raw = fs.readFileSync(file, 'utf8');
+    if (raw.trim()) state = JSON.parse(raw);
+  } catch {}
+  if (!state || !Array.isArray(state.runs)) {
+    return { ok: true, available: false, updated_at: null, runs: [], stats: { total: 0, pass: 0, block: 0, skip: 0, error: 0 } };
+  }
+  const stats = { total: state.runs.length, pass: 0, block: 0, skip: 0, error: 0 };
+  for (const r of state.runs) {
+    if (stats[r.status] !== undefined) stats[r.status] += 1;
+  }
+  return {
+    ok: true,
+    available: true,
+    updated_at: state.updated_at || null,
+    runs: state.runs,
+    stats,
+  };
+}
+
 function getObserverInfo(cwd) {
   // Read both the canonical state file (full snapshot) AND the summary file
   // (which is what hooks consume — has the incident filter applied).
@@ -639,6 +662,7 @@ function collectStatus(cwd) {
     runToCompletion: getRunToCompletionInfo(cwd),
     cwdLock: getCwdLockInfo(cwd),
     observer: getObserverInfo(cwd),
+    validators: getValidatorsInfo(cwd),
     activePlan: getActivePlanInfo(cwd),
     logs: getLogsInfo(cwd),
     doctor: getDoctorInfo(cwd),
@@ -848,6 +872,7 @@ const SECTIONS = [
   { id: 'reminders',    label: 'Reminders' },
   { id: 'logs',         label: 'Logs' },
   { id: 'observer',     label: 'Observer' },
+  { id: 'validators',   label: 'Validators' },
   { id: 'activePlan',   label: 'Active plan' },
   { id: 'mcp',          label: 'MCP & observer' },
   { id: 'setupContext', label: 'Setup context' },
@@ -859,6 +884,8 @@ let state = null;
 let active = 'overview';
 let observerFilter = 'all';
 let observerShowResolved = false;
+let validatorsFilter = 'all';
+let validatorsStatusFilter = 'all';
 let timer = null;
 
 // Preserve which <details> were open across re-renders (auto-refresh would
@@ -1061,6 +1088,7 @@ function renderContent() {
     reminders: renderReminders,
     logs: renderLogs,
     observer: renderObserver,
+    validators: renderValidators,
     activePlan: renderActivePlan,
     mcp: renderMcp,
     setupContext: renderSetup,
@@ -1632,6 +1660,78 @@ function renderObserver() {
     <div class="card" style="padding:0;">\${incidentsBlock}</div>\`;
 }
 
+function renderValidators() {
+  const v = (state && state.validators) || { available: false, runs: [], stats: { total: 0, pass: 0, block: 0, skip: 0, error: 0 } };
+  if (!v.available || v.runs.length === 0) {
+    return \`<h2>Validators</h2><p class="muted">No validator runs recorded yet. The security-scan and validate-file hooks log here on every Stop / SubagentStop / TaskCompleted event.</p>\`;
+  }
+
+  const validators = [...new Set(v.runs.map((r) => r.validator))].sort();
+  const validatorPill = (label, value, count) => {
+    const a = (validatorsFilter === value);
+    const cls = a ? 'pill pill-active' : 'pill';
+    return \`<button class="\${cls}" data-validators-filter="\${escapeHtml(value)}">\${escapeHtml(label)}<span class="muted" style="margin-left:6px;font-size:11px;">\${count}</span></button>\`;
+  };
+  const statusPill = (label, value, count) => {
+    const a = (validatorsStatusFilter === value);
+    const cls = a ? 'pill pill-active' : 'pill';
+    return \`<button class="\${cls}" data-validators-status-filter="\${escapeHtml(value)}">\${escapeHtml(label)}<span class="muted" style="margin-left:6px;font-size:11px;">\${count}</span></button>\`;
+  };
+
+  const filteredByValidator = validatorsFilter === 'all'
+    ? v.runs
+    : v.runs.filter((r) => r.validator === validatorsFilter);
+  const filtered = validatorsStatusFilter === 'all'
+    ? filteredByValidator
+    : filteredByValidator.filter((r) => r.status === validatorsStatusFilter);
+
+  const STATUS_BADGE = {
+    pass:  '<span style="color:#3fb950;font-weight:600;">pass</span>',
+    block: '<span style="color:#f85149;font-weight:600;">block</span>',
+    skip:  '<span class="muted">skip</span>',
+    error: '<span style="color:#d29922;font-weight:600;">error</span>',
+  };
+
+  const runRows = filtered.map((r) => {
+    const when = formatRelativeTime(r.finished_at || r.started_at);
+    const dur = (r.duration_ms && r.duration_ms > 0) ? \` · \${r.duration_ms}ms\` : '';
+    const status = STATUS_BADGE[r.status] || escapeHtml(r.status);
+    const findingsLine = (r.findings && r.findings.length > 0)
+      ? \`<details style="margin-top:6px;"><summary class="muted" style="cursor:pointer;font-size:11px;">\${r.findings_count} finding(s) — show</summary><pre style="margin:6px 0 0 0;font-size:11px;white-space:pre-wrap;">\${escapeHtml(JSON.stringify(r.findings, null, 2))}</pre></details>\`
+      : '';
+    return \`<div style="border-bottom:1px solid var(--border);padding:10px 12px;">
+      <div style="display:flex;justify-content:space-between;gap:12px;">
+        <div><strong>\${escapeHtml(r.validator)}</strong> <span class="muted">→</span> \${escapeHtml(r.scope)} <span class="muted" style="margin-left:8px;font-size:11px;">\${escapeHtml(r.hook_event || '')}</span></div>
+        <div style="font-size:12px;">\${status} <span class="muted">· \${when}\${dur}</span></div>
+      </div>
+      <div class="muted" style="font-size:12px;margin-top:4px;">\${escapeHtml(r.reason || '')}</div>
+      \${findingsLine}
+    </div>\`;
+  }).join('');
+
+  const validatorPills = [validatorPill('all', 'all', v.runs.length), ...validators.map((vname) =>
+    validatorPill(vname, vname, v.runs.filter((r) => r.validator === vname).length)
+  )].join(' ');
+
+  const statusPills = ['all', 'pass', 'block', 'skip', 'error'].map((s) =>
+    statusPill(s, s, s === 'all' ? v.runs.length : v.runs.filter((r) => r.status === s).length)
+  ).join(' ');
+
+  return \`<h2>Validators
+    <button id="clear-validators" class="btn btn-ghost" style="float:right;font-size:12px;">Clear history</button>
+  </h2>
+  <p class="muted" style="margin-top:0;">Last updated \${formatRelativeTime(v.updated_at)} · \${v.stats.total} total run(s): \${v.stats.pass} pass, \${v.stats.block} block, \${v.stats.skip} skip, \${v.stats.error} error.</p>
+  <div style="margin:12px 0;">
+    <div style="margin-bottom:6px;"><span class="muted" style="font-size:11px;text-transform:uppercase;">Validator</span></div>
+    \${validatorPills}
+  </div>
+  <div style="margin:12px 0;">
+    <div style="margin-bottom:6px;"><span class="muted" style="font-size:11px;text-transform:uppercase;">Status</span></div>
+    \${statusPills}
+  </div>
+  <div class="card" style="padding:0;">\${runRows || '<p class="muted" style="padding:12px;">No runs match the current filter.</p>'}</div>\`;
+}
+
 function formatRelativeTime(iso) {
   if (!iso) return 'never';
   try {
@@ -1791,8 +1891,40 @@ document.addEventListener('click', (e) => {
     renderContent();
     return;
   }
+  if (t.dataset && t.dataset.validatorsFilter) {
+    validatorsFilter = t.dataset.validatorsFilter;
+    renderContent();
+    return;
+  }
+  if (t.dataset && t.dataset.validatorsStatusFilter) {
+    validatorsStatusFilter = t.dataset.validatorsStatusFilter;
+    renderContent();
+    return;
+  }
+  if (t.id === 'clear-validators') {
+    return clearValidatorsAction(t);
+  }
 });
 
+async function clearValidatorsAction(btn) {
+  if (!confirm('Clear validator run history? This wipes the log shown in this tab. Validators continue running.')) return;
+  const originalLabel = btn.textContent;
+  btn.disabled = true;
+  btn.textContent = 'Clearing…';
+  try {
+    const r = await fetch('/api/validators/clear', { method: 'POST' });
+    const result = await r.json();
+    if (r.ok && result.ok) showToast('Validator history cleared', 'ok');
+    else showToast('Clear failed: ' + (result.error || 'unknown'), 'err');
+  } catch (e) {
+    showToast('Network error: ' + e.message, 'err');
+  } finally {
+    btn.disabled = false;
+    btn.textContent = originalLabel;
+    await refresh();
+  }
+}
+
 async function clearObserverAction(btn) {
   if (!confirm('Resolve all active observer incidents and clear server logs?\\n\\nIncident history is preserved in state.incidents (marked resolved). Future events repopulate normally. This cannot be undone.')) return;
   const originalLabel = btn.textContent;
@@ -2220,6 +2352,16 @@ function handler(cwd) {
         return send(502, JSON.stringify({ ok: false, error: 'observer returned ' + result.status, daemon_response: result.body }), 'application/json');
       }
 
+      if (req.method === 'POST' && route === '/api/validators/clear') {
+        try {
+          const validatorState = require(path.join(cwd, '.claudeflow', 'runtime', 'validator-state.js'));
+          validatorState.clearState(cwd);
+          return send(200, JSON.stringify({ ok: true }), 'application/json');
+        } catch (err) {
+          return send(500, JSON.stringify({ ok: false, error: err.message }), 'application/json');
+        }
+      }
+
       if (req.method === 'POST' && route === '/api/observer/restart') {
         // Re-run the SessionStart/browser-error-daemon.js hook script
         // synchronously. The script calls ensureObserver() which spawns
@@ -2389,6 +2531,7 @@ module.exports.start = start;
 module.exports.createPanelServer = handler;
 module.exports.derivePanelPort = derivePanelPort;
 module.exports.getObserverInfo = getObserverInfo;
+module.exports.getValidatorsInfo = getValidatorsInfo;
 module.exports.collectStatus = collectStatus;
 module.exports.getClaudeMdInfo = getClaudeMdInfo;
 module.exports.getHooksInfo = getHooksInfo;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axiomatic-labs/claudeflow",
-  "version": "2.13.75",
+  "version": "2.13.77",
   "description": "Claudeflow — AI-powered development toolkit for Claude Code. Skills, agents, hooks, and quality gates that ship production apps.",
   "bin": {
     "claudeflow": "./bin/cli.js"