From 69fa5bc733e9c12db610f6a93023a7e40a0c01d5 Mon Sep 17 00:00:00 2001
From: jeffvli <jeffvictorli@gmail.com>
Date: Wed, 3 Dec 2025 22:29:26 -0800
Subject: [PATCH] fix playlist refresh

---
 .../playlist-detail-song-list-content.tsx     | 28 ++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/src/renderer/features/playlists/components/playlist-detail-song-list-content.tsx b/src/renderer/features/playlists/components/playlist-detail-song-list-content.tsx
index 616855d46..c8ddbed00 100644
--- a/src/renderer/features/playlists/components/playlist-detail-song-list-content.tsx
+++ b/src/renderer/features/playlists/components/playlist-detail-song-list-content.tsx
@@ -1,8 +1,9 @@
-import { useSuspenseQuery } from '@tanstack/react-query';
+import { useQueryClient, useSuspenseQuery } from '@tanstack/react-query';
 import { lazy, Suspense, useEffect } from 'react';
 import { useParams } from 'react-router';
 
 import { useListContext } from '/@/renderer/context/list-context';
+import { eventEmitter } from '/@/renderer/events/event-emitter';
 import { playlistsQueries } from '/@/renderer/features/playlists/api/playlists-api';
 import { ItemListSettings, useCurrentServer, useListSettings } from '/@/renderer/store';
 import { Spinner } from '/@/shared/components/spinner/spinner';
@@ -24,6 +25,7 @@ export const PlaylistDetailSongListContent = () => {
     const { playlistId } = useParams() as { playlistId: string };
     const server = useCurrentServer();
     const { setItemCount } = useListContext();
+    const queryClient = useQueryClient();
 
     const playlistSongsQuery = useSuspenseQuery(
         playlistsQueries.songList({
@@ -43,6 +45,30 @@ export const PlaylistDetailSongListContent = () => {
         }
     }, [playlistSongsQuery.data?.totalRecordCount, setItemCount]);
 
+    useEffect(() => {
+        const handleRefresh = async (payload: { key: string }) => {
+            if (payload.key !== ItemListKey.PLAYLIST_SONG) {
+                return;
+            }
+
+            const queryKey = playlistsQueries.songList({
+                query: {
+                    id: playlistId,
+                },
+                serverId: server?.id,
+            }).queryKey;
+
+            await queryClient.invalidateQueries({ queryKey });
+            await queryClient.refetchQueries({ queryKey });
+        };
+
+        eventEmitter.on('ITEM_LIST_REFRESH', handleRefresh);
+
+        return () => {
+            eventEmitter.off('ITEM_LIST_REFRESH', handleRefresh);
+        };
+    }, [playlistId, queryClient, server.id]);
+
     return (
         <Suspense fallback={<Spinner container />}>
             <PlaylistDetailSongListView