From e8bb2a4326b1542eb1eb75ae2dd7277afef89cb2 Mon Sep 17 00:00:00 2001
From: Geert Rademakes <g26107@eon.com>
Date: Wed, 6 Aug 2025 10:43:18 +0200
Subject: [PATCH] fix: Restore playlist switching functionality - Add
 previousPlaylistRef to properly detect playlist changes - Fix playlist change
 detection logic that was broken by ref updates - Ensure playlist switching
 works while maintaining infinite scroll fix

---
 .../frontend/src/hooks/usePaginatedSongs.ts   | 38 ++++++++-----------
 1 file changed, 16 insertions(+), 22 deletions(-)

diff --git a/packages/frontend/src/hooks/usePaginatedSongs.ts b/packages/frontend/src/hooks/usePaginatedSongs.ts
index 620206e..93fad38 100644
--- a/packages/frontend/src/hooks/usePaginatedSongs.ts
+++ b/packages/frontend/src/hooks/usePaginatedSongs.ts
@@ -24,6 +24,7 @@ export const usePaginatedSongs = (options: UsePaginatedSongsOptions = {}) => {
   const loadingRef = useRef(false);
   const currentPlaylistRef = useRef(playlistName);
   const currentSearchQueryRef = useRef(searchQuery);
+  const previousPlaylistRef = useRef(playlistName);
   const abortControllerRef = useRef<AbortController | null>(null);
 
   // Cleanup function to prevent memory leaks
@@ -134,31 +135,24 @@ export const usePaginatedSongs = (options: UsePaginatedSongsOptions = {}) => {
     };
   }, []);
 
-  // Update refs when values change
-  useEffect(() => {
-    currentPlaylistRef.current = playlistName;
-  }, [playlistName]);
-
-  useEffect(() => {
-    currentSearchQueryRef.current = searchQuery;
-  }, [searchQuery]);
-
   // Handle playlist changes
   useEffect(() => {
-    if (currentPlaylistRef.current !== playlistName) {
+    if (!isInitialLoad && previousPlaylistRef.current !== playlistName) {
+      // Update refs
       currentPlaylistRef.current = playlistName;
-      if (!isInitialLoad) {
-        // Clear songs for new playlist to replace them
-        setSongs([]);
-        setHasMore(true);
-        setCurrentPage(1);
-        setSearchQuery(initialSearch);
-        setError(null);
-        // Use setTimeout to avoid the dependency issue
-        setTimeout(() => {
-          loadPage(1, initialSearch, playlistName);
-        }, 0);
-      }
+      currentSearchQueryRef.current = searchQuery;
+      previousPlaylistRef.current = playlistName;
+      
+      // Clear songs for new playlist to replace them
+      setSongs([]);
+      setHasMore(true);
+      setCurrentPage(1);
+      setSearchQuery(initialSearch);
+      setError(null);
+      // Use setTimeout to avoid the dependency issue
+      setTimeout(() => {
+        loadPage(1, initialSearch, playlistName);
+      }, 0);
     }
   }, [playlistName, isInitialLoad, initialSearch, loadPage]);