feat(player): album-art thumbnails in web queue rows — #1944

Adds a 40px cover thumbnail (coverUrl(album_id), FALLBACK_COVER on error) to
each queue row, matching the artwork every comparable player shows in its
up-next list.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-07-22 22:57:23 -04:00
parent 2038028d42
commit 0efbf5fcaa
@@ -3,6 +3,7 @@
import { draggable, type DragEventData } from '@neodrag/svelte'; import { draggable, type DragEventData } from '@neodrag/svelte';
import type { TrackRef } from '$lib/api/types'; import type { TrackRef } from '$lib/api/types';
import { playFromQueueIndex, removeFromQueue, moveQueueItem } from '$lib/player/store.svelte'; import { playFromQueueIndex, removeFromQueue, moveQueueItem } from '$lib/player/store.svelte';
import { coverUrl, FALLBACK_COVER } from '$lib/media/covers';
import { offsetToDelta } from './queue-row-math'; import { offsetToDelta } from './queue-row-math';
import LikeButton from './LikeButton.svelte'; import LikeButton from './LikeButton.svelte';
@@ -66,6 +67,13 @@
<GripVertical size={16} /> <GripVertical size={16} />
</button> </button>
<img
src={coverUrl(track.album_id)}
alt=""
onerror={(e) => ((e.currentTarget as HTMLImageElement).src = FALLBACK_COVER)}
class="h-10 w-10 flex-shrink-0 rounded object-cover"
/>
<button <button
type="button" type="button"
onclick={handleBodyClick} onclick={handleBodyClick}