agentflow-dashboard 0.3.0 → 0.3.1

package/README.md

@@ -1,15 +1,32 @@
-# AgentFlow Dashboard
+# AgentFlow Dashboard v0.3.0
 
-Real-time monitoring dashboard for AgentFlow - Visualize agent execution graphs and performance metrics in a beautiful web interface.
+Real-time monitoring dashboard for AgentFlow - Visualize agent execution graphs and performance metrics with comprehensive agent infrastructure monitoring.
 
 ## Features
 
-- **Real-time Monitoring** - Live updates via WebSocket connections
-- **Agent Performance Metrics** - Success rates, execution times, and activity tracking
-- **Execution Graph Visualization** - Interactive display of agent execution flows
-- **Multi-Agent System Overview** - Monitor entire agent ecosystems at once
+### **🎯 Universal Agent Monitoring**
+- **Alfred Integration** - Full Alfred worker and conversation monitoring
+- **OpenClaw Support** - OpenClaw gateway and agent trace ingestion
+- **Multi-Framework** - Supports LangChain, CrewAI, AutoGen, Mastra, and more
+- **Real-time Updates** - Live WebSocket connections with instant trace updates
+
+### **🛠️ Enhanced Process Health**
+- **Process Tagging** - Smart categorization (`main`, `agents`, `browser`, `context`, `exec`, `read`, `tool`, `think`, `user`, `write`)
+- **Tree View Structure** - Hierarchical process relationships with parent-child visualization
+- **Infrastructure Detection** - Automatic detection of Milvus, Redis, PostgreSQL, and vector databases
+- **Resource Monitoring** - CPU, memory, and uptime tracking for all processes
+
+### **💬 LLM Conversation Tracking**
+- **Session Parsing** - Full Alfred and OpenClaw conversation logs
+- **Token Usage** - OpenRouter, Claude, and other provider usage statistics
+- **Model Interactions** - Complete LLM request/response chains with metadata
+- **Activity Filtering** - Filter traces by agent activity type and behavior
+
+### **📊 Performance & Visualization**
+- **Interactive Graphs** - Cytoscape.js execution flow visualization
+- **Timeline View** - Waterfall execution timeline with duration metrics
+- **Success Metrics** - Agent performance, failure rates, and health monitoring
 - **Responsive Design** - Works on desktop and mobile devices
-- **Zero Configuration** - Auto-discovers trace files and starts monitoring
 
 ## Quick Start
 

package/dist/{chunk-2FTN742J.js → chunk-EDHK4NJD.js}

@@ -1,3 +1,12 @@
+// src/server.ts
+import express from "express";
+import * as fs3 from "fs";
+import { createServer } from "http";
+import * as path3 from "path";
+import { fileURLToPath } from "url";
+import { WebSocketServer } from "ws";
+import { discoverProcessConfig, auditProcesses } from "agentflow-core";
+
 // src/stats.ts
 import { getFailures, getHungNodes, getStats } from "agentflow-core";
 var AgentStats = class {
@@ -950,16 +959,154 @@ var TraceWatcher = class extends EventEmitter {
   }
 };
 
-// src/server.ts
-import express from "express";
+// src/cli.ts
 import * as fs2 from "fs";
-import { createServer } from "http";
+import * as os from "os";
 import * as path2 from "path";
