diff --git a/web-player/src/lib/components/TrackTile.svelte b/web-player/src/lib/components/TrackTile.svelte
index cd6d9be..5609145 100644
--- a/web-player/src/lib/components/TrackTile.svelte
+++ b/web-player/src/lib/components/TrackTile.svelte
@@ -8,6 +8,7 @@
id: string | number;
title: string;
artist?: string | null;
+ typeLabel?: string;
coverSrc?: string | null;
coverSize?: 'small' | 'medium' | 'large';
hue: number;
@@ -24,6 +25,7 @@
id,
title,
artist,
+ typeLabel,
coverSrc,
coverSize = 'large',
hue,
@@ -35,6 +37,8 @@
onContextMenu,
badge
}: Props = $props();
+
+ const meta = $derived([typeLabel, artist].filter((part) => !!part).join(' · '));
{title}
- {#if badge || artist}
+ {#if badge || meta}
{@render badge?.()}
- {#if artist}
- {artist}
+ {#if meta}
+ {meta}
{/if}
{/if}
diff --git a/web-player/src/lib/components/ui/AlbumCard.svelte b/web-player/src/lib/components/ui/AlbumCard.svelte
index 8cc5b27..151a237 100644
--- a/web-player/src/lib/components/ui/AlbumCard.svelte
+++ b/web-player/src/lib/components/ui/AlbumCard.svelte
@@ -8,6 +8,7 @@
title: string;
href?: string;
subtitle?: string;
+ typeLabel?: string;
releaseYear?: number;
trackCount?: number;
trackIds?: (string | number)[];
@@ -20,6 +21,7 @@
title,
href,
subtitle,
+ typeLabel,
releaseYear,
trackCount,
trackIds = [],
@@ -29,6 +31,7 @@
const meta = $derived(
[
+ typeLabel,
subtitle,
releaseYear ? String(releaseYear) : undefined,
trackCount === undefined
diff --git a/web-player/src/routes/(app)/explore/+page.svelte b/web-player/src/routes/(app)/explore/+page.svelte
index 49ac334..389a4b6 100644
--- a/web-player/src/routes/(app)/explore/+page.svelte
+++ b/web-player/src/routes/(app)/explore/+page.svelte
@@ -275,6 +275,7 @@