[slightly less scuffed bugfix]: Update table rating/favorite when updated anywhere …

src/renderer/components/virtual-table/index.tsx

@@ -42,6 +42,8 @@ import { NoteCell } from '/@/renderer/components/virtual-table/cells/note-cell';
 import { RowIndexCell } from '/@/renderer/components/virtual-table/cells/row-index-cell';
 import i18n from '/@/i18n/i18n';
 import { formatDateAbsolute, formatDateRelative, formatSizeString } from '/@/renderer/utils/format';
+import { useTableFavoriteChange } from '/@/renderer/hooks/use-favorite-change';
+import { useTableRatingChange } from '/@/renderer/hooks/use-rating-change';
 
 export * from './table-config-dropdown';
 export * from './table-pagination';
@@ -475,6 +477,7 @@ export interface VirtualTableProps extends AgGridReactProps {
         pagination: TablePaginationType;
         setPagination: any;
     };
+    shouldUpdateSong?: boolean;
     stickyHeader?: boolean;
     transparentHeader?: boolean;
 }
@@ -492,6 +495,7 @@ export const VirtualTable = forwardRef(
             onGridReady,
             onGridSizeChanged,
             paginationProps,
+            shouldUpdateSong,
             ...rest
         }: VirtualTableProps,
         ref: Ref<AgGridReactType | null>,
@@ -506,6 +510,9 @@ export const VirtualTable = forwardRef(
             }
         });
 