-import { fileURLToPath } from "url";
-import { WebSocketServer } from "ws";
-import { discoverProcessConfig, auditProcesses } from "agentflow-core";
+var VERSION = "0.3.1";
+function getLanAddress() {
+  const interfaces = os.networkInterfaces();
+  for (const name of Object.keys(interfaces)) {
+    for (const iface of interfaces[name] || []) {
+      if (iface.family === "IPv4" && !iface.internal) {
+        return iface.address;
+      }
+    }
+  }
+  return null;
+}
+function printBanner(config, traceCount, stats) {
+  var _a;
+  const lan = getLanAddress();
+  const host = config.host || "localhost";
+  const port = config.port;
+  const isPublic = host === "0.0.0.0";
+  console.log(`
+   ___                    _   _____ _
+  / _ \\  __ _  ___ _ __ | |_|  ___| | _____      __
+ | |_| |/ _\` |/ _ \\ '_ \\| __| |_  | |/ _ \\ \\ /\\ / /
+ |  _  | (_| |  __/ | | | |_|  _| | | (_) \\ V  V /
+ |_| |_|\\__, |\\___|_| |_|\\__|_|   |_|\\___/ \\_/\\_/
+        |___/              dashboard v${VERSION}
+
+  See your agents think.
+
+  \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510              \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510              \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510
+  \u2502  \u{1F916} Agents          \u2502  TRACE FILES \u2502  \u{1F4CA} AgentFlow      \u2502  SHOWS YOU   \u2502  \u{1F310} Your browser   \u2502
+  \u2502  Execute tasks,   \u2502 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500> \u2502  Reads traces,    \u2502 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500> \u2502  Interactive      \u2502
+  \u2502  write JSON       \u2502              \u2502  builds graphs,  \u2502              \u2502  graph, timeline, \u2502
+  \u2502  trace files.     \u2502              \u2502  serves dashboard.\u2502              \u2502  metrics, health. \u2502
+  \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518              \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518              \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518
+
+  Runs locally. Your data never leaves your machine.
+
+  Tabs: \u{1F3AF} Graph \xB7 \u23F1\uFE0F  Timeline \xB7 \u{1F4CA} Metrics \xB7 \u{1F6E0}\uFE0F  Process Health \xB7 \u26A0\uFE0F  Errors
+
+  Traces:     ${config.tracesDir}${((_a = config.dataDirs) == null ? void 0 : _a.length) ? "\n  Data dirs:  " + config.dataDirs.join("\n              ") : ""}
+  Loaded:     ${traceCount} traces \xB7 ${stats.totalAgents} agents \xB7 ${stats.totalExecutions} executions
+  Success:    ${stats.globalSuccessRate.toFixed(1)}%${stats.activeAgents > 0 ? ` \xB7 ${stats.activeAgents} active now` : ""}
+  CORS:       ${config.enableCors ? "enabled" : "disabled"}
+  WebSocket:  live updates enabled
+
+  \u2192 http://localhost:${port}${isPublic && lan ? `
+  \u2192 http://${lan}:${port}  (LAN)` : ""}
+`);
+}
+async function startDashboard() {
+  const args = process.argv.slice(2);
+  const config = {
+    port: 3e3,
+    tracesDir: "./traces",
+    host: "localhost",
+    enableCors: false
+  };
+  for (let i = 0; i < args.length; i++) {
+    switch (args[i]) {
+      case "--port":
+      case "-p":
+        config.port = parseInt(args[++i]) || 3e3;
+        break;
+      case "--traces":
+      case "-t":
+        config.tracesDir = args[++i];
+        break;
+      case "--host":
+      case "-h":
+        config.host = args[++i];
+        break;
+      case "--data-dir":
+        if (!config.dataDirs) config.dataDirs = [];
+        config.dataDirs.push(args[++i]);
+        break;
+      case "--cors":
+        config.enableCors = true;
+        break;
+      case "--help":
+        printHelp();
+        process.exit(0);
+    }
+  }
+  const tracesPath = path2.resolve(config.tracesDir);
+  if (!fs2.existsSync(tracesPath)) {
+    fs2.mkdirSync(tracesPath, { recursive: true });
+  }
+  config.tracesDir = tracesPath;
+  console.log("\nStarting AgentFlow Dashboard...\n");
+  const dashboard = new DashboardServer(config);
+  process.on("SIGINT", async () => {
+    console.log("\n\u{1F6D1} Shutting down dashboard...");
+    await dashboard.stop();
+    process.exit(0);
+  });
+  process.on("SIGTERM", async () => {
+    await dashboard.stop();
+    process.exit(0);
+  });
+  try {
+    await dashboard.start();
+    setTimeout(() => {
+      const stats = dashboard.getStats();
+      const traces = dashboard.getTraces();
+      printBanner(config, traces.length, stats);
+    }, 1500);
+  } catch (error) {
+    console.error("\u274C Failed to start dashboard:", error);
+    process.exit(1);
+  }
+}
+function printHelp() {
+  console.log(`
+\u{1F4CA} AgentFlow Dashboard v${VERSION} \u2014 See your agents think.
+
+Usage:
+  agentflow-dashboard [options]
+  npx agentflow-dashboard [options]
+
+Options:
+  -p, --port <number>     Server port (default: 3000)
+  -t, --traces <path>     Traces directory (default: ./traces)
+  -h, --host <address>    Host address (default: localhost)
+  --data-dir <path>       Extra data directory for process discovery (repeatable)
+  --cors                  Enable CORS headers
+  --help                  Show this help message
+
+Examples:
+  agentflow-dashboard --traces ./traces --host 0.0.0.0 --cors
+  agentflow-dashboard -p 8080 -t /var/log/agentflow
+  agentflow-dashboard --traces ./traces --data-dir ./workers --data-dir ./cron
+
+Tabs:
+  \u{1F3AF} Graph            Interactive Cytoscape.js execution graph
+  \u23F1\uFE0F  Timeline          Waterfall view of node durations
+  \u{1F4CA} Metrics           Success rates, durations, node breakdown
+  \u{1F6E0}\uFE0F  Process Health    PID files, systemd, workers, orphans
+  \u26A0\uFE0F  Errors            Failed and hung nodes with metadata
+`);
+}
+
+// src/server.ts
 var __filename = fileURLToPath(import.meta.url);
-var __dirname = path2.dirname(__filename);
+var __dirname = path3.dirname(__filename);
 var DashboardServer = class {
   constructor(config) {
     this.config = config;
@@ -989,8 +1136,8 @@ var DashboardServer = class {
         next();
       });
     }
-    const publicDir = path2.join(__dirname, "../public");
-    if (fs2.existsSync(publicDir)) {
+    const publicDir = path3.join(__dirname, "../public");
+    if (fs3.existsSync(publicDir)) {
       this.app.use(express.static(publicDir));
     }
     this.app.get("/api/traces", (req, res) => {
@@ -1062,7 +1209,7 @@ var DashboardServer = class {
         }
         const discoveryDirs = [
           this.config.tracesDir,
-          path2.dirname(this.config.tracesDir),
+          path3.dirname(this.config.tracesDir),
           ...this.config.dataDirs || []
         ];
         const processConfig = discoverProcessConfig(discoveryDirs);
@@ -1077,8 +1224,8 @@ var DashboardServer = class {
       }
     });
     this.app.get("*", (req, res) => {
-      const indexPath = path2.join(__dirname, "../public/index.html");
-      if (fs2.existsSync(indexPath)) {
+      const indexPath = path3.join(__dirname, "../public/index.html");
+      if (fs3.existsSync(indexPath)) {
         res.sendFile(indexPath);
       } else {
         res.status(404).send("Dashboard not found - public files may not be built");
@@ -1135,21 +1282,21 @@ var DashboardServer = class {
     });
   }
   async start() {
-    return new Promise((resolve2) => {
+    return new Promise((resolve3) => {
       const host = this.config.host || "localhost";
       this.server.listen(this.config.port, host, () => {
         console.log(`AgentFlow Dashboard running at http://${host}:${this.config.port}`);
         console.log(`Watching traces in: ${this.config.tracesDir}`);
-        resolve2();
+        resolve3();
       });
     });
   }
   async stop() {
-    return new Promise((resolve2) => {
+    return new Promise((resolve3) => {
       this.watcher.stop();
       this.server.close(() => {
         console.log("Dashboard server stopped");
-        resolve2();
+        resolve3();
       });
     });
   }
@@ -1160,9 +1307,13 @@ var DashboardServer = class {
     return this.watcher.getAllTraces();
   }
 };
+if (import.meta.url === `file://${process.argv[1]}`) {
+  startDashboard().catch(console.error);
+}
 
 export {
   AgentStats,
   TraceWatcher,
-  DashboardServer
+  DashboardServer,
+  startDashboard
 };

package/dist/cli.cjs

@@ -1201,9 +1201,12 @@ var DashboardServer = class {
     return this.watcher.getAllTraces();
   }
 };
