Slice 5: App — Playback UI + Transcript Synchronisation

Owner: App engineer Domain: App Complexity: M Status: 🔧 In Progress Prerequisite: Slice 4 merged

Audio playback with synchronised transcript highlighting.

Core: GET /meetings/{id}/audio-url and GET /meetings/{id}/audio (dev proxy)
App: AudioPlayer component — play/pause, ±10s skip, seek bar, playback speed
App: transcript sync — highlight segment where start_ms ≤ currentTime < end_ms
App: click-to-seek — clicking segment sets audio position
App: display resolved person names on segments
App: auto-scroll — keep active transcript segment in view
App: handle audio URL expiry — re-fetch before expiry
App: regenerate OpenAPI client to include person_id on TranscriptionSegment

Test cases:

Test	Location	Assertion
Audio player renders with controls	`test_app`	Play/pause, skip, speed, and seek bar visible
Transcript highlight syncs with playback	`test_app`	Segment with matching time range has active style
Click-to-seek works	`test_app`	Clicking timestamp sets `audio.currentTime` to segment's `start_ms / 1000`
Auto-scroll follows playback	`test_app`	Active segment scrolled into viewport during playback
Speaker names displayed	`test_app`	Segment with `person_id` shows person name, not speaker label
Full playback flow end-to-end	`test_system`	User opens completed meeting, plays audio, sees synced transcript

App — Playback UI