feat: Claude Code Monitor — lanes, pipelines and a merged workspace
Internal SmartGift build of a Claude Code monitoring dashboard. Lanes: a durable unit of parallel agent work, one per working directory, tracked across session restarts. Managed lanes are git worktrees the dashboard provisions and can reset or remove behind a three-check destroy guard and a counted preflight; adopted lanes are directories you already own and are never destroyable. Pipelines: a lane moves through pipeline stages. A stage the agent declares with evidence renders green; a stage inferred from the tool-event stream renders dashed amber and never counts as done. Detection is forward-only within a 30-minute window, and never writes the declared stage. Workspace: one page at /run with a lane grid, the selected lane's pipeline, and a full Claude console behind a disclosure.
This commit is contained in:
@@ -0,0 +1,79 @@
|
||||
# Claude Code Agent Monitor for VS Code
|
||||
|
||||
**Claude Code Agent Monitor** brings a high-fidelity, real-time dashboard for your Claude Code AI sessions directly into your VS Code workspace. Monitor token usage, track agent health, and view deep analytics without switching windows.
|
||||
|
||||

|
||||
|
||||
---
|
||||
|
||||
## 🚀 Key Features
|
||||
|
||||
### 📊 Integrated Dashboard
|
||||
Open the full agent monitoring dashboard in a dedicated VS Code tab. Supports real-time updates via WebSockets and local-first data storage.
|
||||
|
||||
### 🩺 Live Agent Health
|
||||
Track all 5 agent states in your sidebar with color-coded status indicators:
|
||||
- **Working**: Active subagents currently processing tasks.
|
||||
- **Connected**: Agents initialized and ready.
|
||||
- **Idle**: Standby agents.
|
||||
- **Completed**: Successfully finished tasks.
|
||||
- **Error/Failed**: Instantly spot where things went wrong.
|
||||
|
||||
### 📈 Usage & Analytics
|
||||
- **Token Tracking**: Real-time display of Billions (B) or Millions (M) of tokens consumed.
|
||||
- **Cost Calculation**: Live estimate of total USD cost based on current model pricing.
|
||||
- **Event Frequency**: High-signal stats on events per session and subagent spawning.
|
||||
|
||||
### 🧭 Deep Navigation
|
||||
Jump directly to specific views from the sidebar:
|
||||
- **Main Dashboard**: Global overview.
|
||||
- **Analytics Hub**: Deep dives into model performance.
|
||||
- **Agent Board**: Kanban-style view of subagent progress.
|
||||
- **Recent Sessions**: One-click access to your last 10 Claude sessions.
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ Getting Started
|
||||
|
||||
### 1. Requirements
|
||||
Ensure you have the Claude Code Agent Monitor server running locally:
|
||||
```bash
|
||||
npm install
|
||||
npm run dev
|
||||
```
|
||||
|
||||
### 2. Installation
|
||||
- Search for **"Claude Code Agent Monitor"** in the VS Code Marketplace.
|
||||
- Click **Install**.
|
||||
|
||||
### 3. Usage
|
||||
- Click the **Radar/Dashboard icon** in the Activity Bar.
|
||||
- The extension automatically detects your local server on ports **5173** (dev) or **4820** (prod).
|
||||
- Use the **Refresh** button in the sidebar to manually force an update.
|
||||
|
||||
---
|
||||
|
||||
## 📦 Publishing & Development
|
||||
|
||||
To generate a `.vsix` file for manual installation or marketplace upload:
|
||||
|
||||
1. Install `vsce` globally:
|
||||
```bash
|
||||
npm install -g @vscode/vsce
|
||||
```
|
||||
2. Navigate to the extension folder:
|
||||
```bash
|
||||
cd vscode-extension
|
||||
```
|
||||
3. Run the package command:
|
||||
```bash
|
||||
vsce package
|
||||
```
|
||||
*This will generate `claude-code-agent-monitor-1.0.0.vsix`.*
|
||||
|
||||
---
|
||||
|
||||
## 📜 License
|
||||
Internal SmartGift build — all rights reserved.
|
||||
|
||||
Developed with ❤️ for the AI Engineer community.
|
||||
Reference in New Issue
Block a user