feat(web): wire LikeButton into TrackRow, AlbumCard, ArtistRow, PlayerBar

Heart appears on every entity rendering surface. ArtistRow restructured
to a <div> with the link as a positioned overlay so the heart button
can nest without invalid <button>-in-<a> markup. Shell nav grows a
'Liked' entry pointing at /library/liked.
This commit is contained in:
2026-04-26 16:56:07 -04:00
parent 6ab1fef07e
commit de5320a7b4
9 changed files with 104 additions and 25 deletions
+10 -6
View File
@@ -3,6 +3,7 @@
import { FALLBACK_COVER } from '$lib/media/covers';
import { api } from '$lib/api/client';
import { enqueueTracks } from '$lib/player/store.svelte';
import LikeButton from './LikeButton.svelte';
let { album }: { album: AlbumRef } = $props();
@@ -35,10 +36,13 @@
<div class="text-xs text-text-secondary">{album.year}</div>
{/if}
</a>
<button
type="button"
aria-label="Add to queue"
onclick={onAddClick}
class="absolute right-2 top-2 rounded-full bg-surface/80 px-2 py-1 text-sm text-text-secondary hover:text-text-primary focus-visible:ring-2 focus-visible:ring-accent"
>+</button>
<div class="absolute right-2 top-2 flex gap-1">
<LikeButton entityType="album" entityId={album.id} />
<button
type="button"
aria-label="Add to queue"
onclick={onAddClick}
class="rounded-full bg-surface/80 px-2 py-1 text-sm text-text-secondary hover:text-text-primary focus-visible:ring-2 focus-visible:ring-accent"
>+</button>
</div>
</div>