hoangsonww / hoangsonww/Claude-Code-Agent-Monitor

Feature: Interactive Session Replay with Timeline Scrubber

Open
#2 0 comments 0 reactions 1 assignee Claimed by @hoangsonww View on GitHub
bug documentation enhancement good first issue help wanted question
Dominant language
TypeScript
Stars
1k
Forks
234
Avg merge
2d 9h
Merged PRs (30d)
18

Description

## Problem
Current views show snapshots and event streams, but there is no way to replay a session state over time. This makes debugging long sessions and explaining behavior transitions harder.

## Proposal
Add a **Session Replay** mode that reconstructs session/agent state from persisted events and lets users scrub through time.

## Scope
- New `Replay` page (or panel on Session Detail)
- Timeline scrubber with play/pause/step controls
- Speed controls (0.5x, 1x, 2x, 5x)
- Deterministic reconstruction of agent/session status from `events`
- Event focus mode (jump to selected event and highlight affected entities)

## UX Requirements
- Keyboard shortcuts: space (play/pause), arrows (step)
- Clearly visible current timestamp + event index
- Sticky mini-map of major lifecycle transitions

## Technical Notes
- Build a replay state engine from ordered events (`created_at`, `id` tie-break)
- Cache computed checkpoints every N events for fast seeking
- Reuse existing status chips/cards for visual consistency

## Acceptance Criteria
- [ ] User can replay any completed session from start to finish
- [ ] Scrubbing to any point updates all visible entities consistently
- [ ] Step-forward/back reflects exact next/previous event impact
- [ ] Replay can handle sessions with 10k+ events without UI lockups
- [ ] Unit tests validate deterministic reconstruction logic

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.