From 7536f239b2cce631c0723415efa53c471cc9acf9 Mon Sep 17 00:00:00 2001
From: XShine555 <xshine555@gmail.com>
Date: Tue, 22 Sep 2026 18:46:17 +0200
Subject: [PATCH] Carry track duration through the queue pipeline
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

ApiTrackLike/QueueItem had no duration field, so toQueueItem(s) always
dropped it and toTrack() hardcoded a new track's duration to 0, relying
entirely on the <audio> element's durationchange/loadedmetadata events
to fill it in once that track actually became current. Upcoming queue
rows never reach that point, so "A continuación" always showed a blank
duration even though the backend already returns it.

Add duration to both types, thread it through toQueueItems/toQueueItem/
trackFromQueueItem, and seed toTrack() from it. The real-time audio
sync still overwrites it once a track actually plays, so this only
fills the gap for tracks that haven't played yet.

Also map MixItemApplicationResponse's durationSeconds through
mixItemTrack, since mixes use a differently-named field.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 web-player/src/lib/data/mixes.ts           | 1 +
 web-player/src/lib/player/player.svelte.ts | 6 +++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/web-player/src/lib/data/mixes.ts b/web-player/src/lib/data/mixes.ts
index e08ab79..aa8d2ee 100644
--- a/web-player/src/lib/data/mixes.ts
+++ b/web-player/src/lib/data/mixes.ts
@@ -13,6 +13,7 @@ export function mixItemTrack(item: MixItem): ApiTrackLike {
 		id: item.trackId,
 		title: item.title,
 		artist: item.artist,
+		duration: item.durationSeconds,
 		listensCount: item.listensCount
 	};
 }
diff --git a/web-player/src/lib/player/player.svelte.ts b/web-player/src/lib/player/player.svelte.ts
index 3ffb930..7c503c4 100644
--- a/web-player/src/lib/player/player.svelte.ts
+++ b/web-player/src/lib/player/player.svelte.ts
@@ -23,6 +23,7 @@ export interface QueueItem {
 	id: string | number;
 	title: string;
 	artist?: string;
+	duration?: number | string;
 	explicit?: boolean;
 	ownerUserId?: string | number | null;
 	listensCount?: number | string;
@@ -32,6 +33,7 @@ export interface ApiTrackLike {
 	id: string | number;
 	title: string;
 	artist?: string | null;
+	duration?: number | string;
 	isExplicit?: boolean;
 	ownerUserId?: string | number | null;
 	listensCount?: number | string;
@@ -42,6 +44,7 @@ export function toQueueItems(tracks: ApiTrackLike[]): QueueItem[] {
 		id: track.id,
 		title: track.title,
 		artist: track.artist ?? undefined,
+		duration: track.duration,
 		explicit: track.isExplicit,
 		ownerUserId: track.ownerUserId,
 		listensCount: track.listensCount
@@ -57,6 +60,7 @@ export function trackFromQueueItem(item: QueueItem): ApiTrackLike {
 		id: item.id,
 		title: item.title,
 		artist: item.artist,
+		duration: item.duration,
 		isExplicit: item.explicit,
 		ownerUserId: item.ownerUserId,
 		listensCount: item.listensCount
@@ -101,7 +105,7 @@ function toTrack(item: QueueItem): PlayerTrack {
 		id: item.id,
 		title: item.title,
 		artist: item.artist ?? '',
-		duration: 0,
+		duration: Number(item.duration) || 0,
 		explicit: item.explicit,
 		ownerUserId: item.ownerUserId,
 		listensCount: item.listensCount