Drops every YouTube-backed route, proxy and type (external albums/tracks, thumbnail proxy, youtube.ts) and simplifies player/track/mix types to the local-only catalog now that the backend contract dropped Source/ExternalId. Genre tiles on Explore and "Populares esta semana" on Home stay as deliberate client-only placeholders per product decision, just without the YouTube backing. Also finishes the design-system unification pass: Home's three hand-rolled track rows (Continuar escuchando, Playlist destacada, Populares esta semana) now reuse the shared TrackTitleCell component instead of duplicating cover+title+artist markup, and the orphaned Rail.svelte (no importers) is removed. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
48 lines
898 B
Svelte
48 lines
898 B
Svelte
<script lang="ts">
|
|
import type { Snippet } from 'svelte';
|
|
|
|
interface Props {
|
|
trackId: string | number;
|
|
size?: 'small' | 'medium' | 'large';
|
|
src?: string | null;
|
|
alt?: string;
|
|
class?: string;
|
|
children?: Snippet;
|
|
oncontextmenu?: (event: MouseEvent) => void;
|
|
}
|
|
|
|
let {
|
|
trackId,
|
|
size = 'medium',
|
|
src,
|
|
alt = '',
|
|
class: klass = '',
|
|
children,
|
|
oncontextmenu
|
|
}: Props = $props();
|
|
|
|
let failed = $state(false);
|
|
|
|
const imageSrc = $derived(src ?? `/api/tracks/${trackId}/cover?size=${size}`);
|
|
|
|
$effect(() => {
|
|
imageSrc;
|
|
failed = false;
|
|
});
|
|
</script>
|
|
|
|
<div class="relative overflow-hidden bg-surface {klass}" role="presentation" {oncontextmenu}>
|
|
{#if !failed}
|
|
<img
|
|
src={imageSrc}
|
|
{alt}
|
|
loading="lazy"
|
|
decoding="async"
|
|
fetchpriority="low"
|
|
onerror={() => (failed = true)}
|
|
class="h-full w-full object-cover"
|
|
/>
|
|
{/if}
|
|
{@render children?.()}
|
|
</div>
|