Analytics Dashboard (Phase 1 + Phase 2):
- Replace 8663-line vanilla JS monolith with Astro static build
- New bento-grid layout with Geist design system (dark/light themes)
- ECharts (offline, tree-shaken) replaces Chart.js CDN dependency
- React island with KPI cards, token timeline, activity heatmap, agent BarList
- WebSocket client with reconnect backoff; polling fallback when WS disconnects
- API client with 30s cache; normalizes backend field names (inputTokens→totalInput)
- Build source in analytics-ui/, output committed to src/analytics-web/
- Fix: /api/activity now uses in-memory cache (was re-scanning all files on each request)
- Fix: remove duplicate /api/agents route (dead code since Express uses first match)
- Fix: /api/data and /api/fast-update no longer mutate this.data.conversations in place
TUI Modernization:
- Add src/tui.js with @clack/prompts-powered banner and helpers
- Replace inline showBanner() in bin/create-claude-config.js with tui.showBanner()
- Migrate showMainMenu() in src/index.js to @clack select() (replaces inquirer)
- Add @clack/prompts ^1.5.1 and gradient-string ^2.0.2 to dependencies
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
- Gource-style 3-layer circular visualization (models/tools/components)
- Interactive tooltips with usage counts for all node types
- Real-time legend panels: Models Used, Tools Used, Components Used
- Multiple animated beams based on actual tool call counts
- Backend uses totalToolCalls for accurate activity metrics
- Optimized performance (~100ms for 86 conversations)
Technical Details:
- Center layer: Model pie chart with usage-based sizing
- Middle layer (250px): Tools with count badges
- Outer layer (400px): Commands, Skills, MCPs, Subagents
- YearInReview2025 backend analyzes conversations without overhead
- Tooltip system detects hover on pie slices, circles, and outer nodes
- Frontend processes toolCounts and modelCounts for precise visualization
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Update local settings and configurations
- Add Vertex AI Claude Code integration blog post
- Sync analytics components and documentation
- Remove test data files and update configurations
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Introduced AgentAnalyzer class to analyze agent invocation data, usage frequency, and workflow patterns.
- Implemented endpoint for agent usage analytics in ClaudeAnalytics.
- Enhanced session management to account for scheduled reset times instead of fixed durations.
- Updated SessionAnalyzer to reflect new session reset logic and improved warning messages.
- Added functionality to calculate agent efficiency and popular usage hours.
- Created a .nojekyll file for GitHub Pages deployment in Docusaurus configuration.
- Added a new SVG file `undraw_docusaurus_tree.svg` to the static images directory for enhanced visual representation.
- Introduced a new TypeScript configuration file `tsconfig.json` to improve editor experience and project structure.
* feat: Enhance DataService with paginated conversations and improved error handling
- Added `getConversationsPaginated` method to fetch conversations with pagination support.
- Improved error handling in `cachedFetch` to provide clearer messages and fallback behavior.
- Updated WebSocket integration to handle connection failures with fallback polling.
- Reduced WebSocket auto-reconnect attempts and disabled auto-reconnect to minimize console noise.
- Added CORS middleware to the web server for better API accessibility.
- Implemented paginated conversations endpoint in the server.
- Added conversation messages endpoint to retrieve messages for a specific conversation.
- Enhanced conversation analysis to include detailed session data and compatibility with original dashboard.
* feat: Implement real-time conversation change handling and notifications
- Added handleConversationChange method to ClaudeAnalytics for processing updates to conversation files.
- Integrated WebSocket notifications for new messages in conversations.
- Enhanced setupFileWatchers to include conversation change callbacks.
- Updated conversation state API to calculate states for all conversations, improving performance and accuracy.
- Introduced pagination for conversation messages endpoint to support large message sets.
- Implemented cache management endpoint for clearing specific cache types.
- Enhanced DataCache and ConversationAnalyzer to support tool correlation in message parsing.
- Created ToolDisplay component for safe rendering of tool uses and results in the analytics dashboard.
- Added comprehensive documentation for Claude data structures and formats.
* feat: Enhance real-time messaging and dashboard features
- Improved logging for new messages in DataService to include message data.
- Increased WebSocket reconnection attempts for better reliability.
- Enabled auto-reconnect in WebSocketService for real-time updates.
- Updated conversation change handling in ClaudeAnalytics to include file path.
- Enhanced error handling and logging in ConversationAnalyzer and DataCache.
- Added new settings file for local permissions.
- Introduced a new Chats Dashboard option in the main menu.
- Created detailed architecture documentation for the analytics web application.
- Deprecated old main.js and Dashboard.js files in favor of a modular structure.
* feat: Implement real-time message handling and improve logging in DataService and AgentsPage
* feat: Implement comprehensive conversation state detection improvements
- Enhanced frontend message analysis for tool execution and content analysis.
- Introduced file activity detection to accurately identify user typing.
- Adopted a WebSocket-first approach for real-time state updates.
- Expanded state vocabulary with new contextual states and visual indicators.
- Improved state banner display with new CSS classes.
- Integrated system components for cohesive state management.
- Added health check feature to validate system requirements and configurations.
- Developed ConsoleBridge for web-based interaction with Claude Code processes.
- Created test script for ConsoleBridge to facilitate integration testing.
- Add automatic DataCache cleanup with 30-second intervals
- Implement size limit enforcement to prevent memory buildup
- Increase memory threshold to 300MB for realistic analytics usage
- Add Claude session tracking integration throughout dashboard
- Fix message counting to respect actual Claude session windows
- Stabilize conversation state transitions with extended time intervals
- Add comprehensive token breakdown with cache tokens
- Implement Claude session popover with hover functionality
- Fix table layout stability with fixed column widths
- Reduce cache size limits from 1000 to 100 entries
- Add proper cleanup methods for graceful shutdown
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Fix token calculation discrepancy by including cache tokens in main dashboard
- Add detailed token breakdown popover with hover functionality
- Improve conversation history loading with comprehensive message metadata
- Fix message coloring logic using JSON metadata instead of content parsing
- Add version number integration to dashboard
- Enhance SessionTimer with info icon and message calculation tooltip
- Move notifications button to filter row for better UX
- Add comprehensive token usage tracking (input, output, cache creation, cache read)
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Implement comprehensive unit tests for StateCalculator to validate conversation status detection and state management.
- Create unit tests for StateService covering state management, subscriber notifications, and error handling.
- Develop unit tests for WebSocketServer to ensure proper handling of WebSocket connections, message broadcasting, and heartbeat mechanisms.
- Include edge case handling and validation for all components to enhance robustness and reliability.
- Implement 500ms refresh rate for near real-time updates
- Add 250ms fast refresh for first 30 seconds for instant state changes
- Prioritize conversation flow over file timestamps for immediate response detection
- Improve "Claude Code working..." detection to trigger instantly when user sends message
- Extend file activity detection window to 15 seconds for better accuracy
- Create dedicated npm README for better package discoverability
- Update root README to highlight new notification and state detection features
- Remove debug console logs for cleaner production experience
Performance improvements result in near-instantaneous state change detection.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Implement real-time conversation state updates with 1-second refresh
- Add precise state detection: "Claude Code working...", "User typing...", "Awaiting user input..."
- Separate refresh logic: manual for charts, automatic for conversation data
- Integrate active process detection for accurate state determination
- Improve notification system for awaiting user input states
- Remove emojis from notification titles and refresh buttons for cleaner interface
- Optimize performance by only refreshing conversation data, not charts
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Remove emojis from notification and refresh buttons
- Clean, professional button text appearance
- Maintain all functionality while improving visual clarity
- Better accessibility and readability
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Implement browser notification API integration
- Add notification button to enable/disable alerts
- Detect conversation state changes (Awaiting user input...)
- Send notifications when Claude is waiting for user response
- Include clickable notifications that focus the conversation
- Auto-close notifications after 10 seconds
- Visual button states (enabled/disabled/denied)
- Test notification on first enable
- Improve productivity by alerting users when Claude needs input
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Refine conversation status detection to reduce false positives
- Filter out system processes and orphan process noise
- Balance active conversation detection for better accuracy
- Only show truly active conversations in dashboard
- Remove orphan process detection to reduce UI clutter
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Bump version in package.json from 1.5.12 to 1.5.14.
- Add CSS styles for improved layout and status indicators in the web dashboard.
- Introduce a new message type indicator for user and assistant messages with tooltips.
- Implement logic to determine message types (success, error, tool execution, pending) based on message content.
- Refactor message rendering to include message type indicators.
- Updated onboarding prompts to include an option for launching the Claude Code Analytics Dashboard.
- Modified the createClaudeConfig function to handle the analytics option and initiate the dashboard if selected by the user.
daniel