From cc1f6b87e43adca164a07a8f8b3694697a648cf1 Mon Sep 17 00:00:00 2001
From: Admin <admin@kalekber.cc>
Date: Sun, 5 Apr 2026 23:26:33 +0500
Subject: [PATCH] fix(player): show '--:--' for unknown duration instead of
 '0:00'

Prevents the silly "2:01 / 0:00" display when audio src is being swapped
from preview to full audio and duration hasn't loaded yet.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 ui/src/lib/components/AudioPlayer.svelte | 9 +++++++--
 ui/src/routes/+layout.svelte             | 7 ++++++-
 2 files changed, 13 insertions(+), 3 deletions(-)

diff --git a/ui/src/lib/components/AudioPlayer.svelte b/ui/src/lib/components/AudioPlayer.svelte
index 5ae2aa8..d94d02e 100644
--- a/ui/src/lib/components/AudioPlayer.svelte
+++ b/ui/src/lib/components/AudioPlayer.svelte
@@ -787,6 +787,11 @@
 		}
 	}
 
+	function formatDuration(s: number): string {
+		if (!isFinite(s) || s <= 0) return '--:--';
+		return formatTime(s);
+	}
+
 	function formatTime(s: number): string {
 		if (!isFinite(s) || s < 0) return '0:00';
 		const m = Math.floor(s / 60);
@@ -990,7 +995,7 @@
 					</button>
 					<!-- Time display -->
 					<span class="flex-1 text-xs text-center tabular-nums text-(--color-muted)">
-						{formatTime(audioStore.currentTime)} / {formatTime(audioStore.duration)}
+						{formatTime(audioStore.currentTime)} / {formatDuration(audioStore.duration)}
 					</span>
 					<!-- Speed cycle -->
 					<button
@@ -1163,7 +1168,7 @@
 					<span>{m.reader_paused()}</span>
 				{/if}
 					<span class="tabular-nums text-(--color-muted) opacity-60">
-						{formatTime(audioStore.currentTime)} / {formatTime(audioStore.duration)}
+						{formatTime(audioStore.currentTime)} / {formatDuration(audioStore.duration)}
 					</span>
 				</div>
 			</div>
diff --git a/ui/src/routes/+layout.svelte b/ui/src/routes/+layout.svelte
index fcf58ff..ee78740 100644
--- a/ui/src/routes/+layout.svelte
+++ b/ui/src/routes/+layout.svelte
@@ -268,6 +268,11 @@
 		}, 2000) as unknown as number;
 	}
 
+	function formatDuration(s: number): string {
+		if (!isFinite(s) || s <= 0) return '--:--';
+		return formatTime(s);
+	}
+
 	function formatTime(s: number): string {
 		if (!isFinite(s) || s < 0) return '0:00';
 		const m = Math.floor(s / 60);
@@ -872,7 +877,7 @@
 					</p>
 				{:else if audioStore.status === 'ready'}
 					<p class="text-xs text-(--color-muted) tabular-nums leading-tight flex items-center gap-1.5">
-						{formatTime(audioStore.currentTime)} / {formatTime(audioStore.duration)}
+						{formatTime(audioStore.currentTime)} / {formatDuration(audioStore.duration)}
 						{#if audioStore.isPreview}
 							<span class="px-1 py-0.5 rounded text-[10px] font-medium bg-(--color-brand)/15 text-(--color-brand) leading-none">preview</span>
 						{/if}