feat(home): broaden Because-you-like seed pool + tidy orphan card at 1080p (#493)

* feat(home): mix recently-played + starred into Because-you-like anchor pool

Anchor pool was sourced only from getAlbumList(frequent), so the rotation
cursor walked the same eight top-played artists no matter how varied the
rest of the listening history was. Round-robin merge of mostPlayed,
recentlyPlayed and starred (dedup by artistId) means each mount can land
on a different listening *mode* — heavy rotation, current focus, or
explicit favorites — instead of stepping through the same top-played
sequence.

Pool size 8 -> 12 to let the cursor visit all three modes before
wrapping. Visibility guard widened so the rail still renders when the
server has no frequent-play data yet but starred or recent items exist.
Zero new API calls — all three lists are already in Home's initial
fetch.

* fix(home): drop orphan 3rd Because-card in 2-col range, keep all 3 stacked on mobile

auto-fit grid wraps to 2 cols between 696-1051px container width, which
left the third card alone on a second row at 1080p. Container query
hides the 3rd card only inside that 2-col band; on wider screens the
full 3-up row stays, on narrow viewports (single column) all three
cards stack vertically as expected.

* docs(changelog): Because-you-listened seed pool + 1080p layout polish (PR #493)

* docs(changelog): fold PR #493 refinements into the existing Because-you-listened entry

Drop the separate Changed section entry — the feature is in the same
1.46.0 release window as PR #489, so readers want a single description
of the final behaviour, not "added X, then changed X" for the same
release. PR reference becomes "PRs #489, #493".
This commit is contained in:
Frank Stellmacher
2026-05-07 09:12:47 +02:00
committed by GitHub
parent b01e76df9c
commit d75670ec4b
4 changed files with 51 additions and 15 deletions
+13
View File
@@ -13905,11 +13905,24 @@ html[data-perf-disable-home-artwork-clip="true"] .home-lite-artwork .song-card-c
/* Because-you-like rail performance-conscious by design.
No filter/blur/transform animations (WebKitGTK / software-compositing friendly). */
.because-you-like-rail {
container-type: inline-size;
}
.because-card-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
gap: 1rem;
}
/* Hide the 3rd card only inside the 2-column range, so:
>= 1052px (3 cols) -> 3 cards in one row
696-1051px (2 cols) -> 2 cards in one row, orphan dropped
< 696px (1 col) -> 3 cards stacked, orphan welcome
Math: 3*340 + 2*16 = 1052 (3-col cutoff), 2*340 + 1*16 = 696 (2-col cutoff). */
@container (min-width: 696px) and (max-width: 1051px) {
.because-card-grid > :nth-child(n+3) {
display: none;
}
}
.because-card {
position: relative;
overflow: hidden;