feat(widget): add opt-in overlay queue ticker (WW-42) - #390
Conversation
Shows the next 3 song requests (title + requester) on the OBS overlay so viewers see their spot in line. New `queue_upcoming` WebSocket broadcast, capped at 3 items and replayed on connect so a Browser Source reload never sits on a stale ticker. - SongRequestQueue.upcoming(limit:): plain prefix read, queue is already fair-share ordered at insert time - WebSocketServerService: queue_upcoming payload/broadcast/send-to-one, joins the existing songRequestQueueChanged trigger in broadcastStreamDeckState() - widget.ts/html/css: independent `?queueTicker=1` panel, off by default so no existing streamer's OBS scene changes on upgrade, themed via existing ThemePreset tokens (no new design-system keys) - Tests: 4 new SongRequestQueueTests, 2 new WebSocketServerIntegrationTests - Docs: widget.mdx, README, features.mdx, CHANGELOG.md + changelog.mdx The ticket's stated "Depends on: WW-37" was stale (WW-37 has zero code in the repo); confirmed unblocked and built directly. Also files Jira comments on WW-45/WW-42/WW-51 flagging a stale "blocked by WW-36" link and the WW-37 dependency claim above (no repo changes for that half, WW-51 is Jira hygiene only). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
|
Warning Review limit reached
Next review available in: 52 minutes You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (4)
WalkthroughThe change adds an opt-in queue ticker overlay. The native service publishes up to three upcoming requests through WebSocket snapshots. The widget renders titles and requesters with theme-aware styling, empty-state handling, escaping, and reduced-motion support. ChangesQueue ticker overlay
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant SongRequestQueue
participant AppDelegate
participant WebSocketServerService
participant Widget
SongRequestQueue->>AppDelegate: Return upcoming requests
AppDelegate->>WebSocketServerService: Broadcast queue snapshot
WebSocketServerService->>Widget: Send queue_upcoming
Widget->>Widget: Render themed ticker
Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches 💡 1📝 Generate docstrings 💡
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@apps/docs/content/docs/widget.mdx`:
- Around line 140-145: Update the widget URL guidance in the documented
queueTicker examples to distinguish URLs without query parameters, which require
?queueTicker=1, from URLs that already contain parameters such as ?token=...,
which require &queueTicker=1. Ensure neither form produces an invalid URL or
duplicate query separator.
In `@apps/widget/src/widget.css`:
- Around line 154-157: Update the `#queue-ticker.hidden` rule to set display:
block so its opacity transition remains active while hidden, preserving the
existing opacity and pointer-events behavior. Then regenerate the committed
widget artifact with the project’s widget build command and include the updated
widget.html.
In `@apps/widget/src/widget.ts`:
- Around line 98-100: Update the queueTickerEnabled initialization in widget.ts
to enable the ticker only when the queueTicker parameter’s value is exactly the
documented "1"; keep it disabled for missing, empty, zero, false, and other
values.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: c6784120-f516-4c93-8f0b-b6a037f86da4
📒 Files selected for processing (15)
CHANGELOG.mdREADME.mdapps/docs/content/docs/changelog.mdxapps/docs/content/docs/features.mdxapps/docs/content/docs/widget.mdxapps/native/WolfWave/Core/AppConstants.swiftapps/native/WolfWave/Core/AppDelegate+StreamDeck.swiftapps/native/WolfWave/Resources/widget.htmlapps/native/WolfWave/Services/SongRequest/SongRequestQueue.swiftapps/native/WolfWave/Services/WebSocket/WebSocketServerService.swiftapps/native/WolfWaveTests/SongRequestQueueTests.swiftapps/native/WolfWaveTests/WebSocketServerIntegrationTests.swiftapps/widget/src/widget.cssapps/widget/src/widget.htmlapps/widget/src/widget.ts
- widget.ts: require exact ?queueTicker=1, not just key presence
(=0/=false/bare param would have wrongly enabled it)
- widget.css: #queue-ticker.hidden now sets display:block, overriding
Tailwind's .hidden{display:none} so the 400ms opacity fade can
actually animate instead of snapping invisible
- widget.mdx: correct the query-separator guidance (?queueTicker=1 on
a bare URL, &queueTicker=1 only when a param like ?token= already
exists) - the loopback widget URL has no query string by default,
so the old &-only wording was wrong for the common case
Rebuilt and committed widget.html. bunx tsc --noEmit clean.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Summary
?queueTicker=1overlay panel showing the next 3 song requests (title + requester), off by default so no existing streamer's OBS Browser Source changes on upgradequeue_upcomingWebSocket broadcast (WebSocketServerService), capped at 3 items, replayed on connectSongRequestQueue.upcoming(limit:): prefix read of the already fair-share-ordered queueThemePresettokens (no new design-system keys needed)Jira
Test plan
SongRequestQueueTests— 4 new tests (empty/cap/default-limit/fair-share-order)WebSocketServerIntegrationTests— 2 new tests (snapshot replay on connect, default-empty-array)bunx tsc --noEmitclean onapps/widgetbun run --filter widget build— regeneratedwidget.htmlcommitted, diff is clean (only the changed inline CSS/JS lines + new HTML block)?queueTicker=1renders rows + empty state correctly across themes ("Default", "Glass"), no console errors🤖 Generated with Claude Code
Summary by CodeRabbit
New Features
?queueTicker=1to display up to three upcoming song requests, including titles and requesters.Documentation