From 1fae9b7d9fe97f20fc0eb1efbcd93254a7f09cd2 Mon Sep 17 00:00:00 2001
From: vicrodh <103399283+vicrodh@users.noreply.github.com>
Date: Mon, 19 Jan 2026 13:02:43 -0600
Subject: [PATCH] fix(ui): wire active state in lists

cx
---
 src/lib/components/views/FavoritesView.svelte   | 17 ++++++++++++-----
 src/lib/components/views/HomeView.svelte        |  8 +++++++-
 .../components/views/LocalLibraryView.svelte    |  9 ++++++++-
 src/routes/+page.svelte                         |  4 ++++
 4 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/src/lib/components/views/FavoritesView.svelte b/src/lib/components/views/FavoritesView.svelte
index 18959b8b8..36aa46679 100644
--- a/src/lib/components/views/FavoritesView.svelte
+++ b/src/lib/components/views/FavoritesView.svelte
@@ -205,11 +205,18 @@
 
   let showArtistGroupMenu = $state(false);
   let artistGroupingEnabled = $state(false);
-  let customIconSrc = $derived.by(() =>
-    favoritesPreferences.custom_icon_path
-      ? convertFileSrc(favoritesPreferences.custom_icon_path)
-      : null
-  );
+  function resolveCustomIconSrc(path: string | null): string | null {
+    if (!path) return null;
+    if (path.startsWith('asset://') || path.startsWith('http://asset.localhost') || path.startsWith('https://asset.localhost')) {
+      return path;
+    }
+    if (path.startsWith('file://')) {
+      return path;
+    }
+    return convertFileSrc(path);
+  }
+
+  let customIconSrc = $derived.by(() => resolveCustomIconSrc(favoritesPreferences.custom_icon_path));
 
   async function scrollToTrack(trackId: number) {
     await tick();
diff --git a/src/lib/components/views/HomeView.svelte b/src/lib/components/views/HomeView.svelte
index c0173b958..61c998f09 100644
--- a/src/lib/components/views/HomeView.svelte
+++ b/src/lib/components/views/HomeView.svelte
@@ -61,6 +61,8 @@
     downloadStateVersion?: number;
     onArtistClick?: (artistId: number) => void;
     onTrackPlay?: (track: DisplayTrack) => void;
+    activeTrackId?: number | null;
+    isPlaybackActive?: boolean;
   }
 
   let {
@@ -77,7 +79,9 @@
     checkAlbumFullyDownloaded,
     downloadStateVersion,
     onArtistClick,
-    onTrackPlay
+    onTrackPlay,
+    activeTrackId = null,
+    isPlaybackActive = false
   }: Props = $props();
 
   // Home settings state
@@ -775,6 +779,7 @@
           </div>
           <div class="track-list compact">
             {#each continueTracks as track, index}
+              {@const isActiveTrack = isPlaybackActive && activeTrackId === track.id}
               <TrackRow
                 trackId={track.id}
                 number={index + 1}
@@ -783,6 +788,7 @@
                 album={track.album}
                 duration={track.duration}
                 quality={getTrackQuality(track)}
+                isPlaying={isActiveTrack}
                 hideDownload={true}
                 compact={true}
                 onArtistClick={track.artistId && onArtistClick ? () => onArtistClick(track.artistId!) : undefined}
diff --git a/src/lib/components/views/LocalLibraryView.svelte b/src/lib/components/views/LocalLibraryView.svelte
index 5041f3abe..860d6af0a 100644
--- a/src/lib/components/views/LocalLibraryView.svelte
+++ b/src/lib/components/views/LocalLibraryView.svelte
@@ -131,6 +131,8 @@
     onTrackPlayLater?: (track: LocalTrack) => void;
     onTrackAddToPlaylist?: (trackId: number) => void;
     onSetLocalQueue?: (trackIds: number[]) => void;
+    activeTrackId?: number | null;
+    isPlaybackActive?: boolean;
   }
 
   let {
@@ -140,7 +142,9 @@
     onTrackPlayNext,
     onTrackPlayLater,
     onTrackAddToPlaylist,
-    onSetLocalQueue
+    onSetLocalQueue,
+    activeTrackId = null,
+    isPlaybackActive = false
   }: Props = $props();
 
   // View state
@@ -1499,6 +1503,7 @@
               artist={track.artist !== selectedAlbum?.artist ? track.artist : undefined}
               duration={formatDuration(track.duration_secs)}
               quality={getQualityBadge(track)}
+              isPlaying={isPlaybackActive && activeTrackId === track.id}
               isLocal={true}
               hideDownload={true}
               hideFavorite={true}
@@ -2139,6 +2144,7 @@
                             artist={track.artist}
                             duration={formatDuration(track.duration_secs)}
                             quality={getQualityBadge(track)}
+                            isPlaying={isPlaybackActive && activeTrackId === track.id}
                             isLocal={true}
                             hideDownload={true}
                             hideFavorite={true}
@@ -2162,6 +2168,7 @@
                           artist={track.artist}
                           duration={formatDuration(track.duration_secs)}
                           quality={getQualityBadge(track)}
+                          isPlaying={isPlaybackActive && activeTrackId === track.id}
                           isLocal={true}
                           hideDownload={true}
                           hideFavorite={true}
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 430a76006..0c6ea2285 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -2058,6 +2058,8 @@
             {downloadStateVersion}
             onArtistClick={handleArtistClick}
             onTrackPlay={handleDisplayTrackPlay}
+            activeTrackId={currentTrack?.id ?? null}
+            isPlaybackActive={isPlaying}
           />
         {/if}
       {:else if activeView === 'search'}
@@ -2168,6 +2170,8 @@
           onTrackAddToPlaylist={(trackId) => openAddToPlaylist([trackId], true)}
           onSetLocalQueue={handleSetLocalQueue}
           onQobuzArtistClick={handleArtistClick}
+          activeTrackId={currentTrack?.id ?? null}
+          isPlaybackActive={isPlaying}
         />
       {:else if activeView === 'playlist' && selectedPlaylistId}
         <PlaylistDetailView