skills.rest
robdtaylor
robdtaylorCOMMUNITY
Explore all skills by this author →
𝕏@largelumoxGitHub

AgentObservability

Stream Claude Code agent session events to a WebSocket dashboard.

Updated Aug 27, 2026
Search Tags:#hooks#Claude Code#dashboard#observability#WebSocket#JSONL
One-click install
npx skills add https://github.com/robdtaylor/personal-ai-infrastructure --skill agentobservability
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: AgentObservability
Source: https://github.com/robdtaylor/personal-ai-infrastructure/tree/main/skills/AgentObservability
Command: npx skills add https://github.com/robdtaylor/personal-ai-infrastructure --skill agentobservability

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Real-time observability of Claude Code agent sessions, enabling immediate visibility into multi-agent interactions, tool usage, and session flows via a lightweight, filesystem-backed dashboard.

Core Features & Use Cases

  • Real-time event streaming via WebSocket to a dashboard.
  • Agent swim lanes and parallel subagent visualization for debugging complex workflows.
  • Event filtering by agent, session, or event type; live charts for tool usage patterns.
  • Filesystem-based storage (JSONL) with low overhead and offline capability.
  • Use Case: Monitor concurrent Claude Code sessions across multiple agents during a complex task, then identify bottlenecks or misrouted subagents.

Quick Start

  1. Install Bun and ensure Claude Code is configured with hooks.
  2. Set PAI_DIR environment variable to your Claude directory.
  3. Create directories for history and logs, copy settings.json, and install dependencies for server and client.
  4. Start the server and client, then open http://localhost:5173 to view the dashboard.

Frequently Asked Questions about AgentObservability

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I monitor real-time Claude Code agent sessions and visualize tool usage?▼

You can monitor real-time Claude Code agent sessions by streaming events via a WebSocket to a dashboard. This provides live charts for tool usage patterns and agent swim lanes to visualize parallel subagents.

What is the best way to debug complex multi-agent workflows in Claude Code?▼

Debugging complex multi-agent workflows involves using a real-time observability dashboard that visualizes parallel subagent activity and session flows. It filters events by agent or session to identify bottlenecks or misrouted subagents.

How do I set up real-time observability hooks for Claude Code?▼

To set up observability hooks for Claude Code, install Bun, set the PAI_DIR environment variable, and configure settings.json. This establishes a filesystem-based event pipeline using JSONL and a WebSocket stream to feed the dashboard.

Does Claude Code observability support offline event storage?▼

Yes, Claude Code observability supports offline capability through filesystem-based storage using JSONL files. This approach ensures low overhead while retaining event history for concurrent agent sessions.

Can I track multiple concurrent Claude Code sessions across different agents?▼

Yes, you can track multiple concurrent Claude Code sessions across different agents. The dashboard provides agent swim lanes and event filtering to monitor parallel subagent interactions during complex tasks.

Why do I need Bun and PAI_DIR configured for Claude Code observability?▼

Bun and PAI_DIR are required because the observability pipeline relies on Bun to run the server and client, while PAI_DIR points to your Claude directory for filesystem-based JSONL event storage and WebSocket streaming.

Related Skills

Explore More Software Engineering Skills→
rafaelcallejarafaelcalleja
2

agent-observability

Stream Claude Code agent events to a filesystem-based observability dashboard.

Community
Advanced
andrewblockernstandrewblockernst

github-release-management

Automate GitHub release orchestration with AI swarms for versioning, testing, deployment, and rollback.

Community
Advanced
zmrezmre
1

agent-observability

Visualize Claude Code agent interactions from JSONL logs via WebSocket streaming.

Community
Advanced
ZpankzZpankz
7

agent-observability

Collect and visualize Claude Code agent hook events via a WebSocket dashboard.

Community
Advanced