feat(artist): spotify-style hero backdrop on the artist page (#482) - #483
Conversation
The artist page shipped a flat surface with a circular avatar; the data pipeline only ever carried the square artist photo. This adds a full-bleed hero behind the header with two tiers. Backend - theaudiodb: parse strArtistFanart(+2/3/4) / strArtistWideThumb / strArtistBanner. artist_bio becomes artist_info and returns bio AND fanart_url from one lookup; it returns Some on any name match even with neither, so a "looked, nothing there" outcome is cacheable. - new app migration: metadata_artist gains background_url / background_hash / background_fetched_at. The last one is the "we already looked" marker -- without it a NULL hash cannot be told apart from "never queried", and every fanart-less artist would re-hit a rate-limited API on each page visit. Stamped only when the API was reached, so a transport error retries instead of caching for 30 days. - enrich_artist_deezer calls TheAudioDB independently of metadata.bio_source: Last.fm has no equivalent image, so gating on it would leave every Last.fm user with no hero at all. One request serves both consumers. The fanart is cached full-res (no _1x/_2x tier). - get_artist_detail returns it too, so the hero paints on first frame. Frontend - ArtistHeroBackdrop: real fanart nearly crisp, square photo heavily blurred (SkinAmbientBackdrop's colour-field treatment), nothing at all otherwise. Dark scrim + white header copy in EVERY theme, and the bottom edge fades through a CSS mask rather than a hard-coded colour stop so it dissolves into any theme x skin. - ArtistDetailView breaks out of main's p-8 via -mx-8 -mt-8. The enrichment response only ever sets the fanart, so an empty refresh (offline, API down) never blanks a hero the cache produced. - per-profile toggle ui.artist_hero, default ON -- a baseline visual, not extra motion. prefers-reduced-motion skips the cross-fade only. - i18n propagated to all 17 locales. Claude-Session: https://claude.ai/code/session_01N9WXrurarkoiT2jgimvyj1
InstaZDLL
added
scope: frontend
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: ASSERTIVE Plan: Pro Plus Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughL’intégration récupère le fanart TheAudioDB, le télécharge en pleine résolution, le met en cache et l’expose à la vue artiste. La vue affiche un hero configurable par profil, avec repli sur la photo carrée et prise en charge de la réduction des mouvements. ChangesPipeline TheAudioDB et cache
Estimated code review effort: 4 (Complex) | ~45 minutes Sequence Diagram(s)sequenceDiagram
participant VueArtiste
participant EnrichissementDeezer
participant TheAudioDB
participant CacheImages
VueArtiste->>EnrichissementDeezer: demander l’enrichissement artiste
EnrichissementDeezer->>TheAudioDB: appeler artist_info
TheAudioDB-->>EnrichissementDeezer: retourner biographie et fanart_url
EnrichissementDeezer->>CacheImages: télécharger et mettre en cache le fanart
CacheImages-->>EnrichissementDeezer: retourner background_path
EnrichissementDeezer-->>VueArtiste: retourner background_url et background_path
Possibly related PRs
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
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: 4
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@docs/features/ui.md`:
- Around line 97-101: Correct the fallback count in the “Two tiers, in
precedence order” heading of the artist backdrop documentation to match the
three listed outcomes, including the “Nothing” state; use “Three tiers” or
explicitly distinguish the no-image state from the two image tiers.
In `@src-tauri/crates/app/src/commands/deezer.rs`:
- Around line 567-578: Update metadata_artwork::download_and_cache, after
checking all its Rust call sites, to support skipping thumbnail generation and
use that no-thumbnail path for the full-resolution background download in the
Deezer enrichment flow. Preserve thumbnail generation for existing callers that
require _1x/_2x assets, and continue resolving background_path from the cached
full-resolution file.
In `@src/components/common/ArtistHeroBackdrop.tsx`:
- Around line 59-70: Sécurisez la valeur de src avant son utilisation dans la
propriété backgroundImage du style inline de ArtistHeroBackdrop, en échappant
les guillemets, parenthèses et caractères d’échappement afin qu’une URL de
métadonnée ne puisse pas rompre url() ni injecter du CSS. Utilisez
systématiquement cette valeur encodée lors de l’interpolation.
In `@src/components/views/ArtistDetailView.tsx`:
- Around line 97-101: Expose a loading/resolution state from useArtistHero and
use it in ArtistDetailView so the hero remains hidden until the profile
preference has been loaded. Ensure heroSrc is not rendered while the preference
is unresolved, preventing the initial default true value from causing a flash;
preserve the existing disabled behavior once ui.artist_hero resolves to false.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: 5ac2330b-a67e-45b8-af09-3f4ddf0fd851
📒 Files selected for processing (31)
CLAUDE.mddocs/features/library.mddocs/features/ui.mdsrc-tauri/crates/app/src/commands/browse.rssrc-tauri/crates/app/src/commands/deezer.rssrc-tauri/crates/core/src/metadata/theaudiodb.rssrc-tauri/migrations/app/20260802120000_metadata_artist_background.sqlsrc/app.csssrc/components/common/ArtistHeroBackdrop.tsxsrc/components/views/ArtistDetailView.tsxsrc/components/views/SettingsView.tsxsrc/components/views/settings/ArtistHeroCard.tsxsrc/hooks/useArtistHero.tssrc/i18n/locales/ar.jsonsrc/i18n/locales/de.jsonsrc/i18n/locales/en.jsonsrc/i18n/locales/es.jsonsrc/i18n/locales/fr.jsonsrc/i18n/locales/hi.jsonsrc/i18n/locales/id.jsonsrc/i18n/locales/it.jsonsrc/i18n/locales/ja.jsonsrc/i18n/locales/ko.jsonsrc/i18n/locales/nl.jsonsrc/i18n/locales/pt-BR.jsonsrc/i18n/locales/pt.jsonsrc/i18n/locales/ru.jsonsrc/i18n/locales/tr.jsonsrc/i18n/locales/zh-CN.jsonsrc/i18n/locales/zh-TW.jsonsrc/lib/tauri/detail.ts
- docs: the "two tiers" list has three entries (the no-image case is
not an image tier) -- say so.
- metadata_artwork: download_and_cache always queued the _1x/_2x job,
so the full-res-only fanart generated tiers nothing reads. Split out
download_and_cache_full_res; the three existing callers (album cover,
artist picture, similar-artist picture) keep the thumbnails they need.
- ArtistHeroBackdrop: escape the url("...") interpolation. Unlike the
local paths other backdrops paint, a hero source can be a remote URL
straight out of TheAudioDB -- third-party data that must not be able
to close the string and inject CSS.
- useArtistHero: expose `resolved` and gate the hero on it. The
preference defaults to ON and is read asynchronously, so the previous
code flashed a hero at users who had turned it off. Resolved is set
even when the read fails, otherwise the hero would never appear.
Claude-Session: https://claude.ai/code/session_01N9WXrurarkoiT2jgimvyj1
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/hooks/useArtistHero.ts (1)
42-70: 🎯 Functional Correctness | 🟡 Minor | ⚡ Quick winLiez
resolvedau profil actif.À la Line 55, un changement de profil conserve
resolved === truedepuis le profil précédent.ArtistDetailViewpeut donc afficher le hero avec l’ancienne valeur avant la lecture deui.artist_herodu nouveau profil.Stockez l’identifiant du profil dont la lecture est terminée. Dérivez
resolveden le comparant àactiveProfile?.id. Le rendu masquera alors le hero immédiatement pendant chaque changement de profil.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/hooks/useArtistHero.ts` around lines 42 - 70, Update the resolved state in the useArtistHero hook to track the profile ID whose setting read completed, rather than retaining a profile-independent boolean. Record the active profile ID after the read succeeds or fails, and derive resolved by comparing that recorded ID with activeProfile?.id so profile changes immediately remain unresolved until the new read finishes.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src-tauri/crates/core/src/artwork/metadata.rs`:
- Around line 83-91: Ajoutez une abstraction d’état hors ligne indépendante de
crates/app et utilisez-la dans download_and_cache_inner. Faites retourner None
immédiatement lorsque le mode hors ligne est actif, avant de créer le client
reqwest ou d’effectuer toute requête HTTP; conservez ce contrôle commun aux
chemins download_and_cache_full_res et download_and_cache.
---
Outside diff comments:
In `@src/hooks/useArtistHero.ts`:
- Around line 42-70: Update the resolved state in the useArtistHero hook to
track the profile ID whose setting read completed, rather than retaining a
profile-independent boolean. Record the active profile ID after the read
succeeds or fails, and derive resolved by comparing that recorded ID with
activeProfile?.id so profile changes immediately remain unresolved until the new
read finishes.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: fc4f1ec9-997c-477e-90d3-ea1b96ef2553
📒 Files selected for processing (6)
docs/features/ui.mdsrc-tauri/crates/app/src/commands/deezer.rssrc-tauri/crates/core/src/artwork/metadata.rssrc/components/common/ArtistHeroBackdrop.tsxsrc/components/views/ArtistDetailView.tsxsrc/hooks/useArtistHero.ts
A bare "did we read once" boolean stayed true across a profile switch, so the previous profile's value painted until the new read landed. Stamp the profile the read completed for and derive `resolved` by comparing it with the active id — a switch re-renders with a different id, the stamp stops matching and the hero goes back to hidden for free, with no set-state-in-effect dance. Claude-Session: https://claude.ai/code/session_01N9WXrurarkoiT2jgimvyj1
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/hooks/useArtistHero.ts`:
- Around line 23-26: In the [activeProfileId] effect, reset enabledRef.current,
confirmedEnabledRef.current, setEnabledState, and readProfileId to
undefined/default values before calling refresh; keep this reset outside refresh
because refresh also handles ARTIST_HERO_EVENT. Update the resolved
documentation and failure handling so a failed profile read uses DEFAULT_ENABLED
rather than retaining the previous profile’s preference, including write
rollback behavior.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: d1264915-7c2c-46fd-90d2-3119acfb5e40
📒 Files selected for processing (1)
src/hooks/useArtistHero.ts
`resolved` going false on a switch hid the hero during the read, but a read that *failed* still stamped the new profile and then exposed the outgoing profile's value -- which the doc comment claimed could never happen. Clear enabled + both refs to the default before the read, in the effect rather than in `refresh`: that function also serves ARTIST_HERO_EVENT, where resetting would flash the default on every same-profile broadcast, and a failed same-profile refresh is better off keeping what it had. Claude-Session: https://claude.ai/code/session_01N9WXrurarkoiT2jgimvyj1
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
src/hooks/useArtistHero.ts (1)
82-95: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winEmpêchez une lecture obsolète d’écraser une écriture optimiste.
Une lecture
refreshlancée avantsetEnabled(false)peut se terminer après l’écriture et après leARTIST_HERO_EVENT. Chaque lecture applique actuellement son résultat sans contrôler son ordre.Dans ce cas, une ancienne valeur
"true"peut remplacerenabledetconfirmedEnabledRef.currentalors que la préférence persistée vaut"false". Invalidez les lectures en cours lors d’une écriture et appliquez un résultat seulement s’il correspond à la dernière lecture et à la dernière écriture pertinentes.Also applies to: 106-122
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/hooks/useArtistHero.ts` around lines 82 - 95, Update the refresh flow in useArtistHero so each read is associated with a generation/token, and apply parsed results only when that read is still the latest relevant read and no subsequent optimistic write has occurred. Invalidate or advance the read generation when setEnabled(false) or any preference write starts, and use the same guards before updating enabledRef, confirmedEnabledRef, setEnabledState, and setReadProfileId.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Outside diff comments:
In `@src/hooks/useArtistHero.ts`:
- Around line 82-95: Update the refresh flow in useArtistHero so each read is
associated with a generation/token, and apply parsed results only when that read
is still the latest relevant read and no subsequent optimistic write has
occurred. Invalidate or advance the read generation when setEnabled(false) or
any preference write starts, and use the same guards before updating enabledRef,
confirmedEnabledRef, setEnabledState, and setReadProfileId.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: d8c4c1ca-8043-4038-8246-7434613682cc
📒 Files selected for processing (1)
src/hooks/useArtistHero.ts
A read started at mount (or by ARTIST_HERO_EVENT) applied its result unconditionally, so a toggle clicked while it was in flight got overwritten by the pre-click value -- transient, since the write's own broadcast re-reads afterwards, but visible as the checkbox snapping back. Tag each read with a token that every read and every write bumps, and apply the parsed value only while that token still holds. The profile stamp in `finally` deliberately stays unconditional: the profile HAS been read, and gating it would pin `resolved` false forever if the racing write then failed. Claude-Session: https://claude.ai/code/session_01N9WXrurarkoiT2jgimvyj1
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
src/hooks/useArtistHero.ts (2)
131-143: 🗄️ Data Integrity & Integration | 🟠 Major | ⚡ Quick winNotifier les autres instances après le rollback.
Si plusieurs instances de
useArtistHerosont montées, une première écriture peut réussir puis une écriture plus récente échouer. La première écriture met à jourconfirmedEnabledRef.current, mais son événement est supprimé parseq !== writeSeqRef.current. Lecatchde la seconde écriture restaure seulement l’instance courante et n’émet aucun événement. Les autres instances gardent alors une valeur obsolète.Après
setEnabledState(rollback), diffusezARTIST_HERO_EVENT, en conservant les contrôles de profil et de séquence.Correction minimale
const rollback = confirmedEnabledRef.current; enabledRef.current = rollback; setEnabledState(rollback); + window.dispatchEvent(new CustomEvent(ARTIST_HERO_EVENT));🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/hooks/useArtistHero.ts` around lines 131 - 143, Dans le catch de l’écriture de useArtistHero, après setEnabledState(rollback), émettez ARTIST_HERO_EVENT afin de notifier les autres instances. Conservez les vérifications activeProfileIdRef.current !== profileId et seq !== writeSeqRef.current avant le rollback et la diffusion.
77-86: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick winRéinitialiser
readProfileIdlors de chaque changement de profil.Lorsque l’utilisateur revient rapidement du profil A au profil B, puis au profil A,
readProfileIdpeut encore contenir A.resolveddevient alors vrai avant la nouvelle lecture, alors queenabledcontient encore la valeur par défaut appliquée pour B. Le hero peut afficher la mauvaise préférence de A. Si la lecture échoue, cet état reste actif.Réinitialisez
readProfileIdàundefinedavec les autres états avantrefresh.Correction minimale
enabledRef.current = DEFAULT_ENABLED; confirmedEnabledRef.current = DEFAULT_ENABLED; + // eslint-disable-next-line react-hooks/set-state-in-effect + setReadProfileId(undefined); confirmedEnabledRef.current = DEFAULT_ENABLED;Also applies to: 149-150
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/hooks/useArtistHero.ts` around lines 77 - 86, Reset readProfileId to undefined alongside enabledRef, confirmedEnabledRef, and setEnabledState when the profile changes, before refresh runs. Update the profile-change reset logic in useArtistHero so resolved cannot reuse the previous profile’s read marker, while preserving the existing optimistic enabled behavior.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Outside diff comments:
In `@src/hooks/useArtistHero.ts`:
- Around line 131-143: Dans le catch de l’écriture de useArtistHero, après
setEnabledState(rollback), émettez ARTIST_HERO_EVENT afin de notifier les autres
instances. Conservez les vérifications activeProfileIdRef.current !== profileId
et seq !== writeSeqRef.current avant le rollback et la diffusion.
- Around line 77-86: Reset readProfileId to undefined alongside enabledRef,
confirmedEnabledRef, and setEnabledState when the profile changes, before
refresh runs. Update the profile-change reset logic in useArtistHero so resolved
cannot reuse the previous profile’s read marker, while preserving the existing
optimistic enabled behavior.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: 7067c0ce-0546-4785-8260-fda80b0dc001
📒 Files selected for processing (1)
src/hooks/useArtistHero.ts
|
Note Docstrings generation - SUCCESS |
Docstrings generation was requested by @InstaZDLL. * #483 (comment) The following files were modified: * `src-tauri/crates/app/src/commands/browse.rs` * `src-tauri/crates/app/src/commands/deezer.rs` * `src-tauri/crates/core/src/artwork/metadata.rs` * `src-tauri/crates/core/src/metadata/theaudiodb.rs` * `src/components/common/ArtistHeroBackdrop.tsx` * `src/components/views/ArtistDetailView.tsx` * `src/components/views/SettingsView.tsx` * `src/components/views/settings/ArtistHeroCard.tsx` * `src/hooks/useArtistHero.ts` * `src/lib/tauri/detail.ts`
Deriving `resolved` from the id comparison alone was not enough: switch A -> B -> A faster than B's read completes and the stamp still says A, so `resolved` goes true while `enabled` is sitting at the default B's reset put there -- the very flash the stamp exists to prevent. Reset it with the rest of the outgoing profile's state. Claude-Session: https://claude.ai/code/session_01N9WXrurarkoiT2jgimvyj1
There was a problem hiding this comment.
Actionable comments posted: 1
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (3)
src/hooks/useArtistHero.ts (3)
77-105: 🎯 Functional Correctness | 🟠 Major | 🏗️ Heavy liftNe rendez pas
resolvedvrai avec un état de lecture obsolète.
finallyexécutesetReadProfileId(activeProfileId)même lorsqueseq !== readSeqRef.current. Une lecture plus ancienne peut donc rendreresolvedvrai sans avoir appliqué sa valeur.De plus,
readProfileIdn’est pas invalidé quand le profil change. AprèsA → B → A, l’ancien marqueur deArendresolvedvrai pendant la nouvelle lecture deA.enabledpeut alors contenir un état par défaut non confirmé.Réinitialisez
readProfileIdàundefinedavec les autres états de changement de profil. Renseignez-le uniquement pour la lecture courante. Gérez explicitement le repli lorsqu’une écriture invalide la lecture.Also applies to: 149-150
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/hooks/useArtistHero.ts` around lines 77 - 105, Update the profile-change handling in useArtistHero to reset readProfileId to undefined alongside enabledRef, confirmedEnabledRef, and setEnabledState. In refresh, only setReadProfileId(activeProfileId) for the current read sequence, never when cancelled or seq !== readSeqRef.current, and explicitly preserve the default fallback when a write invalidates the read so resolved cannot become true from stale data.
131-143: 🗄️ Data Integrity & Integration | 🟠 Major | ⚡ Quick winÉmettez
ARTIST_HERO_EVENTaprès le rollback.Si l’écriture
seq=1réussit et queseq=2échoue, aucun événement n’est émis. L’instance qui a lancé les écritures revient à la valeur confirmée, mais les autres instances peuvent conserver l’ancienne valeur. Ajoutez l’émission après le rollback et testez deux consommateurs montés simultanément.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/hooks/useArtistHero.ts` around lines 131 - 143, Update the error path in the write handling around the ARTIST_HERO_EVENT dispatch so it emits ARTIST_HERO_EVENT after restoring the confirmed value and updating state. Preserve the existing profile and sequence guards, and add coverage for two simultaneously mounted consumers where a later write fails after an earlier write succeeds.
121-127: 🗄️ Data Integrity & Integration | 🟡 Minor | ⚡ Quick winAssociez l’écriture au profil capturé.
set_profile_settingutilise le pool actif au moment où la commande acquiert son lease. Un changement de profil peut donc survenir après le garde JavaScript, mais avant cette acquisition, et écrire la préférence dans le nouveau profil. PassezprofileIdà la commande et validez-le sous le même verrou que l’acquisition du pool.🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@src/hooks/useArtistHero.ts` around lines 121 - 127, Associate the queued write in the enabled-setting flow with the captured profileId by passing it into the underlying set_profile_setting command. Ensure the command validates the captured profile ID while holding the same lock used to acquire the active pool, preventing a profile switch between the JavaScript guard and lease acquisition from writing to the wrong profile.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/hooks/useArtistHero.ts`:
- Around line 55-59: Add a real read/write barrier in the refresh flow around
readSeqRef, refresh, and setProfileSetting: prevent a read triggered by
ARTIST_HERO_EVENT from applying while the current write is still pending, either
by awaiting that write or validating a pending-write token before updating
enabled and confirmedEnabledRef. After the write completes, reread the persisted
value and apply that result, while preserving existing overlapping-read
invalidation.
---
Outside diff comments:
In `@src/hooks/useArtistHero.ts`:
- Around line 77-105: Update the profile-change handling in useArtistHero to
reset readProfileId to undefined alongside enabledRef, confirmedEnabledRef, and
setEnabledState. In refresh, only setReadProfileId(activeProfileId) for the
current read sequence, never when cancelled or seq !== readSeqRef.current, and
explicitly preserve the default fallback when a write invalidates the read so
resolved cannot become true from stale data.
- Around line 131-143: Update the error path in the write handling around the
ARTIST_HERO_EVENT dispatch so it emits ARTIST_HERO_EVENT after restoring the
confirmed value and updating state. Preserve the existing profile and sequence
guards, and add coverage for two simultaneously mounted consumers where a later
write fails after an earlier write succeeds.
- Around line 121-127: Associate the queued write in the enabled-setting flow
with the captured profileId by passing it into the underlying
set_profile_setting command. Ensure the command validates the captured profile
ID while holding the same lock used to acquire the active pool, preventing a
profile switch between the JavaScript guard and lease acquisition from writing
to the wrong profile.
🪄 Autofix
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: f31f3771-1543-47d5-88f2-8a9ae67b3834
📒 Files selected for processing (1)
src/hooks/useArtistHero.ts
|
@coderabbitai Two findings from this review are real but deliberately out of scope for this PR — tracked in #485:
Everything else from the review is applied on this branch. The remaining suggestions I did not take, with reasons:
|
|
Tip For best results, initiate chat on the files or code changes.
I agree that the I also agree that the duplicated preference-hook behavior needs one shared The stated I will treat these items as deferred to ✏️ Learnings added
You are interacting with an AI system. |
1 participant
Closes #482.
Gives the artist detail page a full-bleed hero behind the header, Spotify-style, instead of today's flat surface with a circular avatar. Both tiers ship here: the real wide fanart pipeline and the blurred-photo fallback.
Backdrop precedence
real wide fanart (TheAudioDB) → blurred square photo (Deezer / local
artist.jpg) → flat headerA crisp wide fanart gives the real look but not every artist has one; the blurred square photo is always available and works offline, so it's the universal fallback.
Backend
theaudiodb.rs—ArtistPayloadnow parsesstrArtistFanart(+2/3/4),strArtistWideThumb,strArtistBanner.artist_biobecomesartist_infoand returns bio andfanart_urlfrom a single lookup, picking widest-and-cleanest first (logo banner last, its baked-in text can clash with the header copy). It returnsSomefor any name match even with neither bio nor fanart, so the caller can cache the "looked, nothing there" outcome.20260802120000_metadata_artist_background.sql—background_url+background_hash+background_fetched_at. That last column is the "we already looked" marker: without it a NULL hash is indistinguishable from "never queried", and every fanart-less artist would re-hit a rate-limited API on each page visit. It's stamped only when the API was reached (match or not) and left NULL on a transport error, so a network blip retries instead of caching "no fanart" for the row's whole 30-day TTL. Pre-existing rows have NULL there and backfill once on their next refresh.enrich_artist_deezer— resolves the fanart independently ofmetadata.bio_source(the issue's open question): Last.fm has no equivalent image, so gating on the bio source would leave every Last.fm user with no hero at all. One TheAudioDB request serves both consumers — the bio half is used only when TheAudioDB is the selected source, which matters on their shared rate-limited free key. Downloaded through the usualmetadata_artwork::download_and_cacheand kept full-res (no_1x/_2x— downscaling a full-bleed banner only softens it). Offline mode short-circuits before all of it.get_artist_detailreturnsbackground_url/background_pathtoo, so the hero paints on the first frame for an already-enriched artist instead of waiting for the enrichment round-trip.Frontend
ArtistHeroBackdrop— fanart shown nearly crisp (blur(2px), just enough to keep JPEG artefacts from crawling under the white copy); the square photo gets the heavy colour-field treatmentSkinAmbientBackdropuses (blur(56px) saturate(190%),scale(1.35)) because a 1:1 image stretched across a banner is unreadable otherwise.ArtistDetailViewbreaks out of<main>'sp-8with-mx-8 -mt-8so the image reaches the column edges (and shrinks with the column when a right panel opens). The enrichment response only ever sets the fanart — an empty refresh (offline, TheAudioDB down) must not blank a hero the cache already produced.ui.artist_hero, per-profile, default ON (a baseline visual, not extra motion), Settings → Appearance; write machinery mirrorsuseCoverSlideshow.prefers-reduced-motionskips the cross-fade only — the image itself is static.Docs
docs/features/ui.md(new Artist hero section),docs/features/library.md(Wide artist fanart (hero) — the backend pipeline), CLAUDE.md (UI + Integrations catalogues).Checks
bun run typecheck✅ ·bun run lint✅cargo check --workspace --all-targets✅ ·cargo clippy— no new warning (the 7 reported are pre-existing inscanner/extract.rs+browse.rs:462)cargo test -p waveflow-core— 102/102 ✅, including 3 newtheaudiodbtests covering the fanart fallback ordermigrations/app/chain + the exact INSERT the code issues) ✅Not verified by me: the visual result in the running app (crisp fanart vs blurred fallback, legibility across the 5 skins × 14 themes). Worth a look before merge.
https://claude.ai/code/session_01N9WXrurarkoiT2jgimvyj1
Summary by CodeRabbit
Nouvelles fonctionnalités
Améliorations
Documentation