Refresh playlist list on delete (#134)

src/renderer/components/virtual-grid/grid-card/default-card.tsx

@@ -22,6 +22,7 @@ interface BaseGridCardProps {
         handlePlayQueueAdd: (options: PlayQueueAddOptions) => void;
         itemType: LibraryItem;
         playButtonBehavior: Play;
+        resetInfiniteLoaderCache: () => void;
         route: CardRoute;
     };
     data: any;
@@ -202,6 +203,7 @@ export const DefaultCard = ({
                             handlePlayQueueAdd={controls.handlePlayQueueAdd}
                             itemData={data}
                             itemType={controls.itemType}
+                            resetInfiniteLoaderCache={controls.resetInfiniteLoaderCache}
                         />
                     </ImageContainer>
                     <DetailContainer>

src/renderer/components/virtual-grid/grid-card/grid-card-controls.tsx

@@ -7,7 +7,7 @@ import type { PlayQueueAddOptions } from '/@/renderer/types';
 import { Play } from '/@/renderer/types';
 import { usePlayButtonBehavior } from '/@/renderer/store/settings.store';
 import { LibraryItem } from '/@/renderer/api/types';
-import { useHandleGeneralContextMenu } from '/@/renderer/features/context-menu/hooks/use-handle-context-menu';
+import { useHandleGridContextMenu } from '/@/renderer/features/context-menu/hooks/use-handle-context-menu';
 import {
     PLAYLIST_CONTEXT_MENU_ITEMS,
     ALBUM_CONTEXT_MENU_ITEMS,
@@ -112,6 +112,7 @@ export const GridCardControls = ({
     itemType,
     handlePlayQueueAdd,
     handleFavorite,
+    resetInfiniteLoaderCache,
 }: {
     handleFavorite: (options: {
         id: string[];
@@ -122,6 +123,7 @@ export const GridCardControls = ({
     handlePlayQueueAdd?: (options: PlayQueueAddOptions) => void;
     itemData: any;
     itemType: LibraryItem;
+    resetInfiniteLoaderCache: () => void;
 }) => {
     const [isFavorite, setIsFavorite] = useState(itemData?.userFavorite);
     const playButtonBehavior = usePlayButtonBehavior();
@@ -153,13 +155,14 @@ export const GridCardControls = ({
         setIsFavorite(!isFavorite);
     };
 
-    const handleContextMenu = useHandleGeneralContextMenu(
+    const handleContextMenu = useHandleGridContextMenu(
         itemType,
         itemType === LibraryItem.ALBUM
             ? ALBUM_CONTEXT_MENU_ITEMS
             : itemType === LibraryItem.PLAYLIST
             ? PLAYLIST_CONTEXT_MENU_ITEMS
             : ARTIST_CONTEXT_MENU_ITEMS,
+        resetInfiniteLoaderCache,
     );
 
     return (

src/renderer/components/virtual-grid/grid-card/index.tsx

@@ -17,8 +17,11 @@ export const GridCard = memo(({ data, index, style }: ListChildComponentProps) =
         handleFavorite,
         route,
         display,
+        resetInfiniteLoaderCache,
     } = data as GridCardData;
 
+    console.log('data', data);
+
     const cards = [];
     const startIndex = index * columnCount;
     const stopIndex = Math.min(itemCount - 1, startIndex + columnCount - 1);
@@ -41,6 +44,7 @@ export const GridCard = memo(({ data, index, style }: ListChildComponentProps) =
                     handlePlayQueueAdd,
                     itemType,
                     playButtonBehavior,
+                    resetInfiniteLoaderCache,
                     route,
                 }}
                 data={itemData[i]}

src/renderer/components/virtual-grid/grid-card/poster-card.tsx

@@ -22,6 +22,7 @@ interface BaseGridCardProps {
         handlePlayQueueAdd: (options: PlayQueueAddOptions) => void;
         itemType: LibraryItem;
         playButtonBehavior: Play;
+        resetInfiniteLoaderCache: () => void;
         route: CardRoute;
     };
     data: any;
@@ -186,6 +187,7 @@ export const PosterCard = ({
                             handlePlayQueueAdd={controls.handlePlayQueueAdd}
                             itemData={data}
                             itemType={controls.itemType}
+                            resetInfiniteLoaderCache={controls.resetInfiniteLoaderCache}
                         />
                     </ImageContainer>
                 </LinkContainer>

src/renderer/components/virtual-grid/virtual-grid-wrapper.tsx

@@ -22,6 +22,7 @@ const createItemData = memoize(
         route,
         handlePlayQueueAdd,
         handleFavorite,
+        resetInfiniteLoaderCache,
     ) => ({
         cardRows,
         columnCount,
@@ -34,6 +35,7 @@ const createItemData = memoize(
         itemHeight,
         itemType,
         itemWidth,
+        resetInfiniteLoaderCache,
         route,
     }),
 );
@@ -59,6 +61,7 @@ export const VirtualGridWrapper = ({
     onScroll,
     height,
     width,
+    resetInfiniteLoaderCache,
     ...rest
 }: Omit<FixedSizeListProps, 'ref' | 'itemSize' | 'children' | 'height' | 'width'> & {
     cardRows: CardRow<Album | AlbumArtist | Artist>[];
@@ -77,6 +80,7 @@ export const VirtualGridWrapper = ({
     itemType: LibraryItem;
     itemWidth: number;
     refInstance: Ref<any>;
+    resetInfiniteLoaderCache: () => void;
     route?: CardRoute;
     rowCount: number;
     width?: number;
@@ -94,6 +98,7 @@ export const VirtualGridWrapper = ({
         route,
         handlePlayQueueAdd,
         handleFavorite,
+        resetInfiniteLoaderCache,
     );
 
     const memoizedOnScroll = createScrollHandler(onScroll);

src/renderer/components/virtual-grid/virtual-infinite-grid.tsx

@@ -166,6 +166,12 @@ export const VirtualInfiniteGrid = forwardRef(
                                 infiniteLoaderRef(list);
                                 listRef.current = list;
                             }}
+                            resetInfiniteLoaderCache={() => {
+                                if (loader.current) {
+                                    loader.current.resetloadMoreItemsCache(false);
+                                    setItemData([]);
+                                }
+                            }}
                             route={route}
                             rowCount={rowCount}
                             width={width}