@worca/ui 0.35.0 → 0.36.0

package/app/styles.css

@@ -2295,6 +2295,12 @@ sl-input.pricing-input::part(input) {
   font-size: 13px;
 }
 
+/* CRG invocation badge tooltip lists one tool per line (one <div> each, via
+   the tooltip's HTML content slot) — just left-align them. */
+sl-tooltip.crg-tool-tooltip::part(body) {
+  text-align: left;
+}
+
 .iteration-tags-sep {
   color: var(--fg);
   opacity: 0.7;
@@ -6616,3 +6622,74 @@ sl-dialog.markdown-dialog::part(body) {
 .graphify-not-installed .settings-tab-description {
   color: var(--status-paused);
 }
+
+/* Code Review Graph (CRG) — mirrors graphify-* classes above */
+.crg-codebox {
+  display: block;
+  margin: 0.25rem 0 0.75rem;
+  padding: 0.4rem 0.6rem;
+  background: var(--bg-secondary);
+  border: 1px solid var(--border-subtle);
+  border-radius: var(--radius);
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 0.85rem;
+  color: var(--fg);
+  word-break: break-all;
+  user-select: all;
+}
+
+.crg-copy-row {
+  display: flex;
+  align-items: center;
+  gap: 0.4rem;
+  margin: 0.25rem 0 0.75rem;
+}
+
+.crg-copy-row .crg-codebox {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+}
+
+.crg-not-installed {
+  margin: 0 0 0.75rem;
+}
+
+.crg-not-installed .settings-tab-description {
+  color: var(--status-paused);
+}
+
+.crg-coming-soon {
+  color: var(--muted);
+  font-style: italic;
+}
+
+.crg-stage-tools {
+  margin: 1rem 0;
+}
+
+.crg-stage-tools-grid {
+  display: grid;
+  gap: 0.4rem;
+  margin-top: 0.5rem;
+}
+
+.crg-stage-tools-entry {
+  display: flex;
+  gap: 0.75rem;
+  align-items: baseline;
+  font-size: 0.85rem;
+}
+
+.crg-stage-role {
+  font-weight: 600;
+  min-width: 6rem;
+  color: var(--fg);
+}
+
+.crg-stage-tool-list {
+  color: var(--muted);
+  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
+  font-size: 0.8rem;
+  word-break: break-all;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@worca/ui",
-  "version": "0.35.0",
+  "version": "0.36.0",
   "description": "Pipeline monitoring UI for worca-cc",
   "license": "MIT",
   "author": "Sinisha Djukic",

package/server/app.js

@@ -15,6 +15,10 @@ import { fileURLToPath } from 'node:url';
 import express from 'express';
 
 import { dbExists, getIssue, listIssues } from './beads-reader.js';
+import {
+  _effectiveCrgConfig,
+  createCrgStatus,
+} from './code-review-graph-status.js';
 import { createFleetRouter } from './fleet-routes.js';
 import {
   _effectiveConfig,
@@ -1165,6 +1169,150 @@ export function createApp(options = {}) {
     res.sendFile(htmlPath);
   });
 
+  // ─── CRG (code-review-graph) endpoints ─────────────────────────────────
+  if (!app.locals.crgStatus) {
+    app.locals.crgStatus = createCrgStatus({});
+  }
+
+  function readCrgSettings(projectId) {
+    const readJson = (p) => {
+      if (!p) return {};
+      try {
+        return JSON.parse(readFileSync(p, 'utf-8'));
+      } catch {
+        return {};
+      }
+    };
+    const globalSettingsPath = prefsDir
+      ? join(prefsDir, 'settings.json')
+      : settingsPath;
+
+    let projectSettingsPath = settingsPath;
+    let root = projectRoot || process.cwd();
+    if (projectId && prefsDir) {
+      const proj = readProjects(prefsDir).find((p) => p.name === projectId);
+      if (proj) {
+        projectSettingsPath =
+          proj.settingsPath || join(proj.path, '.claude', 'settings.json');
+        root = proj.path;
+      }
+    } else if (!projectSettingsPath && projectRoot) {
+      projectSettingsPath = join(projectRoot, '.claude', 'settings.json');
+    }
+
+    return {
+      globalSettings: readJson(globalSettingsPath),
+      projectSettings: readJson(projectSettingsPath),
+      root,
+    };
+  }
+
+  async function crgStatusPayload(projectId) {
+    const { globalSettings, projectSettings, root } =
+      readCrgSettings(projectId);
+    const result = await app.locals.crgStatus.getStatus({
+      globalSettings,
+      projectSettings,
+      projectRoot: root,
+    });
+    return { ...result, building: Boolean(app.locals.crgBuilding) };
+  }
+
+  app.get('/api/crg/status', async (req, res) => {
+    try {
+      res.json(await crgStatusPayload(req.query.project));
+    } catch (err) {
+      res.status(500).json({ ok: false, error: err.message });
+    }
+  });
+
+  app.post('/api/crg/recheck', async (req, res) => {
+    try {
+      app.locals.crgStatus.invalidate();
+      res.json(await crgStatusPayload(req.query.project));
+    } catch (err) {
+      res.status(500).json({ ok: false, error: err.message });
+    }
+  });
+
+  app.post('/api/crg/build', async (req, res) => {
+    try {
+      const { globalSettings, projectSettings, root } = readCrgSettings(
+        req.query.project,
+      );
+      const effective = _effectiveCrgConfig(globalSettings, projectSettings);
+      if (!effective.enabled) {
+        return res
+          .status(400)
+          .json({ ok: false, error: 'Code-review-graph is not enabled' });
+      }
+      const detection = await app.locals.crgStatus.detect();
+      if (
+        !detection.installed ||
+        !detection.compatible ||
+        !detection.fastmcp_ok
+      ) {
+        return res.status(400).json({
+          ok: false,
+          error:
+            detection.error ||
+            'Code-review-graph is not installed or not compatible',
+        });
+      }
+      if (app.locals.crgBuilding) {
+        return res.json({ ok: true, status: 'building' });
+      }
+      const snap = snapshotDir(root);
+      if (snap) {
+        try {
+          rmSync(snap, { recursive: true, force: true });
+        } catch {}
+      }
+      app.locals.crgBuilding = true;
+      const child = spawn(
+        'python3',
+        [
+          '-c',
+          'from worca.scripts.crg_preflight import run_crg_preflight as r; r()',
+        ],
+        { cwd: root, stdio: 'ignore' },
+      );
+      const done = () => {
+        app.locals.crgBuilding = false;
+        app.locals.crgStatus.invalidate();
+      };
+      child.on('exit', done);
+      child.on('error', done);
+      res.json({ ok: true, status: 'building' });
+    } catch (err) {
+      app.locals.crgBuilding = false;
+      res.status(500).json({ ok: false, error: err.message });
+    }
+  });
+
+  app.post('/api/crg/clear', async (req, res) => {
+    try {
+      const { root } = readCrgSettings(req.query.project);
+      const cleared = clearRepoCache(root);
+      app.locals.crgStatus.invalidate();
+      res.json({ ok: true, cleared });
+    } catch (err) {
+      res.status(500).json({ ok: false, error: err.message });
+    }
+  });
+
+  app.get('/api/crg/graph.html', (req, res) => {
+    const { root } = readCrgSettings(req.query.project);
+    const snap = snapshotDir(root);
+    const htmlPath = snap
+      ? join(snap, 'code-review-graph', 'graph.html')
+      : null;
+    if (!htmlPath || !existsSync(htmlPath)) {
+      return res.status(404).json({ ok: false, error: 'graph.html not found' });
+    }
+    res.sendFile(htmlPath);
+  });
+
   // ─── Dynamic favicon ──────────────────────────────────────────────────
   // Serve mode-specific favicon before express.static so it takes precedence.
   app.get('/favicon.svg', (_req, res) => {

package/server/code-review-graph-status.js

@@ -0,0 +1,206 @@
+import { spawn } from 'node:child_process';
+import { existsSync, statSync } from 'node:fs';
+import { join } from 'node:path';
+
+import { repoCacheDir, snapshotDir } from './graphify-status.js';
+
+// Mirror of _CRG_DEFAULTS in src/worca/utils/code_review_graph.py — keep in sync.
+const CRG_DEFAULTS = {
+  enabled: false,
+  embeddings: false,
+  update_on: {
+    preflight: true,
+    post_implement: true,
+    guardian_post_commit: true,
+  },
+  freshness: 'clean_only',
+  min_repo_files: 100,
+  version_range: '>=2,<3',
+  fastmcp_min: '3.2.4',
+  preflight_timeout_seconds: 300,
+  stage_tools: null,
+};
+
+// Mirror of effective_crg_config() in src/worca/utils/code_review_graph.py.
+// Enablement is project-level: the project opts in via code_review_graph.enabled.
+// Global code_review_graph.enabled is purely a kill-switch — an EXPLICIT global
+// `false` disables everywhere; `true`/unset defer to the project. These rules
+// MUST match the Python implementation; the parity is guarded by
+// code-review-graph-status.test.js ("_effectiveCrgConfig parity with Python").
+// Update both together.
+export function _effectiveCrgConfig(globalSettings, projectSettings) {
+  const gCrg = globalSettings?.worca?.code_review_graph ?? {};
+  const pCrg = projectSettings?.worca?.code_review_graph ?? {};
+
+  if (gCrg.enabled === false) {
+    return _disabledConfig('global-off');
+  }
+
+  const projectEnabled = pCrg.enabled ?? false;
+  if (!projectEnabled) {
+    return _disabledConfig('project-off');
+  }
+
+  const merged = { ...CRG_DEFAULTS };
+  for (const [k, v] of Object.entries(gCrg)) {
+    if (v != null || k === 'enabled') merged[k] = v;
+  }
+  for (const [k, v] of Object.entries(pCrg)) {
+    if (v != null || k === 'enabled') merged[k] = v;
+  }
+
+  const defaultsUpdateOn = { ...CRG_DEFAULTS.update_on };
+  if (gCrg.update_on && typeof gCrg.update_on === 'object') {
+    Object.assign(defaultsUpdateOn, gCrg.update_on);
+  }
+  if (pCrg.update_on && typeof pCrg.update_on === 'object') {
+    Object.assign(defaultsUpdateOn, pCrg.update_on);
+  }
+
+  return {
+    enabled: true,
+    embeddings: merged.embeddings,
+    update_on_preflight: defaultsUpdateOn.preflight ?? true,
+    update_on_post_implement: defaultsUpdateOn.post_implement ?? true,
+    update_on_guardian_post_commit:
+      defaultsUpdateOn.guardian_post_commit ?? true,
+    min_repo_files: merged.min_repo_files,
+    version_range: merged.version_range,
+    fastmcp_min: merged.fastmcp_min,
+    preflight_timeout_seconds: merged.preflight_timeout_seconds,
+    freshness: merged.freshness,
+    stage_tools: merged.stage_tools,
+    reason: null,
+  };
+}
+
+function _disabledConfig(reason) {
+  const d = CRG_DEFAULTS;
+  const u = d.update_on;
+  return {
+    enabled: false,
+    embeddings: d.embeddings,
+    update_on_preflight: u.preflight,
+    update_on_post_implement: u.post_implement,
+    update_on_guardian_post_commit: u.guardian_post_commit,
+    min_repo_files: d.min_repo_files,
+    version_range: d.version_range,
+    fastmcp_min: d.fastmcp_min,
+    preflight_timeout_seconds: d.preflight_timeout_seconds,
+    freshness: d.freshness,
+    stage_tools: d.stage_tools,
+    reason,
+  };
+}
+
+// ─── Per-commit CRG graph stats ─────────────────────────────────────────
+
+const _CRG_SUBDIR = 'code-review-graph';
+
+export function _crgGraphStats(snapDir) {
+  if (!snapDir) return null;
+  const dbPath = join(snapDir, _CRG_SUBDIR, 'graph.db');
+  if (!existsSync(dbPath)) return null;
+
+  const stat = statSync(dbPath);
+  const ageSeconds = Math.max(0, (Date.now() - stat.mtimeMs) / 1000);
+  const htmlPath = join(snapDir, _CRG_SUBDIR, 'graph.html');
+
+  return {
+    db_path: dbPath,
+    snapshot_dir: snapDir,
+    age_seconds: ageSeconds,
+    size_bytes: stat.size,
+    has_html: existsSync(htmlPath),
+  };
+}
+
+// ─── Detection (delegates to Python detect_code_review_graph) ───────────
+
+function defaultDetect() {
+  return new Promise((resolve) => {
+    const child = spawn(
+      'python3',
+      [
+        '-c',
+        'import json; from worca.utils.code_review_graph import detect_code_review_graph; d = detect_code_review_graph(); print(json.dumps({"installed": d.installed, "version": d.version, "compatible": d.compatible, "fastmcp_ok": d.fastmcp_ok, "error": d.error}))',
+      ],
+      { stdio: ['ignore', 'pipe', 'pipe'] },
+    );
+
+    let stdout = '';
+    let stderr = '';
+    child.stdout.on('data', (chunk) => {
+      stdout += chunk.toString();
+    });
+    child.stderr.on('data', (chunk) => {
+      stderr += chunk.toString();
+    });
+    child.on('error', () => {
+      resolve({
+        installed: false,
+        version: null,
+        compatible: false,
+        fastmcp_ok: false,
+        error: 'python3 not available',
+      });
+    });
+    child.on('exit', (code) => {
+      if (code === 0 && stdout.trim()) {
+        try {
+          resolve(JSON.parse(stdout.trim()));
+          return;
+        } catch {
+          // fall through
+        }
+      }
+      resolve({
+        installed: false,
+        version: null,
+        compatible: false,
+        fastmcp_ok: false,
+        error: stderr.trim() || `detect exited ${code}`,
+      });
+    });
+  });
+}
+
+const DEFAULT_TTL_MS = 60_000;
+
+export function createCrgStatus(opts = {}) {
+  const detectFn = opts.detectFn || defaultDetect;
+  const ttlMs = opts.ttlMs ?? DEFAULT_TTL_MS;
+
+  let cached = null;
+  let cachedAt = 0;
+
+  async function detect() {
+    const now = Date.now();
+    if (cached && now - cachedAt < ttlMs) return cached;
+    cached = await detectFn();
+    cachedAt = Date.now();
+    return cached;
+  }
+
+  function invalidate() {
+    cached = null;
+    cachedAt = 0;
+  }
+
+  async function getStatus({ globalSettings, projectSettings, projectRoot }) {
+    const effective = _effectiveCrgConfig(globalSettings, projectSettings);
+    const detection = await detect();
+    const graphStats = effective.enabled
+      ? _crgGraphStats(snapshotDir(projectRoot))
+      : null;
+    return {
+      ok: true,
+      effective,
+      detection,
+      graph_stats: graphStats,
+      cache_path: repoCacheDir(projectRoot),
+    };
+  }
+
+  return { detect, invalidate, getStatus };
+}