+        useTableFavoriteChange(tableRef, shouldUpdateSong || false);
+        useTableRatingChange(tableRef, shouldUpdateSong || false);
+
         const defaultColumnDefs: ColDef = useMemo(() => {
             return {
                 lockPinned: true,

src/renderer/features/albums/components/album-detail-content.tsx

@@ -452,6 +452,7 @@ export const AlbumDetailContent = ({ tableRef, background }: AlbumDetailContentP
                         key={`table-${tableConfig.rowHeight}`}
                         ref={tableRef}
                         autoHeight
+                        shouldUpdateSong
                         stickyHeader
                         suppressCellFocus
                         suppressLoadingOverlay

src/renderer/features/artists/components/album-artist-detail-content.tsx

@@ -523,14 +523,15 @@ export const AlbumArtistDetailContent = ({ background }: AlbumArtistDetailConten
                             autoFitColumns
                             autoHeight
                             deselectOnClickOutside
+                            shouldUpdateSong
                             stickyHeader
                             suppressCellFocus
                             suppressHorizontalScroll
                             suppressLoadingOverlay
                             suppressRowDrag
                             columnDefs={topSongsColumnDefs}
                             enableCellChangeFlash={false}
-                            getRowId={(data) => data.data.uniqueId}
+                            getRowId={(data) => data.data.id}
                             rowData={topSongs}
                             rowHeight={60}
                             rowSelection="multiple"

src/renderer/features/artists/components/album-artist-detail-top-songs-list-content.tsx

@@ -64,8 +64,9 @@ export const AlbumArtistDetailTopSongsListContent = ({
                 <VirtualTable
                     key={`table-${tableProps.rowHeight}-${server?.id}`}
                     ref={tableRef}
+                    shouldUpdateSong
                     {...tableProps}
-                    getRowId={(data) => data.data.uniqueId}
+                    getRowId={(data) => data.data.id}
                     rowClassRules={rowClassRules}
                     rowData={data}
                     rowModelType="clientSide"

src/renderer/features/playlists/components/playlist-detail-content.tsx

@@ -215,6 +215,7 @@ export const PlaylistDetailContent = ({ tableRef }: PlaylistDetailContentProps)
                     autoFitColumns
                     autoHeight
                     deselectOnClickOutside
+                    shouldUpdateSong
                     stickyHeader
                     suppressCellFocus
                     suppressHorizontalScroll

src/renderer/features/playlists/components/playlist-detail-song-list-content.tsx

@@ -240,6 +240,7 @@ export const PlaylistDetailSongListContent = ({ tableRef }: PlaylistDetailConten
                     key={`table-${page.display}-${page.table.rowHeight}-${server?.id}`}
                     ref={tableRef}
                     alwaysShowHorizontalScroll
+                    shouldUpdateSong
                     autoFitColumns={page.table.autoFit}
                     columnDefs={columnDefs}
                     context={{
@@ -248,7 +249,7 @@ export const PlaylistDetailSongListContent = ({ tableRef }: PlaylistDetailConten
                         onCellContextMenu: handleContextMenu,
                         status,
                     }}
-                    getRowId={(data) => data.data.uniqueId}
+                    getRowId={(data) => data.data.id}
                     infiniteInitialRowCount={checkPlaylistList.data?.totalRecordCount || 100}
                     pagination={isPaginationEnabled}
                     paginationAutoPageSize={isPaginationEnabled}

src/renderer/features/search/components/search-content.tsx

@@ -101,6 +101,7 @@ export const SearchContent = ({ tableRef }: SearchContentProps) => {
                 getRowId={(data) => data.data.id}
                 infiniteInitialRowCount={25}
                 rowClassRules={rowClassRules}
+                shouldUpdateSong={itemType === LibraryItem.SONG}
                 onRowDoubleClicked={handleRowDoubleClick}
             />
         </VirtualGridAutoSizerContainer>

src/renderer/features/similar-songs/components/similar-songs-list.tsx

@@ -61,6 +61,7 @@ export const SimilarSongsList = ({ count, fullScreen, song }: SimilarSongsListPr
             <VirtualGridAutoSizerContainer>
                 <VirtualTable
                     ref={tableRef}
+                    shouldUpdateSong
                     autoFitColumns={tableConfig.autoFit}
                     columnDefs={columnDefs}
                     context={{
@@ -69,7 +70,7 @@ export const SimilarSongsList = ({ count, fullScreen, song }: SimilarSongsListPr
                         song,
                     }}
                     deselectOnClickOutside={fullScreen}
-                    getRowId={(data) => data.data.uniqueId}
+                    getRowId={(data) => data.data.id}
                     rowBuffer={50}
                     rowData={songQuery.data ?? []}
                     rowHeight={tableConfig.rowHeight || 40}

src/renderer/features/songs/components/song-list-table-view.tsx

@@ -56,6 +56,7 @@ export const SongListTableView = ({ tableRef, itemCount }: SongListTableViewProp
                 key={`table-${tableProps.rowHeight}-${server?.id}`}
                 ref={tableRef}
                 {...tableProps}
+                shouldUpdateSong
                 context={{
                     ...tableProps.context,
                     currentSong,

src/renderer/hooks/use-favorite-change.ts

@@ -0,0 +1,43 @@
+import { MutableRefObject, useCallback, useEffect } from 'react';
+import { usePlayerStore } from '/@/renderer/store';
+import type { AgGridReact } from '@ag-grid-community/react';
+
+export const useFavoriteChange = (
+    handler: (ids: string[], favorite: boolean) => void,
+    enabled: boolean,
+) => {
+    useEffect(() => {
+        if (!enabled) return () => {};
+
+        const unSubChange = usePlayerStore.subscribe(
+            (state) => state.favorite,
+            (value) => value && handler(value.ids, value.favorite),
+        );
+
+        return () => {
+            unSubChange();
+        };
+    }, [handler, enabled]);
+};
+
+export const useTableFavoriteChange = (
+    tableRef: MutableRefObject<AgGridReact | null>,
+    enabled: boolean,
+) => {
+    const handler = useCallback(
+        (ids: string[], favorite: boolean) => {
+            const api = tableRef.current?.api;
+            if (api) {
+                for (const id of ids) {
+                    const node = api.getRowNode(id);
+                    if (node && node.data.userFavorite !== favorite) {
+                        node.setDataValue('userFavorite', favorite);
+                    }
+                }
+            }
+        },
+        [tableRef],
+    );
+
+    useFavoriteChange(handler, enabled);
+};

src/renderer/hooks/use-rating-change.ts

@@ -0,0 +1,44 @@
+import { MutableRefObject, useCallback, useEffect } from 'react';
+import { usePlayerStore } from '/@/renderer/store';
+import type { AgGridReact } from '@ag-grid-community/react';
+
+export const useRatingChange = (
+    handler: (ids: string[], rating: number | null) => void,
+    enabled: boolean,
+) => {
+    useEffect(() => {
+        if (!enabled) return () => {};
+
+        const unSubChange = usePlayerStore.subscribe(
+            (state) => state.rating,
+            (value) => value && handler(value.ids, value.rating),
+        );
+
+        return () => {
+            unSubChange();
+        };
+    }, [enabled, handler]);
+};
+
+export const useTableRatingChange = (
+    tableRef: MutableRefObject<AgGridReact | null>,
+    enabled: boolean,
+) => {
+    const handler = useCallback(
+        (ids: string[], rating: number | null) => {
+            const api = tableRef.current?.api;
+            if (api) {
+                for (const id of ids) {
+                    const node = api.getRowNode(id);
+                    if (node && node.data.userRating !== rating) {
+                        node.setDataValue('userRating', rating);
+                        api.redrawRows({ rowNodes: [node] });
+                    }
+                }
+            }
+        },
+        [tableRef],
+    );
+
+    useRatingChange(handler, enabled);
+};

src/renderer/store/player.store.ts

@@ -23,13 +23,21 @@ export interface PlayerState {
         time: number;
     };
     fallback: boolean | null;
+    favorite?: {
+        favorite: boolean;
+        ids: string[];
+    };
     muted: boolean;
     queue: {
         default: QueueSong[];
         previousNode?: QueueSong;
         shuffled: string[];
         sorted: QueueSong[];
     };
+    rating?: {
+        ids: string[];
+        rating: number | null;
+    };
     repeat: PlayerRepeat;
     shuffle: PlayerShuffle;
     volume: number;
@@ -847,6 +855,13 @@ export const usePlayerStore = create<PlayerSlice>()(
                                 });
                             }
 
+                            set((state) => {
+                                state.favorite = {
+                                    favorite,
+                                    ids,
+                                };
+                            });
+
                             return foundUniqueIds;
                         },
                         setMuted: (muted: boolean) => {
@@ -877,6 +892,10 @@ export const usePlayerStore = create<PlayerSlice>()(
                                 });
                             }
 
+                            set((state) => {
+                                state.rating = { ids, rating };
+                            });
+
                             return foundUniqueIds;
                         },
                         setRepeat: (type: PlayerRepeat) => {