+if (import_meta.url === `file://${process.argv[1]}`) {
+  startDashboard().catch(console.error);
+}
 
 // src/cli.ts
-var VERSION = "0.2.2";
+var VERSION = "0.3.1";
 function getLanAddress() {
   const interfaces = os.networkInterfaces();
   for (const name of Object.keys(interfaces)) {

package/dist/cli.js

@@ -1,151 +1,6 @@
 import {
-  DashboardServer
-} from "./chunk-2FTN742J.js";
-
-// src/cli.ts
-import * as fs from "fs";
-import * as os from "os";
-import * as path from "path";
-var VERSION = "0.2.2";
-function getLanAddress() {
-  const interfaces = os.networkInterfaces();
-  for (const name of Object.keys(interfaces)) {
-    for (const iface of interfaces[name] || []) {
-      if (iface.family === "IPv4" && !iface.internal) {
-        return iface.address;
-      }
-    }
-  }
-  return null;
-}
-function printBanner(config, traceCount, stats) {
-  var _a;
-  const lan = getLanAddress();
-  const host = config.host || "localhost";
-  const port = config.port;
-  const isPublic = host === "0.0.0.0";
-  console.log(`
-   ___                    _   _____ _
-  / _ \\  __ _  ___ _ __ | |_|  ___| | _____      __
- | |_| |/ _\` |/ _ \\ '_ \\| __| |_  | |/ _ \\ \\ /\\ / /
- |  _  | (_| |  __/ | | | |_|  _| | | (_) \\ V  V /
- |_| |_|\\__, |\\___|_| |_|\\__|_|   |_|\\___/ \\_/\\_/
-        |___/              dashboard v${VERSION}
-
-  See your agents think.
-
-  \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510              \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510              \u250C\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2510
-  \u2502  \u{1F916} Agents          \u2502  TRACE FILES \u2502  \u{1F4CA} AgentFlow      \u2502  SHOWS YOU   \u2502  \u{1F310} Your browser   \u2502
-  \u2502  Execute tasks,   \u2502 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500> \u2502  Reads traces,    \u2502 \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500> \u2502  Interactive      \u2502
-  \u2502  write JSON       \u2502              \u2502  builds graphs,  \u2502              \u2502  graph, timeline, \u2502
-  \u2502  trace files.     \u2502              \u2502  serves dashboard.\u2502              \u2502  metrics, health. \u2502
-  \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518              \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518              \u2514\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2518
-
-  Runs locally. Your data never leaves your machine.
-
-  Tabs: \u{1F3AF} Graph \xB7 \u23F1\uFE0F  Timeline \xB7 \u{1F4CA} Metrics \xB7 \u{1F6E0}\uFE0F  Process Health \xB7 \u26A0\uFE0F  Errors
-
-  Traces:     ${config.tracesDir}${((_a = config.dataDirs) == null ? void 0 : _a.length) ? "\n  Data dirs:  " + config.dataDirs.join("\n              ") : ""}
-  Loaded:     ${traceCount} traces \xB7 ${stats.totalAgents} agents \xB7 ${stats.totalExecutions} executions
-  Success:    ${stats.globalSuccessRate.toFixed(1)}%${stats.activeAgents > 0 ? ` \xB7 ${stats.activeAgents} active now` : ""}
-  CORS:       ${config.enableCors ? "enabled" : "disabled"}
-  WebSocket:  live updates enabled
-
-  \u2192 http://localhost:${port}${isPublic && lan ? `
-  \u2192 http://${lan}:${port}  (LAN)` : ""}
-`);
-}
-async function startDashboard() {
-  const args = process.argv.slice(2);
-  const config = {
-    port: 3e3,
-    tracesDir: "./traces",
-    host: "localhost",
-    enableCors: false
-  };
-  for (let i = 0; i < args.length; i++) {
-    switch (args[i]) {
-      case "--port":
-      case "-p":
-        config.port = parseInt(args[++i]) || 3e3;
-        break;
-      case "--traces":
-      case "-t":
-        config.tracesDir = args[++i];
-        break;
-      case "--host":
-      case "-h":
-        config.host = args[++i];
-        break;
-      case "--data-dir":
-        if (!config.dataDirs) config.dataDirs = [];
-        config.dataDirs.push(args[++i]);
-        break;
-      case "--cors":
-        config.enableCors = true;
-        break;
-      case "--help":
-        printHelp();
-        process.exit(0);
-    }
-  }
-  const tracesPath = path.resolve(config.tracesDir);
-  if (!fs.existsSync(tracesPath)) {
-    fs.mkdirSync(tracesPath, { recursive: true });
-  }
-  config.tracesDir = tracesPath;
-  console.log("\nStarting AgentFlow Dashboard...\n");
-  const dashboard = new DashboardServer(config);
-  process.on("SIGINT", async () => {
-    console.log("\n\u{1F6D1} Shutting down dashboard...");
-    await dashboard.stop();
-    process.exit(0);
-  });
-  process.on("SIGTERM", async () => {
-    await dashboard.stop();
-    process.exit(0);
-  });
-  try {
-    await dashboard.start();
-    setTimeout(() => {
-      const stats = dashboard.getStats();
-      const traces = dashboard.getTraces();
-      printBanner(config, traces.length, stats);
-    }, 1500);
-  } catch (error) {
-    console.error("\u274C Failed to start dashboard:", error);
-    process.exit(1);
-  }
-}
-function printHelp() {
-  console.log(`
-\u{1F4CA} AgentFlow Dashboard v${VERSION} \u2014 See your agents think.
-
-Usage:
-  agentflow-dashboard [options]
-  npx agentflow-dashboard [options]
-
-Options:
-  -p, --port <number>     Server port (default: 3000)
-  -t, --traces <path>     Traces directory (default: ./traces)
-  -h, --host <address>    Host address (default: localhost)
-  --data-dir <path>       Extra data directory for process discovery (repeatable)
-  --cors                  Enable CORS headers
-  --help                  Show this help message
-
-Examples:
-  agentflow-dashboard --traces ./traces --host 0.0.0.0 --cors
-  agentflow-dashboard -p 8080 -t /var/log/agentflow
-  agentflow-dashboard --traces ./traces --data-dir ./workers --data-dir ./cron
-
-Tabs:
-  \u{1F3AF} Graph            Interactive Cytoscape.js execution graph
-  \u23F1\uFE0F  Timeline          Waterfall view of node durations
-  \u{1F4CA} Metrics           Success rates, durations, node breakdown
-  \u{1F6E0}\uFE0F  Process Health    PID files, systemd, workers, orphans
-  \u26A0\uFE0F  Errors            Failed and hung nodes with metadata
-`);
-}
+  startDashboard
+} from "./chunk-EDHK4NJD.js";
 export {
   startDashboard
 };