fix(web): stop status animations when Reduce Motion is enabled

[saphid]

Problem

With the system's Reduce Motion setting on, some status indicators still animate forever: the working and waiting dots in thread rows, the project status dot in the legacy sidebar, the reconnecting halo on the connection dot, the chat header's waiting dot, and the preview tab's error dot. Other indicators in ThreadStatusIndicators.tsx already use motion-safe:animate-status-pulse, so the setting is only honored in some places.

Change

Added motion-safe: to the 6 remaining animate-status-pulse / animate-status-ping call sites, matching the existing guarded indicators. With Reduce Motion on, the dots stay visible but static. Nothing changes for other users.

Scope and approval

A small, focused accessibility fix (6 class names in 5 files), so it uses the no-prior-issue exception.

Verification

• Compiled the real index.css with the installed Tailwind and rendered every status indicator's classes in the T3 browser panel, forcing the reduced-motion media branch through CSSOM (the panel cannot toggle the OS setting). On main, 7 of 9 indicators keep running animations; with this change, 0 of 9. With no preference, all 9 still animate at 2s infinite on both revisions (assertions, call-site audit).
• vp test run for ThreadStatusIndicators.test.ts and ServerUpdateAction.test.tsx: 81 passed. vp lint on touched files and apps/web typecheck: clean.
• Independent review by Claude Opus 5.5 (high) through a T3 delegated task: no defects. It noted that the connection halo becomes static under Reduce Motion, which is the intended result.
• After merging main: fix: update all no longer runs agents twice or loses background work #19291 removed the server update dot's pulse, so this PR no longer touches ServerUpdateAction.tsx. No other unguarded animate-status-* use is left on main (AgentBrowserCursor already has motion-reduce:animate-none).
• No before/after images: the change only affects motion. Not run in Electron or on mobile browsers.

Found by a GPT-6.1 Sol (high) audit and implemented by GPT-6.1 Sol (medium) in T3 Code. Reviewed by Claude Opus 5.5. Coordinated by Claude Opus 5.5 in Claude Code via T3 Code. Agent-authored, sponsored by Alex Southwell.

🤖 Generated with Claude Code

[macroscopeapp]

Approvability

Verdict: Approved at b7e8f9d

Macroscope's review found this PR approvable — This is a focused accessibility fix that disables only status-indicator animations when reduced motion is enabled, while preserving all status content and normal-motion behavior. The five-file change is small, self-contained, and introduces no API, schema, deployment, or sensitive-code impact.

^{You can add or adjust custom eligibility rules. Learn more.}

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: Path: .coderabbit.config.ts
• Review profile: CHILL
• Plan: Advanced
• Run ID: fc20df55-1fbf-4a1c-b49e-58b9c01e74bf

📥 Commits

Reviewing files that changed from the base of the PR and between 5b8f2c1 and b7e8f9d.

📒 Files selected for processing: 2

• apps/web/src/components/ChatView.tsx
• apps/web/src/components/LegacySidebar.tsx

🚧 Files skipped from review as they are similar to previous changes: 1

• apps/web/src/components/ChatView.tsx

Included review availability: This review used your included allowance. Your plan provides up to 10 included reviews per hour; 9 remain after this review.

📝 Walkthrough

Five web components now use motion-safe variants for status and activity animations.

Changes: Motion-safe status animations

Layer / File(s)	Summary
Gate indicator animations by motion preference apps/web/src/components/ChatView.tsx, apps/web/src/components/ConnectionStatusDot.tsx, apps/web/src/components/LegacySidebar.tsx, apps/web/src/components/ThreadStatusIndicators.tsx, apps/web/src/components/preview/PreviewChromeRow.tsx	Waiting, connection, project, thread, and recording indicators now use motion-safe animation classes.

Priority: ➖ Normal

Estimated code review effort: 1 (Trivial) | ~4 minutes

Change: Bug fix

Suggested reviewers: juliusmarminge

Merge Risk: ⚪ Minimal · up to b7e8f

Status indicators retain their animations for users who allow motion and suppress them for users who prefer reduced motion. No material merge risk was identified.

Pre-merge checks: 4

Passed checks: 4 passed

Check name	Status	Explanation
Linked Issues check		Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check		Check skipped because no linked issues were found for this pull request.
Title check		The title clearly and concisely describes the main change: disabling status animations when Reduce Motion is enabled.
Description check		The description includes all required sections, explains the problem and implementation, justifies the scope exception, documents focused verification and limitations, and identifies agent use. The la…

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

_{Comment @coderabbitai help to get the list of available commands.}

Dismissing prior approval to re-evaluate b7e8f9d

[juliusmarminge]

Taking over this one. I’ll reduce the tests to the useful coverage, update the implementation against current main, and verify it before publishing the changes.

[juliusmarminge]

Post-merge visual verification on main (b874ff6): PASS, with Reduce Motion on, the Working status dot is static on main and still pulses on the parent.

Setup: a live Working thread shown in the legacy sidebar, viewed in headless Chromium with reducedMotion: 'reduce'. Frames are 400ms apart; opacity and running animations were read from the dot.

• Before (parent 5bed8e4): animation-name: status-pulse, 1 running animation, opacity goes 1 → 0.5 → 0.5 → 0.92.
• After (main): animation-name: none, 0 running animations, opacity stays at 1.
• Control (main, no preference): still pulses.

• Before recording (reduce): https://gh-file-drop-api-prod-mi5fy3sowv63ufte.pinglabs.workers.dev/f/193af7e4710d9539/18814-before-parent-reduce.webm
• After recording (reduce): https://gh-file-drop-api-prod-mi5fy3sowv63ufte.pinglabs.workers.dev/f/893b261d9197a2c4/18814-after-main-reduce.webm

Only the legacy-sidebar thread dot was exercised. The connection halo, chat header waiting dot, and preview recording dot were not driven.