diff --git a/src/lib/components/VirtualizedFavoritesAlbumGrid.svelte b/src/lib/components/VirtualizedFavoritesAlbumGrid.svelte index e578cb9c2..a3711f379 100644 --- a/src/lib/components/VirtualizedFavoritesAlbumGrid.svelte +++ b/src/lib/components/VirtualizedFavoritesAlbumGrid.svelte @@ -53,6 +53,8 @@ onLoadMore?: () => void; isLoadingMore?: boolean; onAddAlbumToPlaylist?: (albumId: string) => void; + onAlbumFavorite?: (albumId: string) => void; + isAlbumFavorite?: (albumId: string) => boolean; } let { @@ -79,6 +81,8 @@ onLoadMore, isLoadingMore = false, onAddAlbumToPlaylist, + onAlbumFavorite, + isAlbumFavorite, }: Props = $props(); // Constants @@ -330,6 +334,8 @@ onShareSonglink={onAlbumShareSonglink ? () => onAlbumShareSonglink(album.id) : undefined} onDownload={onAlbumDownload ? () => onAlbumDownload(album.id) : undefined} onReDownloadAlbum={onReDownloadAlbum ? () => onReDownloadAlbum(album.id) : undefined} + isFavorite={isAlbumFavorite?.(album.id) ?? false} + onFavorite={onAlbumFavorite ? () => onAlbumFavorite(album.id) : undefined} onClick={() => handleAlbumClickEvent(album.id)} /> diff --git a/src/lib/components/views/DiscoverBrowseView.svelte b/src/lib/components/views/DiscoverBrowseView.svelte index e81741764..82a770969 100644 --- a/src/lib/components/views/DiscoverBrowseView.svelte +++ b/src/lib/components/views/DiscoverBrowseView.svelte @@ -9,6 +9,11 @@ getSelectedGenreIds, type GenreFilterContext } from '$lib/stores/genreFilterStore'; + import { + isAlbumFavorite, + toggleAlbumFavorite, + subscribe as subscribeAlbumFavs, + } from '$lib/stores/albumFavoritesStore'; interface DiscoverAlbum { id: string; @@ -94,6 +99,20 @@ }; const genreContext = $derived(GENRE_CONTEXT_MAP[endpointType]); + // Album favorite state — reactive against the shared albumFavoritesStore so + // the heart on each card reflects (and toggles) real favorite status. The + // collapsed Discovery view already wires this; the "see all" browse pages + // were missing it, so the heart did nothing here (issue #468). + let favoritesVersion = $state(0); + $effect(() => { + const unsub = subscribeAlbumFavs(() => { favoritesVersion++; }); + return unsub; + }); + function isFav(albumId: string): boolean { + void favoritesVersion; + return isAlbumFavorite(albumId); + } + // State let albums = $state([]); let hasMore = $state(true); @@ -309,6 +328,8 @@ onOpenAlbumFolder={onOpenAlbumFolder} onReDownloadAlbum={onReDownloadAlbum} onAddAlbumToPlaylist={onAddAlbumToPlaylist} + onAlbumFavorite={(id) => { void toggleAlbumFavorite(id); }} + isAlbumFavorite={isFav} {downloadStateVersion} {isAlbumDownloaded} {showRanking}