Dev: notification types, update UX, contact/event fixes, single scrollbar, UX v2 doc#9
Merged
jerryagenyi merged 6 commits intomainfrom Feb 2, 2026
Merged
Dev: notification types, update UX, contact/event fixes, single scrollbar, UX v2 doc#9jerryagenyi merged 6 commits intomainfrom
jerryagenyi merged 6 commits intomainfrom
Conversation
…ls S1/S2/S3, sortable streams
- Add 10s timeout to play proxy to prevent hanging on Icecast issues - Wrap upstream.resume() in try/catch for error resilience - Add res.headersSent guard to prevent double responses - Deduplicate streamIds in setStreamOrder() to prevent duplicates Follow-up to deep review feedback.
…llbar, UX v2 doc - Notification types: simple modal for duplicate name/source; full error UX for real failures - Update UX: bell icon, auto-check on load, modal on click; single header-update-bell-btn - Contact/Event: preserve each other when saving; remove collapsible; contact validate on entry - Layout: remove size-full/flex-1 so one plain page scroll (no inner scrollbar) - Stream labels: S1 - name (hyphen not em dash) - docs: UI-UX-RECOMMENDATIONS-v2.md (glassmorphism); TODO updates
📝 WalkthroughWalkthroughThis PR adds per-field contact validation and persistence, removes collapsible event/contact UI, introduces duplicate-stream detection with a simple modal in FFmpegStreamsManager, and changes update notification UX to a header bell with badge and modal behaviour. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
participant User as "User (UI)"
participant Header as "HeaderComponent"
participant Streams as "FFmpegStreamsManager"
participant API as "Server / FFmpeg API"
participant Modal as "Duplicate Modal"
User->>Header: Click start/start-all/update action
Header->>Streams: invoke start/update flow
Streams->>API: Send start/update request
API-->>Streams: Respond with error (duplicate)
Streams->>Streams: isDuplicateError(message) -> true
Streams->>Modal: showDuplicateModal(title,message)
Modal-->>User: Display duplicate modal (simple)
Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
🧪 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
public/components/HeaderComponent.js (1)
225-257:⚠️ Potential issue | 🟠 MajorFix undefined
originalContentin the update-check flow.
originalContentis referenced infinallybut never defined, which throws and can leave the button disabled when no update is found.🐛 Suggested fix
- // Show loading state + const originalContent = bellBtn.innerHTML; + // Show loading state bellBtn.innerHTML = ` <span class="material-symbols-rounded text-sm animate-spin">refresh</span> `; bellBtn.disabled = true;
🤖 Fix all issues with AI agents
In `@public/components/ContactManager.js`:
- Around line 102-106: The contact-save payload is overwriting potentially newer
event fields (eventTitle, eventSubtitle, eventImage, aboutDescription); before
building the payload in ContactManager.js (where those fields are set), refresh
or re-read the latest event data from the shared EventManager/state (or fetch
the current event record) and merge those values with the contact form values so
you only send updated contact fields and preserve any newer event edits; update
every payload-construction site (the occurrences around lines 102-106, 231-244,
269-274) to pull the canonical event fields first (e.g., via the EventManager
getter or current props/state) and merge rather than blindly overwriting.
In `@public/components/FFmpegStreamsManager.js`:
- Around line 55-91: The modal creation in showDuplicateModal uses global IDs
('duplicate-modal-message' and 'duplicate-modal-ok') which can collide if
multiple modals exist; fix by replacing those document-level ID references with
scoped queries on the modal (use modal.querySelector('[data-duplicate-message]')
and modal.querySelector('[data-duplicate-ok]') or set unique data- attributes on
the created elements) and attach listeners to those scoped elements (e.g., bind
the OK click to the scoped ok element and use modal.querySelector to find the
message element before setting textContent), leaving isDuplicateError unchanged.
In `@TODO.md`:
- Line 45: Update the TODO checklist text that currently reads "Event Details &
Your Contcact components — Not working as should. details not saving for
contact. event details collapsible doesnt open after saving details." by
correcting the typos: change "Contcact" to "Contact" and "doesnt" to "doesn't",
and normalize casing/punctuation so it reads clearly (e.g., "Event Details &
Your Contact components — not working as they should; details not saving for
contact, and the event details collapsible doesn't open after saving details.").
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Fix all issues with AI agents
In `@TODO.md`:
- Line 41: The checklist line for "Contact: WhatsApp" is marked complete but
states "Not working"; update the TODO entry by either unchecking that item or
splitting it into two lines: keep a checked "Contact: WhatsApp — initial
implementation" and add a new unchecked follow-up like "Contact: WhatsApp — fix
validation/wa.me builder (not working)". Ensure the placeholder text and
requirements (digits 10–15, no leading zero, backend validation, ContactManager,
wa.me/<digits>) are preserved in the new lines so reviewers can track what's
implemented vs what still needs fixing.
🧹 Nitpick comments (1)
public/components/FFmpegStreamsManager.js (1)
65-91: Add keyboard escape handling for accessibility.The modal correctly uses scoped queries with data attributes (addressing the previous review), and handles backdrop click and OK button dismissal. However, it lacks keyboard escape handling, which is expected for accessible modal dialogs.
♿ Proposed fix for keyboard accessibility
const ok = modal.querySelector('[data-duplicate-ok]'); const close = () => modal.remove(); if (ok) ok.addEventListener('click', close); modal.addEventListener('click', (e) => { if (e.target === modal) close(); }); + modal.addEventListener('keydown', (e) => { if (e.key === 'Escape') close(); }); }
| - [x] **Sortable streams (optional)** — Up/down buttons on dashboard; `POST /api/streams/reorder`; order persisted in `config/streams.json` (`_order`); listener page uses same order and S1/S2/S3 labels without refresh. | ||
|
|
||
| - [x] **Contact: WhatsApp** — Country code enforced (digits 10–15, no leading zero); validation backend + ContactManager; `wa.me/<digits>` built on listener page; placeholder "e.g. +44 7123 456789 (country code required)". | ||
| - [x] **Contact: WhatsApp** — Country code enforced (digits 10–15, no leading zero); validation backend + ContactManager; `wa.me/<digits>` built on listener page; placeholder "e.g. +44 7123 456789 (country code required)". Not working |
There was a problem hiding this comment.
Fix checklist status: marked done but says “Not working”.
A checked item shouldn’t describe a broken state. Either uncheck it or split into “implemented” (checked) plus a new unchecked “fix not working” follow‑up.
🤖 Prompt for AI Agents
In `@TODO.md` at line 41, The checklist line for "Contact: WhatsApp" is marked
complete but states "Not working"; update the TODO entry by either unchecking
that item or splitting it into two lines: keep a checked "Contact: WhatsApp —
initial implementation" and add a new unchecked follow-up like "Contact:
WhatsApp — fix validation/wa.me builder (not working)". Ensure the placeholder
text and requirements (digits 10–15, no leading zero, backend validation,
ContactManager, wa.me/<digits>) are preserved in the new lines so reviewers can
track what's implemented vs what still needs fixing.
This was referenced Feb 3, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Merges dev into main. Includes: notification types (simple modal for duplicate name/source); update bell UX (auto-check, modal); contact/event save preservation, no collapsible, contact validate on entry; single page scroll (no inner scrollbar); stream label hyphen; UI-UX-RECOMMENDATIONS-v2.md. UX polish can be done on a separate branch from dev.
Summary by CodeRabbit
New Features
Improvements
Bug Fixes
Known Issues