feat(explore): scrollable rows and one album card size (#264) #268

Closed
yonlu wants to merge 0 commits from feat/264-explore-cards into main
Owner

This lands Explore page work that was done in a local tree before it had an issue. Closes #264.

commit issue what it does
7b42b9ce #264 "More from artists you own one album by" samples with RANDOM() rather than ranking by popularity; the test asserts the set, not the order.
bb26d5f2 #264 Adds <scroll-row>, a sideways row with previous/next arrows, used on the shelves, top results, discography and similar-artists rows. Defines the album card once in albumCardStyles: fixed width, covers inset rather than cropped, ownership badge over the art, no dimming on catalog cards. Adds openMusicBrainz, which pins the origin, and moves the album page's last raw window.open onto it. Bundles solid/chevron-left.

What was adjusted before committing

  • solid/chevron-left was not bundled. The scroll-row's left arrow would have drawn the missing-icon fallback, and nothing in the component tier catches a literal icon name that is missing. It is now vendored with fetch-icons.mjs.
  • One MusicBrainz link was still a raw window.open, in explore-album-details; it now goes through the helper.

Verification

  • make ui-test passes: 109 files, 1161 tests, including the new scroll-row, album-card-size and artist-header specs.
  • tsc --noEmit, make css-check and go test ./backend/explore/ pass.
  • No toMatchScreenshot baseline covers these components, so there is no baseline to refresh.
  • Not checked in the running app or on the device. Arrow reveal on touch, and openMusicBrainz going through an anchor rather than window.open inside the Wails webview, are worth a look in make dev.

One interaction worth knowing about: #70 asks Home's shelves not to reshuffle on each visit. This change is Explore-only and deliberately reshuffles its one-album-owned row. That is a different page making a different claim, but the two issues should agree on purpose.

Closes

🤖 Generated with Claude Code

https://claude.ai/code/session_017HJiuc3ZZhxsPXz3ozTirT

This lands Explore page work that was done in a local tree before it had an issue. Closes #264. | commit | issue | what it does | | --- | --- | --- | | `7b42b9ce` | #264 | "More from artists you own one album by" samples with `RANDOM()` rather than ranking by popularity; the test asserts the set, not the order. | | `bb26d5f2` | #264 | Adds `<scroll-row>`, a sideways row with previous/next arrows, used on the shelves, top results, discography and similar-artists rows. Defines the album card once in `albumCardStyles`: fixed width, covers inset rather than cropped, ownership badge over the art, no dimming on catalog cards. Adds `openMusicBrainz`, which pins the origin, and moves the album page's last raw `window.open` onto it. Bundles `solid/chevron-left`. | ## What was adjusted before committing - **`solid/chevron-left` was not bundled.** The scroll-row's left arrow would have drawn the missing-icon fallback, and nothing in the component tier catches a literal icon name that is missing. It is now vendored with `fetch-icons.mjs`. - **One MusicBrainz link was still a raw `window.open`**, in `explore-album-details`; it now goes through the helper. ## Verification - `make ui-test` passes: 109 files, 1161 tests, including the new `scroll-row`, `album-card-size` and `artist-header` specs. - `tsc --noEmit`, `make css-check` and `go test ./backend/explore/` pass. - No `toMatchScreenshot` baseline covers these components, so there is no baseline to refresh. - **Not checked in the running app or on the device.** Arrow reveal on touch, and `openMusicBrainz` going through an anchor rather than `window.open` inside the Wails webview, are worth a look in `make dev`. One interaction worth knowing about: #70 asks Home's shelves *not* to reshuffle on each visit. This change is Explore-only and deliberately reshuffles its one-album-owned row. That is a different page making a different claim, but the two issues should agree on purpose. ## Closes - #264 🤖 Generated with [Claude Code](https://claude.com/claude-code) https://claude.ai/code/session_017HJiuc3ZZhxsPXz3ozTirT
yonlu added 2 commits 2026-09-26 21:04:24 +00:00
"More from artists you own one album by" drew its artists and their
albums most-popular first, so it was a second leaderboard: the same
handful of big names every time the page opened, which is not what the
shelf is saying.  The pool is still bounded, but which artists and
which albums fill it is RANDOM(), so each visit is a different sample.
The test asserts the set rather than the order.

Refs #264

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017HJiuc3ZZhxsPXz3ozTirT
feat(explore): arrows on every sideways row, and one album card size
CI / check (push) Skipped
CI / e2e (push) Skipped
CI / check (pull_request) Successful in 4m25s
CI / e2e (pull_request) Successful in 13m43s
bb26d5f289
The shelves, the top results and the artist page's discography and
similar-artists rows scrolled sideways only by a horizontal wheel or a
trackpad, so a plain mouse could not reach anything past the fold.
<scroll-row> wraps each of them with previous/next arrows that are
hidden at the end they cannot move from, revealed on hover where there
is hover, and always shown where there is not.

The album card is defined once, in albumCardStyles, instead of twice.
explore-view clamped its cards to 130-150px, and with square artwork
that made cards in one row different heights as well as widths.  The
width is fixed now and each line under the art reserves its own space.
Covers are inset rather than cropped (contain, not cover).

The ownership badge sits over the artwork for owned and unowned alike,
and catalog cards no longer dim: a grid of dimmed covers read as a page
that had failed to load.  The album page's tracklist still dims unowned
rows, which says something different about something different.

Every MusicBrainz link now goes through openMusicBrainz, which pins the
origin, including the one on the album page that still called
window.open directly.  solid/chevron-left is bundled for the left arrow;
without it the arrow drew the missing-icon fallback.

Closes #264

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_017HJiuc3ZZhxsPXz3ozTirT
yonlu closed this pull request 2026-09-27 01:44:17 +00:00

Pull request closed

Please reopen this pull request to perform a merge.
Sign in to join this conversation.