Two coupled UX fixes around the header live search and the global context
menu, born from the same testing pass.
LiveSearch / MobileSearchOverlay
- Single click on a song no longer calls playTrack(track) without a
queue argument. The store fell back to the existing queue, didn't
find the new track, and ended up playing something the user couldn't
navigate or see in the queue list — the player header showed metadata
but the queue itself didn't contain it.
- New behaviour: enqueue([track]) + "Added to queue" toast. Whatever was
playing keeps playing; the new track lands at the bottom and is
visible/navigable. Mobile gets the same behaviour (tap-only).
- Desktop also gets a right-click context menu on song rows for users
who want immediate playback or different routing (Play Now, Play Next,
Add to Playlist, etc.). The dropdown stays open while the CM is up,
and the row picks up the .context-active highlight so the user can
see which song the menu refers to.
ContextMenu
- Removed the transparent fullscreen backdrop (z-index 998) that
previously caught outside clicks. It also blocked right-clicks from
reaching elements *underneath* it — so right-clicking a different
song row to reposition the menu hit the backdrop instead, closed the
menu, and never opened a new one for the row the user actually
pointed at.
- Replaced with a document-level mousedown listener (gated on
`contextMenu.isOpen`) that closes the menu when the click lands
outside `menuRef`. Standard outside-click pattern, doesn't occlude
the underlying UI, and right-clicking another row now naturally
pivots the CM to that row.
i18n: new search.addedToQueueToast key in 8 locales.
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
The sidebar LiveSearch and mobile search overlay rendered cover thumbs via
raw <img src={buildCoverArtUrl(...)}> instead of going through the
IndexedDB-backed CachedImage path used everywhere else in the app.
buildCoverArtUrl() mints a fresh URL on every call (random salt + a new
MD5 token per Subsonic spec), so the browser cache was permanently
defeated for these thumbs — every re-render of the dropdown produced
new URLs and the browser dispatched HTTP requests for every "new"
image.
While typing in the search field this multiplied: each keystroke
triggered a re-render with fresh URLs for every visible cover, and
after the 300 ms debounce a fresh search() result triggered another
wave. Five visible album thumbs × five keystrokes ≈ 50 redundant cover
fetches in 1.5 s, manifesting as periodic typing delays.
Switch all three call sites to CachedImage with the stable
coverArtCacheKey() — same pattern CLAUDE.md explicitly recommends:
buildCoverArtUrl() generates a new ephemeral URL every call —
browser cache is useless. Use coverArtCacheKey(id, size) +
CachedImage for <img> tags.
Confirmed locally: typing in the search field is noticeably smoother.
Co-authored-by: Psychotoxical <dev@psysonic.app>
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
Apply musicFolderId across Subsonic requests, bump a filter version so library views reload, and add a fixed-position sidebar dropdown (with capped height when there are many folders).
Frank Stellmacher
Frank Stellmacher
Maxim Isaev
Psychotoxical