Merge pull request #314 from Psychotoxical/fix/queue-preserve-context-on-manual-click

fix(queue): preserve scroll context on manual queue click

src/components/QueuePanel.tsx

@@ -297,6 +297,12 @@ function QueuePanelHostOrSolo() {
   const enqueueAt = usePlayerStore(s => s.enqueueAt);
   const contextMenu = usePlayerStore(s => s.contextMenu);
 
+  // When the user picks a track *from* the queue list, suppress the
+  // upcoming auto-scroll so their click target stays in view instead of
+  // the list rebasing onto the next track. Auto-advance (natural playback)
+  // never sets this flag, so it keeps its original "show what's next" behavior.
+  const suppressNextAutoScrollRef = useRef(false);
+
   const playbackSource = usePlayerStore(s => s.currentPlaybackSource);
 
   const crossfadeEnabled = useAuthStore(s => s.crossfadeEnabled);
@@ -407,6 +413,10 @@ function QueuePanelHostOrSolo() {
   }, [enqueueAt]);
 
   useEffect(function queueAutoScroll() {
+    if (suppressNextAutoScrollRef.current) {
+      suppressNextAutoScrollRef.current = false;
+      return;
+    }
     if (!queueListRef.current || queueIndex < 0) return;
     if (activeTab !== 'queue') return;
     const songs = queueListRef.current!.querySelectorAll<HTMLElement>('[data-queue-idx]');
@@ -741,7 +751,10 @@ function QueuePanelHostOrSolo() {
               <div
                 data-queue-idx={idx}
                 className={`queue-item ${isPlaying ? 'active' : ''} ${contextMenu.isOpen && contextMenu.type === 'queue-item' && contextMenu.queueIndex === idx ? 'context-active' : ''}`}
-                onClick={() => playTrack(track, queue)}
+                onClick={() => {
+                  suppressNextAutoScrollRef.current = true;
+                  playTrack(track, queue);
+                }}
                 onContextMenu={(e) => {
                   e.preventDefault();
                   usePlayerStore.getState().openContextMenu(e.clientX, e.clientY, track, 'queue-item', idx);