mirror of
https://github.com/kilyabin/psysonic.git
synced 2026-07-22 14:35:41 +00:00
feat(home): Because you listened recommendation rail (#489)
* feat(home): "Because you listened" recommendation rail New Home rail (under Recently Added, default on, toggleable in Settings → Personalisation → Home Page) that surfaces 3 albums from artists similar to one of your top-played artists. Anchor rotates per Home mount so a different top-artist seeds the recommendations each visit; within each anchor, both the similar-artist subset and the chosen album per artist are randomised, so the same anchor returns different picks on subsequent visits. Card layout matches the regular Album cards' surface (--bg-card with accent-tinted border + 1px inset top highlight) and gets the same Play / Enqueue hover overlay buttons. Cover and meta scale via CSS only — no infinite animations, no filter/blur/transform, no compositing layers. Grid wraps below 3-up at <400px card width instead of shrinking. API budget: one getArtistInfo2 + 6 parallel getArtist calls per Home mount, both reusing the existing mostPlayed payload to derive the anchor pool (no extra API call to find top artists). All 8 locales seeded. * fix(home): ru plurals + per-server anchor + narrower card grid - ru: add _few / _many for becauseYouLikeTracks (CLDR Russian needs 4 forms — 3 треков was wrong, now 3 трека). - Anchor rotation memory is now per-server. The localStorage key becomes psysonic_because_anchor:<serverId>; switching servers no longer aliases server A's rotation onto server B's pool. - because-card grid minmax(400px, 1fr) -> minmax(340px, 1fr) so two cards fit side by side at typical sidebar-expanded widths instead of collapsing to a single card per row. * docs: CHANGELOG + Contributors entry for Because-you-listened rail (PR #489) * style(home): blurred cover backdrop + centred layout for Because-cards - Each Because-card renders the album cover as a blurred, low-opacity full-bleed background layer behind the existing cover thumb and text. Resolved through useCachedUrl so the cache layer feeds it (same key as the thumbnail) instead of a fresh salted URL on every render. - Card content (cover thumb + text block) now centred horizontally and vertically within the card; the meta line lives in a small pill that sits centred under the artist row. - Text contrast halo and meta-pill background are theme-aware via color-mix on var(--bg-card) / var(--text-primary), so the same rules read on dark and light themes (was hard-coded rgba black before and smudged the type on Latte / Nord Snowstorm).
This commit is contained in:
committed by
GitHub
parent
5b37ab70f1
commit
d1ff2fab51
@@ -2,6 +2,7 @@ import React, { useEffect, useState } from 'react';
|
||||
import Hero from '../components/Hero';
|
||||
import AlbumRow from '../components/AlbumRow';
|
||||
import SongRail from '../components/SongRail';
|
||||
import BecauseYouLikeRail from '../components/BecauseYouLikeRail';
|
||||
import { getAlbumList, getArtists, getRandomSongs, SubsonicAlbum, SubsonicArtist, SubsonicSong } from '../api/subsonic';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { NavLink, useNavigate } from 'react-router-dom';
|
||||
@@ -167,6 +168,12 @@ export default function Home() {
|
||||
isVisible('mostPlayed') &&
|
||||
mostPlayed.length > 0 &&
|
||||
reserveArtworkRow();
|
||||
const becauseYouLikeArtworkEnabled =
|
||||
!homeRailArtworkDisabled &&
|
||||
!homeAlbumRowsDisabled &&
|
||||
isVisible('becauseYouLike') &&
|
||||
mostPlayed.length > 0 &&
|
||||
reserveArtworkRow();
|
||||
|
||||
const homeLiteArtworkFx = perfFlags.disableHomeArtworkFx;
|
||||
const homeFlatArtworkClip = perfFlags.disableHomeArtworkClip;
|
||||
@@ -194,6 +201,12 @@ export default function Home() {
|
||||
initialArtworkBudget={HOME_ALBUM_ROW_INITIAL_ARTWORK_BUDGET}
|
||||
/>
|
||||
)}
|
||||
{!homeAlbumRowsDisabled && isVisible('becauseYouLike') && mostPlayed.length > 0 && (
|
||||
<BecauseYouLikeRail
|
||||
mostPlayed={mostPlayed}
|
||||
disableArtwork={!becauseYouLikeArtworkEnabled}
|
||||
/>
|
||||
)}
|
||||
{!homeAlbumRowsDisabled && isVisible('discover') && (
|
||||
<AlbumRow
|
||||
title={t('home.discover')}
|
||||
|
||||
Reference in New Issue
Block a user