refactor(web): timeline work group and live activity rows live in their own file#22675
Part of the MessagesTimeline split. This layer moves the work group section, its toggle and header, the live work-entry, thinking and working rows, and the working timer into TimelineWorkGroupRows.tsx. The timer formatting helpers go to TimelineWorkGroupRows.logic.ts.
| File | Before | After |
|---|---|---|
| MessagesTimeline.tsx | 4,279 | 3,653 |
| TimelineWorkGroupRows.tsx | – | 640 |
Measurements
Dev app on a seeded copy of real data, median of 3, React renders counted by the commit-root counter (only fibers React actually rendered). "Before" is main at 6a6c84f990; "after" is the top of this stack. Nested update peak comes from a probe in react-dom's getRootForUpdatedFiber.
| Interaction | Before: commits / renders / timeline renders / nested peak | After |
|---|---|---|
| Scroll an 8.5k-item thread up 40 × 150px | 43 / 1,656 / 70 / 0 | 44 / 1,670 / 70 / 0 |
| Load earlier turns, then scroll up 60 × 300px | 107 / 5,316 / 356 / 0 | 104 / 5,275 / 356 / 0 |
| Agent streams a 20-line reply (561-item thread) | 63 / 3,092 / 164 / 1 | 55 / 2,728 / 139 / 0 |
The extractions keep every component, context, and hook boundary unchanged, so render counts match within run-to-run noise. Streaming numbers vary with reply length. The win is readability: each row family is now a file you can read on its own, and the React Compiler caches each one independently. The legend-list wiring is unchanged. That covers getItemType with its length buckets (#21269), TimelineRowCtx inside renderItem with extraData carrying sharedState (#21123), and scroll restore. No update loops appeared while loading earlier turns.
Tests
vp test runMessagesTimeline logic, active-tools, and browser tests, plustimelineScrollAnchoringreactCompilerCoveragefor every touched and new file (0 bailouts)tsc-rs --noEmitfor apps/web,vp linton changed files
🤖 Generated with Claude Code
Checks
- SuccessfulCodeRabbitGitHub
Review completed
- Successful
Skipped - Not affected
- Skipped
- Skipped
- Skipped
- SuccessfulRemove preview downloadGitHub
- Skipped
- SuccessfulLabel PR sizeGitHub
- SuccessfulLabel PR 22675GitHub
- Successful
- Successful
- Successful
- SuccessfulPrepare PR size configGitHub
- SuccessfulCollect PR targetsGitHub
- Successful
- SuccessfulCheckGitHub
- SkippedRustGitHub
- SkippedRelease SmokeGitHub
- Skipped
- SuccessfulBuild and TypecheckGitHub
- SuccessfulTestGitHub
- SuccessfulTest WebGitHub
- Skipped
- SuccessfulLabel PR sizeGitHub
- SuccessfulLabel PR 22675GitHub
- SuccessfulCollect PR targetsGitHub
- SuccessfulPrepare PR size configGitHub
- SkippedEAS PreviewGitHub
- SuccessfulNative fingerprint diffGitHub
- SuccessfulTest Server 8GitHub
- SuccessfulTest Server 1GitHub
- SuccessfulTest Server 5GitHub
- SuccessfulTest Server 4GitHub
- SuccessfulTest Server 7GitHub
- SuccessfulTest Server 2GitHub
- SuccessfulLintGitHub
- SuccessfulTest Server 3GitHub
- SuccessfulTest Server 6GitHub
- SuccessfulChangesGitHub
Added 1 commit
- refactor(web): timeline work group and live activity rows live in their own file46d59b6
Approvability
Verdict: Approved at 46d59b6
Macroscope's review found this PR approvable — This is a mechanical extraction of existing timeline work-group and live-activity row code into dedicated files, with equivalent imports and unchanged runtime logic. It introduces no new capability, configuration change, or production-side effect.
You can add or adjust custom eligibility rules. Learn more.
No actionable comments were generated in the recent review. 🎉
ℹ️ Recent review info
⚙️ Run configuration
- Configuration used: Path: .coderabbit.config.ts
- Review profile: CHILL
- Plan: Team
- Run ID:
99359e93-e4f3-444a-8d39-df3bfb43b0ab
📥 Commits
Reviewing files that changed from the base of the PR and between 39d56c9f958192fdbf6fcc33cb3f0ec31832497c and 46d59b6f6d681ffa224ea455145fb9e0ee7356f7.
📒 Files selected for processing: 3
apps/web/src/components/chat/MessagesTimeline.tsxapps/web/src/components/chat/TimelineWorkGroupRows.logic.tsapps/web/src/components/chat/TimelineWorkGroupRows.tsx
Limit details: You’ve used all 10 included reviews currently available.
📝 Walkthrough
Work-group timeline rendering moved from
MessagesTimeline.tsxinto dedicated components. The extracted components render work-group entries, working and thinking states, and expanded groups. A utility formats elapsed working time.Changes: Timeline work-group rendering
Layer / File(s) Summary Working and activity rows
apps/web/src/components/chat/TimelineWorkGroupRows.logic.ts,apps/web/src/components/chat/TimelineWorkGroupRows.tsxAdded working-time formatting and components for working, thinking, and live activity rows, including worktree setup progress and failure presentation. Work-group composition and expansion
apps/web/src/components/chat/TimelineWorkGroupRows.tsxAdded work-group rendering, virtualized expanded entries, scroll-anchor handling, and group controls. MessagesTimeline integration
apps/web/src/components/chat/MessagesTimeline.tsxImported the extracted components and removed the local work-log implementations and related imports. Priority: ⬇️ Low
Estimated code review effort: 4 (Complex) | ~45 minutes
Change: Refactor
Merge Risk: ⚪ Minimal · up to 46d59
This refactor moves the work-group and live activity row components into their own file without intended behavior changes. No actionable merge-blocking risk was identified.
Pre-merge checks: Passed 3 · Failed 1
Failed Failed checks: 1 warning
Check name Status Explanation Resolution Description check Warning The description explains the refactor and includes detailed verification results, but it omits the required Problem and Scope and approval sections. It also does not provide the required before/after … Add a Problem section with the expected behavior and context. Add the triaged issue or maintainer approval and scope rationale. Add before/after screenshots, or explicitly justify why visual evidence is not applicable for this refactor. Passed Passed checks: 3 passed
Check name Status Explanation Title check Passed The title clearly and concisely describes the main refactor: moving timeline work-group and live activity rows into a separate file. Linked Issues check Passed Check skipped because no linked issues were found for this pull request. Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.
Full details: Description check
Explanation
The description explains the refactor and includes detailed verification results, but it omits the required Problem and Scope and approval sections. It also does not provide the required before/after UI evidence or explain why screenshots are not applicable.
Resolution
Add a Problem section with the expected behavior and context. Add the triaged issue or maintainer approval and scope rationale. Add before/after screenshots, or explicitly justify why visual evidence is not applicable for this refactor.
✨ Finishing Touches
📝 Generate docstrings
- Commit to this branch
- Create a new PR
🧪 Generate unit tests (beta)
- Commit to this branch
- Create a new PR
- Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts
Usage-based review receipt
- Mode: Continue automatically
- Reviewed files: 3
- Charged: $0.75
- View usage details
Note
This review was completed with usage-based billing: files reviewed beyond your plan's included limits are billed at $0.25/file. View usage-based billing.
Comment @coderabbitai help to get the list of available commands.