twining-mcp 1.4.2 → 1.5.0

package/src/dashboard/public/app.js

@@ -18,6 +18,7 @@ var state = {
   delegations: { data: [], sortKey: "timestamp", sortDir: "desc", page: 1, pageSize: 25, selectedId: null },
   handoffs: { data: [], sortKey: "created_at", sortDir: "desc", page: 1, pageSize: 25, selectedId: null },
   agentsSubView: "agents-list",
+  insights: { valueStats: null, toolUsage: [], errors: [] },
   globalScope: "",
   status: null,
   pollTimer: null,
@@ -278,6 +279,44 @@ function fetchHandoffDetail(id) {
     });
 }
 
+/* ========== Insights Fetching ========== */
+
+function fetchValueStats() {
+  fetch("/api/analytics/value-stats")
+    .then(function(res) { return res.json(); })
+    .then(function(data) {
+      state.insights.valueStats = data;
+      renderValueStats();
+    })
+    .catch(function() {});
+}
+
+function fetchToolUsage() {
+  fetch("/api/analytics/tool-usage")
+    .then(function(res) { return res.json(); })
+    .then(function(data) {
+      state.insights.toolUsage = data.tools || [];
+      renderToolUsage();
+    })
+    .catch(function() {});
+}
+
+function fetchErrorBreakdown() {
+  fetch("/api/analytics/errors")
+    .then(function(res) { return res.json(); })
+    .then(function(data) {
+      state.insights.errors = data.errors || [];
+      renderErrorBreakdown();
+    })
+    .catch(function() {});
+}
+
+function fetchInsights() {
+  fetchValueStats();
+  fetchToolUsage();
+  fetchErrorBreakdown();
+}
+
 /* ========== Polling Lifecycle ========== */
 
 function refreshData() {
@@ -293,6 +332,7 @@ function refreshData() {
     else if (state.agentsSubView === "delegations") fetchDelegations();
     else if (state.agentsSubView === "handoffs") fetchHandoffs();
   }
+  else if (tab === "insights") fetchInsights();
 }
 
 function startPolling() {
@@ -456,6 +496,13 @@ function renderStatus() {
   setVal("stat-pending-delegations", s.pending_delegations);
   setVal("stat-total-handoffs", s.total_handoffs);
 
+  // Update project name in header and page title
+  if (s.project_name) {
+    var titleEl = document.getElementById("dashboard-title");
+    if (titleEl) titleEl.textContent = s.project_name + " — Twining";
+    document.title = s.project_name + " — Twining Dashboard";
+  }
+
   var msgEl = document.getElementById("uninitialized-msg");
   if (msgEl) {
     msgEl.style.display = (s.initialized === false) ? "block" : "none";
@@ -2391,6 +2438,144 @@ function updateGraphData() {
   }
 }
 
+/* ========== Insights Rendering ========== */
+
+function renderValueStats() {
+  var vs = state.insights.valueStats;
+  if (!vs) return;
+
+  // Blind decisions prevented
+  var prevRate = document.getElementById("insight-prevention-rate");
+  var prevDetail = document.getElementById("insight-prevention-detail");
+  if (prevRate) prevRate.textContent = Math.round(vs.blind_decisions_prevented.prevention_rate * 100) + "%";
+  if (prevDetail) prevDetail.textContent = vs.blind_decisions_prevented.assembled_before + " of " + vs.blind_decisions_prevented.total_decisions + " decisions had context assembled first";
+
+  // Warnings surfaced
+  var warnTotal = document.getElementById("insight-warnings-total");
+  var warnDetail = document.getElementById("insight-warnings-detail");
+  if (warnTotal) warnTotal.textContent = vs.warnings_surfaced.total;
+  if (warnDetail) warnDetail.textContent = vs.warnings_surfaced.acknowledged + " acknowledged, " + vs.warnings_surfaced.resolved + " resolved, " + vs.warnings_surfaced.ignored + " unaddressed";
+
+  // Test coverage
+  var testCov = document.getElementById("insight-test-coverage");
+  var testDetail = document.getElementById("insight-test-detail");
+  if (testCov) testCov.textContent = Math.round(vs.test_coverage.coverage_rate * 100) + "%";
+  if (testDetail) testDetail.textContent = vs.test_coverage.with_tested_by + " of " + vs.test_coverage.total_decisions + " decisions have tested_by relations";
+
+  // Commit traceability
+  var traceVal = document.getElementById("insight-traceability");
+  var traceDetail = document.getElementById("insight-traceability-detail");
+  if (traceVal) traceVal.textContent = Math.round(vs.commit_traceability.traceability_rate * 100) + "%";
+  if (traceDetail) traceDetail.textContent = vs.commit_traceability.with_commits + " of " + vs.commit_traceability.total_decisions + " decisions linked to commits";
+
+  // Decision lifecycle
+  var lcVal = document.getElementById("insight-lifecycle");
+  var lcDetail = document.getElementById("insight-lifecycle-detail");
+  var lc = vs.decision_lifecycle;
+  if (lcVal) lcVal.textContent = (lc.active + lc.provisional + lc.superseded + lc.overridden);
+  if (lcDetail) lcDetail.textContent = lc.active + " active, " + lc.provisional + " provisional, " + lc.superseded + " superseded, " + lc.overridden + " overridden";
+
+  // Knowledge graph
+  var graphVal = document.getElementById("insight-graph");
+  var graphDetail = document.getElementById("insight-graph-detail");
+  if (graphVal) graphVal.textContent = vs.knowledge_graph.entities + " / " + vs.knowledge_graph.relations;
+  if (graphDetail) {
+    var typeStrs = [];
+    var ebt = vs.knowledge_graph.entities_by_type;
+    for (var ek in ebt) { if (ebt.hasOwnProperty(ek)) typeStrs.push(ek + ": " + ebt[ek]); }
+    graphDetail.textContent = typeStrs.length > 0 ? "Entities: " + typeStrs.join(", ") : "No entities";
+  }
+
+  // Agent coordination
+  var coordVal = document.getElementById("insight-coordination");
+  var coordDetail = document.getElementById("insight-coordination-detail");
+  if (coordVal) coordVal.textContent = vs.agent_coordination.total_handoffs;
+  if (coordDetail) coordDetail.textContent = "Acknowledgment rate: " + Math.round(vs.agent_coordination.acknowledgment_rate * 100) + "%";
+}
+
+function renderToolUsage() {
+  var tbody = document.querySelector("#tool-usage-table tbody");
+  if (!tbody) return;
+  clearElement(tbody);
+
+  var tools = state.insights.toolUsage;
+  if (tools.length === 0) {
+    var row = document.createElement("tr");
+    var cell = document.createElement("td");
+    cell.colSpan = 6;
+    cell.textContent = "No tool calls recorded";
+    cell.className = "placeholder";
+    row.appendChild(cell);
+    tbody.appendChild(row);
+    return;
+  }
+
+  for (var i = 0; i < tools.length; i++) {
+    var t = tools[i];
+    var tr = document.createElement("tr");
+
+    var tdName = document.createElement("td");
+    tdName.textContent = t.tool_name;
+    tr.appendChild(tdName);
+
+    var tdCalls = document.createElement("td");
+    tdCalls.textContent = t.call_count;
+    tr.appendChild(tdCalls);
+
+    var tdErrors = document.createElement("td");
+    tdErrors.textContent = t.error_count;
+    if (t.error_count > 0) tdErrors.className = "error-count";
+    tr.appendChild(tdErrors);
+
+    var tdAvg = document.createElement("td");
+    tdAvg.textContent = t.avg_duration_ms;
+    tr.appendChild(tdAvg);
+
+    var tdP95 = document.createElement("td");
+    tdP95.textContent = t.p95_duration_ms;
+    tr.appendChild(tdP95);
+
+    var tdLast = document.createElement("td");
+    tdLast.textContent = formatTime(t.last_called);
+    tr.appendChild(tdLast);
+
+    tbody.appendChild(tr);
+  }
+}
+
+function renderErrorBreakdown() {
+  var tbody = document.querySelector("#error-breakdown-table tbody");
+  var noMsg = document.getElementById("no-errors-msg");
+  if (!tbody) return;
+  clearElement(tbody);
+
+  var errors = state.insights.errors;
+  if (errors.length === 0) {
+    if (noMsg) noMsg.style.display = "block";
+    return;
+  }
+  if (noMsg) noMsg.style.display = "none";
+
+  for (var i = 0; i < errors.length; i++) {
+    var e = errors[i];
+    var tr = document.createElement("tr");
+
+    var tdTool = document.createElement("td");
+    tdTool.textContent = e.tool_name;
+    tr.appendChild(tdTool);
+
+    var tdCode = document.createElement("td");
+    tdCode.textContent = e.error_code;
+    tr.appendChild(tdCode);
+
+    var tdCount = document.createElement("td");
+    tdCount.textContent = e.count;
+    tr.appendChild(tdCount);
+
+    tbody.appendChild(tr);
+  }
+}
+
 /* ========== Initialization ========== */
 
 document.addEventListener("DOMContentLoaded", function() {

package/src/dashboard/public/index.html

@@ -17,7 +17,10 @@
   <header>
     <div class="header-brand">
       <img src="assets/favicon.svg" alt="Twining" width="28" height="28" class="header-logo">
-      <h1>Twining Dashboard</h1>
+      <h1 id="dashboard-title">Twining Dashboard</h1>
+      <a href="https://github.com/twining-mcp/twining-mcp" target="_blank" rel="noopener noreferrer" class="github-link" title="View on GitHub">
+        <svg width="20" height="20" viewBox="0 0 16 16" fill="currentColor"><path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"/></svg>
+      </a>
     </div>
     <div class="global-scope-filter">
       <label for="global-scope">Scope:</label>
@@ -46,6 +49,7 @@
     <button class="tab-btn" data-tab="graph">Graph</button>
     <button class="tab-btn" data-tab="search">Search</button>
     <button class="tab-btn" data-tab="agents">Agents</button>
+    <button class="tab-btn" data-tab="insights">Insights</button>
   </nav>
 
   <div class="search-bar">
@@ -347,6 +351,87 @@
         </div>
       </div>
     </div>
+
+    <!-- Insights Tab -->
+    <div class="tab-content" id="tab-insights" style="display:none">
+      <h3 class="insights-heading">Value Metrics</h3>
+      <div class="insights-grid">
+        <div class="insight-card">
+          <div class="insight-icon">&#x1F6E1;</div>
+          <div class="insight-label">Blind Decisions Prevented</div>
+          <div class="insight-value" id="insight-prevention-rate">--</div>
+          <div class="insight-detail" id="insight-prevention-detail"></div>
+        </div>
+        <div class="insight-card">
+          <div class="insight-icon">&#x26A0;</div>
+          <div class="insight-label">Warnings Surfaced</div>
+          <div class="insight-value" id="insight-warnings-total">--</div>
+          <div class="insight-detail" id="insight-warnings-detail"></div>
+        </div>
+        <div class="insight-card">
+          <div class="insight-icon">&#x2705;</div>
+          <div class="insight-label">Test Coverage</div>
+          <div class="insight-value" id="insight-test-coverage">--</div>
+          <div class="insight-detail" id="insight-test-detail"></div>
+        </div>
+        <div class="insight-card">
+          <div class="insight-icon">&#x1F517;</div>
+          <div class="insight-label">Commit Traceability</div>
+          <div class="insight-value" id="insight-traceability">--</div>
+          <div class="insight-detail" id="insight-traceability-detail"></div>
+        </div>
+        <div class="insight-card">
+          <div class="insight-icon">&#x1F4CA;</div>
+          <div class="insight-label">Decision Lifecycle</div>
+          <div class="insight-value" id="insight-lifecycle">--</div>
+          <div class="insight-detail" id="insight-lifecycle-detail"></div>
+        </div>
+        <div class="insight-card">
+          <div class="insight-icon">&#x1F578;</div>
+          <div class="insight-label">Knowledge Graph</div>
+          <div class="insight-value" id="insight-graph">--</div>
+          <div class="insight-detail" id="insight-graph-detail"></div>
+        </div>
+        <div class="insight-card">
+          <div class="insight-icon">&#x1F91D;</div>
+          <div class="insight-label">Agent Coordination</div>
+          <div class="insight-value" id="insight-coordination">--</div>
+          <div class="insight-detail" id="insight-coordination-detail"></div>
+        </div>
+      </div>
+
+      <h3 class="insights-heading">Tool Usage</h3>
+      <div id="insights-tool-usage">
+        <table class="data-table" id="tool-usage-table">
+          <thead>
+            <tr>
+              <th>Tool</th>
+              <th>Calls</th>
+              <th>Errors</th>
+              <th>Avg (ms)</th>
+              <th>P95 (ms)</th>
+              <th>Last Called</th>
+            </tr>
+          </thead>
+          <tbody></tbody>
+        </table>
+      </div>
+
+      <h3 class="insights-heading">Error Breakdown</h3>
+      <div id="insights-errors">
+        <table class="data-table" id="error-breakdown-table">
+          <thead>
+            <tr>
+              <th>Tool</th>
+              <th>Error Code</th>
+              <th>Count</th>
+            </tr>
+          </thead>
+          <tbody></tbody>
+        </table>
+        <p class="placeholder" id="no-errors-msg" style="display:none">No errors recorded</p>
+      </div>
+    </div>
   </main>
 
   <footer>

package/src/dashboard/public/style.css

@@ -57,6 +57,16 @@ header h1 {
   font-weight: 600;
 }
 
+.github-link {
+  color: var(--text-secondary, #6b7280);
+  display: flex;
+  align-items: center;
+  transition: color 0.15s;
+}
+.github-link:hover {
+  color: var(--text);
+}
+
 .header-status {
   display: flex;
   gap: 1.5rem;
@@ -976,3 +986,76 @@ tr.delegation-expired td { text-decoration: line-through; }
   font-size: 0.75rem;
   color: var(--muted);
 }
+
+/* ========== Insights Tab ========== */
+
+.insights-heading {
+  margin: 1.5rem 0 0.75rem 0;
+  font-size: 1rem;
+  font-weight: 600;
+  color: var(--text);
+}
+
+.insights-heading:first-child {
+  margin-top: 0;
+}
+
+.insights-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
+  gap: 1rem;
+}
+
+.insight-card {
+  background: var(--card-bg);
+  border: 1px solid var(--card-border);
+  border-radius: 8px;
+  padding: 1rem;
+  text-align: center;
+  transition: border-color 0.2s;
+}
+
+.insight-card:hover {
+  border-color: var(--accent);
+}
+
+.insight-icon {
+  font-size: 1.5rem;
+  margin-bottom: 0.25rem;
+}
+
+.insight-label {
+  font-size: 0.75rem;
+  color: var(--muted);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  margin-bottom: 0.25rem;
+}
+
+.insight-value {
+  font-size: 1.75rem;
+  font-weight: 700;
+  color: var(--accent);
+  margin-bottom: 0.25rem;
+}
+
+.insight-detail {
+  font-size: 0.75rem;
+  color: var(--muted);
+  line-height: 1.4;
+}
+
+#insights-tool-usage,
+#insights-errors {
+  margin-bottom: 1.5rem;
+}
+
+#tool-usage-table td,
+#error-breakdown-table td {
+  padding: 0.5rem 0.75rem;
+}
+
+.error-count {
+  color: var(--error);
+  font-weight: 600;
+}