optimize rating/favorite to prevent blocking UI

This commit is contained in:
jeffvli
2026-01-21 01:38:11 -08:00
parent b7cbb3055a
commit 0492b867aa
2 changed files with 1303 additions and 1063 deletions
File diff suppressed because it is too large Load Diff
@@ -18,12 +18,69 @@ import {
TopSongListResponse, TopSongListResponse,
} from '/@/shared/types/domain-types'; } from '/@/shared/types/domain-types';
interface PendingUpdate {
previousData: unknown;
queryKey: readonly unknown[];
updater: (prev: any) => any;
}
function collectAndApplyUpdates(
queryClient: QueryClient,
pendingUpdates: PendingUpdate[],
): PreviousQueryData[] {
const previousQueries: PreviousQueryData[] = [];
// Batch all updates together - React Query will batch these internally
pendingUpdates.forEach(({ previousData, queryKey, updater }) => {
previousQueries.push({ data: previousData, queryKey });
queryClient.setQueryData(queryKey, updater);
});
return previousQueries;
}
function updateItemInArray<T extends { id: string }>(
items: T[],
itemIdSet: Set<string>,
updater: (item: T) => T,
): null | T[] {
let hasChanges = false;
const updatedItems = items.map((item) => {
if (itemIdSet.has(item.id)) {
hasChanges = true;
return updater(item);
}
return item;
});
return hasChanges ? updatedItems : null;
}
function updateItemsInPages<T extends { id: string }, P extends { items: T[] }>(
pages: P[],
itemIdSet: Set<string>,
updater: (item: T) => T,
): null | P[] {
let hasChanges = false;
const updatedPages = pages.map((page) => {
if (!page) return page;
const updatedItems = updateItemInArray(page.items, itemIdSet, updater);
if (updatedItems) {
hasChanges = true;
return { ...page, items: updatedItems };
}
return page;
});
return hasChanges ? updatedPages : null;
}
export const applyRatingOptimisticUpdates = ( export const applyRatingOptimisticUpdates = (
queryClient: QueryClient, queryClient: QueryClient,
variables: SetRatingArgs, variables: SetRatingArgs,
rating: number, rating: number,
): PreviousQueryData[] => { ): PreviousQueryData[] => {
const previousQueries: PreviousQueryData[] = []; const pendingUpdates: PendingUpdate[] = [];
const itemIdSet = new Set<string>(); const itemIdSet = new Set<string>();
if (Array.isArray(variables.query.id)) { if (Array.isArray(variables.query.id)) {
@@ -34,91 +91,83 @@ export const applyRatingOptimisticUpdates = (
itemIdSet.add(variables.query.id); itemIdSet.add(variables.query.id);
} }
const createRatingUpdater = <T extends { userRating?: null | number }>(item: T): T => ({
...item,
userRating: rating,
});
switch (variables.query.type) { switch (variables.query.type) {
case LibraryItem.ALBUM: { case LibraryItem.ALBUM: {
const detailQueryKey = queryKeys.albums.detail(variables.apiClientProps.serverId); const detailQueryKey = queryKeys.albums.detail(variables.apiClientProps.serverId);
const detailQueries = queryClient.getQueriesData({ const detailQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: detailQueryKey, queryKey: detailQueryKey,
}); });
if (detailQueries.length) {
detailQueries.forEach(([queryKey, data]) => { detailQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: AlbumDetailResponse | undefined) => { updater: (prev: AlbumDetailResponse | undefined) => {
if (prev && itemIdSet.has(prev.id)) { if (prev && itemIdSet.has(prev.id)) {
return { ...prev, userRating: rating }; return { ...prev, userRating: rating };
} }
return prev; return prev;
}, },
);
}
}); });
} }
});
const listQueryKey = queryKeys.albums.list(variables.apiClientProps.serverId); const listQueryKey = queryKeys.albums.list(variables.apiClientProps.serverId);
const listQueries = queryClient.getQueriesData({ const listQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: listQueryKey, queryKey: listQueryKey,
}); });
if (listQueries.length) {
listQueries.forEach(([queryKey, data]) => { listQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData(queryKey, (prev: AlbumListResponse) => { previousData: data,
return { queryKey,
...prev, updater: (prev: AlbumListResponse | undefined) => {
items: prev.items.map((item: Album) => { if (!prev) return prev;
return itemIdSet.has(item.id) const updatedItems = updateItemInArray(prev.items, itemIdSet, (item) =>
? { ...item, userRating: rating } createRatingUpdater<Album>(item),
: item; );
}), return updatedItems ? { ...prev, items: updatedItems } : prev;
}; },
}); });
} }
}); });
}
const infiniteListQueryKey = queryKeys.albums.infiniteList( const infiniteListQueryKey = queryKeys.albums.infiniteList(
variables.apiClientProps.serverId, variables.apiClientProps.serverId,
); );
const infiniteListQueries = queryClient.getQueriesData({ const infiniteListQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: infiniteListQueryKey, queryKey: infiniteListQueryKey,
}); });
if (infiniteListQueries.length) {
infiniteListQueries.forEach(([queryKey, data]) => { infiniteListQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: { pageParams: string[]; pages: AlbumListResponse[] }) => { updater: (
return { prev: undefined | { pageParams: string[]; pages: AlbumListResponse[] },
...prev, ) => {
pages: prev.pages.map((page: AlbumListResponse) => { if (!prev) return prev;
return { const updatedPages = updateItemsInPages<Album, AlbumListResponse>(
...page, prev.pages.filter((p): p is AlbumListResponse => !!p),
items: page.items.map((item: Album) => { itemIdSet,
return itemIdSet.has(item.id) (item) => createRatingUpdater<Album>(item),
? { ...item, userRating: rating }
: item;
}),
};
}),
};
},
); );
} return updatedPages ? { ...prev, pages: updatedPages } : prev;
},
}); });
} }
});
// Update infinite loader custom query keys // Update infinite loader custom query keys
const infiniteLoaderQueryKey = [ const infiniteLoaderQueryKey = [
@@ -132,13 +181,12 @@ export const applyRatingOptimisticUpdates = (
queryKey: infiniteLoaderQueryKey, queryKey: infiniteLoaderQueryKey,
}); });
if (infiniteLoaderQueries.length) {
infiniteLoaderQueries.forEach(([queryKey, data]) => { infiniteLoaderQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
( updater: (
prev: prev:
| undefined | undefined
| { | {
@@ -147,54 +195,40 @@ export const applyRatingOptimisticUpdates = (
}, },
) => { ) => {
if (prev && prev.data) { if (prev && prev.data) {
return { const updatedData = updateItemInArray(
...prev, prev.data as Array<{ id: string; userRating?: null | number }>,
data: prev.data.map((item: any) => { itemIdSet,
if (!item || !item.id) { (item) => createRatingUpdater(item),
return item; );
return updatedData ? { ...prev, data: updatedData } : prev;
} }
return itemIdSet.has(item.id)
? { ...item, userRating: rating }
: item;
}),
};
}
return prev; return prev;
}, },
);
}
}); });
} }
});
break; break;
} }
case LibraryItem.ALBUM_ARTIST: { case LibraryItem.ALBUM_ARTIST: {
const detailQueryKey = queryKeys.albumArtists.detail(variables.apiClientProps.serverId); const detailQueryKey = queryKeys.albumArtists.detail(variables.apiClientProps.serverId);
const detailQueries = queryClient.getQueriesData({ const detailQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: detailQueryKey, queryKey: detailQueryKey,
}); });
if (detailQueries.length) {
detailQueries.forEach(([queryKey, data]) => { detailQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: AlbumArtistDetailResponse | undefined) => { updater: (prev: AlbumArtistDetailResponse | undefined) => {
if (!prev) { if (!prev) return prev;
return prev;
}
// Update the main artist if it matches
if (itemIdSet.has(prev.id)) { if (itemIdSet.has(prev.id)) {
return { ...prev, userRating: rating }; return { ...prev, userRating: rating };
} }
// Update similar artists if any match
if (prev.similarArtists && prev.similarArtists.length > 0) { if (prev.similarArtists && prev.similarArtists.length > 0) {
const hasMatchingSimilarArtist = prev.similarArtists.some( const hasMatchingSimilarArtist = prev.similarArtists.some(
(artist) => itemIdSet.has(artist.id), (artist) => itemIdSet.has(artist.id),
@@ -214,35 +248,31 @@ export const applyRatingOptimisticUpdates = (
return prev; return prev;
}, },
);
}
}); });
} }
});
const listQueryKey = queryKeys.albumArtists.list(variables.apiClientProps.serverId); const listQueryKey = queryKeys.albumArtists.list(variables.apiClientProps.serverId);
const listQueries = queryClient.getQueriesData({ const listQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: listQueryKey, queryKey: listQueryKey,
}); });
if (listQueries.length) {
listQueries.forEach(([queryKey, data]) => { listQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData(queryKey, (prev: AlbumArtistListResponse) => { previousData: data,
return { queryKey,
...prev, updater: (prev: AlbumArtistListResponse | undefined) => {
items: prev.items.map((item: AlbumArtist) => { if (!prev) return prev;
return itemIdSet.has(item.id) const updatedItems = updateItemInArray(prev.items, itemIdSet, (item) =>
? { ...item, userRating: rating } createRatingUpdater<AlbumArtist>(item),
: item; );
}), return updatedItems ? { ...prev, items: updatedItems } : prev;
}; },
}); });
} }
}); });
}
const infiniteListQueryKey = queryKeys.albumArtists.infiniteList( const infiniteListQueryKey = queryKeys.albumArtists.infiniteList(
variables.apiClientProps.serverId, variables.apiClientProps.serverId,
@@ -252,31 +282,30 @@ export const applyRatingOptimisticUpdates = (
queryKey: infiniteListQueryKey, queryKey: infiniteListQueryKey,
}); });
if (infiniteListQueries.length) {
infiniteListQueries.forEach(([queryKey, data]) => { infiniteListQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: { pageParams: string[]; pages: AlbumArtistListResponse[] }) => { updater: (
return { prev:
...prev, | undefined
pages: prev.pages.map((page: AlbumArtistListResponse) => { | { pageParams: string[]; pages: AlbumArtistListResponse[] },
return { ) => {
...page, if (!prev) return prev;
items: page.items.map((item: AlbumArtist) => { const updatedPages = updateItemsInPages<
return itemIdSet.has(item.id) AlbumArtist,
? { ...item, userRating: rating } AlbumArtistListResponse
: item; >(
}), prev.pages.filter((p): p is AlbumArtistListResponse => !!p),
}; itemIdSet,
}), (item) => createRatingUpdater<AlbumArtist>(item),
};
},
); );
} return updatedPages ? { ...prev, pages: updatedPages } : prev;
},
}); });
} }
});
// Update infinite loader custom query keys // Update infinite loader custom query keys
const infiniteLoaderQueryKey = [ const infiniteLoaderQueryKey = [
@@ -290,13 +319,12 @@ export const applyRatingOptimisticUpdates = (
queryKey: infiniteLoaderQueryKey, queryKey: infiniteLoaderQueryKey,
}); });
if (infiniteLoaderQueries.length) {
infiniteLoaderQueries.forEach(([queryKey, data]) => { infiniteLoaderQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
( updater: (
prev: prev:
| undefined | undefined
| { | {
@@ -305,54 +333,43 @@ export const applyRatingOptimisticUpdates = (
}, },
) => { ) => {
if (prev && prev.data) { if (prev && prev.data) {
return { const updatedData = updateItemInArray(
...prev, prev.data as Array<{ id: string; userRating?: null | number }>,
data: prev.data.map((item: any) => { itemIdSet,
if (!item || !item.id) { (item) => createRatingUpdater(item),
return item; );
return updatedData ? { ...prev, data: updatedData } : prev;
} }
return itemIdSet.has(item.id)
? { ...item, userRating: rating }
: item;
}),
};
}
return prev; return prev;
}, },
);
}
}); });
} }
});
break; break;
} }
case LibraryItem.ARTIST: { case LibraryItem.ARTIST: {
const listQueryKey = queryKeys.artists.list(variables.apiClientProps.serverId); const listQueryKey = queryKeys.artists.list(variables.apiClientProps.serverId);
const listQueries = queryClient.getQueriesData({ const listQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: listQueryKey, queryKey: listQueryKey,
}); });
if (listQueries.length) {
listQueries.forEach(([queryKey, data]) => { listQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData(queryKey, (prev: ArtistListResponse) => { previousData: data,
return { queryKey,
...prev, updater: (prev: ArtistListResponse | undefined) => {
items: prev.items.map((item: AlbumArtist) => { if (!prev) return prev;
return itemIdSet.has(item.id) const updatedItems = updateItemInArray(prev.items, itemIdSet, (item) =>
? { ...item, userRating: rating } createRatingUpdater<AlbumArtist>(item),
: item; );
}), return updatedItems ? { ...prev, items: updatedItems } : prev;
}; },
}); });
} }
}); });
}
const infiniteListQueryKey = queryKeys.artists.infiniteList( const infiniteListQueryKey = queryKeys.artists.infiniteList(
variables.apiClientProps.serverId, variables.apiClientProps.serverId,
@@ -362,31 +379,28 @@ export const applyRatingOptimisticUpdates = (
queryKey: infiniteListQueryKey, queryKey: infiniteListQueryKey,
}); });
if (infiniteListQueries.length) {
infiniteListQueries.forEach(([queryKey, data]) => { infiniteListQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: { pageParams: string[]; pages: ArtistListResponse[] }) => { updater: (
return { prev: undefined | { pageParams: string[]; pages: ArtistListResponse[] },
...prev, ) => {
pages: prev.pages.map((page: ArtistListResponse) => { if (!prev) return prev;
return { const updatedPages = updateItemsInPages<
...page, AlbumArtist,
items: page.items.map((item: AlbumArtist) => { AlbumArtistListResponse
return itemIdSet.has(item.id) >(
? { ...item, userRating: rating } prev.pages.filter((p): p is AlbumArtistListResponse => !!p),
: item; itemIdSet,
}), (item) => createRatingUpdater<AlbumArtist>(item),
};
}),
};
},
); );
} return updatedPages ? { ...prev, pages: updatedPages } : prev;
},
}); });
} }
});
// Update infinite loader custom query keys // Update infinite loader custom query keys
const infiniteLoaderQueryKey = [ const infiniteLoaderQueryKey = [
@@ -400,13 +414,12 @@ export const applyRatingOptimisticUpdates = (
queryKey: infiniteLoaderQueryKey, queryKey: infiniteLoaderQueryKey,
}); });
if (infiniteLoaderQueries.length) {
infiniteLoaderQueries.forEach(([queryKey, data]) => { infiniteLoaderQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
( updater: (
prev: prev:
| undefined | undefined
| { | {
@@ -415,26 +428,18 @@ export const applyRatingOptimisticUpdates = (
}, },
) => { ) => {
if (prev && prev.data) { if (prev && prev.data) {
return { const updatedData = updateItemInArray(
...prev, prev.data as Array<{ id: string; userRating?: null | number }>,
data: prev.data.map((item: any) => { itemIdSet,
if (!item || !item.id) { (item) => createRatingUpdater(item),
return item; );
return updatedData ? { ...prev, data: updatedData } : prev;
} }
return itemIdSet.has(item.id)
? { ...item, userRating: rating }
: item;
}),
};
}
return prev; return prev;
}, },
);
}
}); });
} }
});
break; break;
} }
@@ -442,97 +447,256 @@ export const applyRatingOptimisticUpdates = (
case LibraryItem.QUEUE_SONG: case LibraryItem.QUEUE_SONG:
case LibraryItem.SONG: { case LibraryItem.SONG: {
const albumDetailQueryKey = queryKeys.albums.detail(variables.apiClientProps.serverId); const albumDetailQueryKey = queryKeys.albums.detail(variables.apiClientProps.serverId);
const albumDetailQueries = queryClient.getQueriesData({ const albumDetailQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: albumDetailQueryKey, queryKey: albumDetailQueryKey,
}); });
if (albumDetailQueries.length) {
albumDetailQueries.forEach(([queryKey, data]) => { albumDetailQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: AlbumDetailResponse | undefined) => { updater: (prev: AlbumDetailResponse | undefined) => {
if (prev) { if (!prev || !prev.songs) return prev;
return { const updatedSongs = updateItemInArray(prev.songs, itemIdSet, (item) =>
...prev, createRatingUpdater<Song>(item),
songs: prev.songs?.map((song: Song) => {
return itemIdSet.has(song.id)
? { ...song, userRating: rating }
: song;
}),
};
}
return prev;
},
); );
} return updatedSongs ? { ...prev, songs: updatedSongs } : prev;
},
}); });
} }
});
const detailQueryKey = queryKeys.songs.detail(variables.apiClientProps.serverId); const detailQueryKey = queryKeys.songs.detail(variables.apiClientProps.serverId);
const detailQueries = queryClient.getQueriesData({ const detailQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: detailQueryKey, queryKey: detailQueryKey,
}); });
if (detailQueries.length) {
detailQueries.forEach(([queryKey, data]) => { detailQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: SongDetailResponse | undefined) => { updater: (prev: SongDetailResponse | undefined) => {
if (prev && itemIdSet.has(prev.id)) { if (prev && itemIdSet.has(prev.id)) {
return { ...prev, userRating: rating }; return { ...prev, userRating: rating };
} }
return prev; return prev;
}, },
);
}
}); });
} }
});
const topSongsQueryKey = queryKeys.albumArtists.topSongs( const topSongsQueryKey = queryKeys.albumArtists.topSongs(
variables.apiClientProps.serverId, variables.apiClientProps.serverId,
); );
const topSongsQueries = queryClient.getQueriesData({ const topSongsQueries = queryClient.getQueriesData({
exact: false, exact: false,
queryKey: topSongsQueryKey, queryKey: topSongsQueryKey,
}); });
if (topSongsQueries.length) {
topSongsQueries.forEach(([queryKey, data]) => { topSongsQueries.forEach(([queryKey, data]) => {
if (data) { if (data) {
previousQueries.push({ data, queryKey }); pendingUpdates.push({
queryClient.setQueryData( previousData: data,
queryKey, queryKey,
(prev: TopSongListResponse | undefined) => { updater: (prev: TopSongListResponse | undefined) => {
if (prev) { if (!prev) return prev;
return { const updatedItems = updateItemInArray(prev.items, itemIdSet, (item) =>
...prev, createRatingUpdater<Song>(item),
items: prev.items.map((item: Song) =>
itemIdSet.has(item.id)
? { ...item, userRating: rating }
: item,
),
};
}
return prev;
},
); );
} return updatedItems ? { ...prev, items: updatedItems } : prev;
},
}); });
} }
});
break; break;
} }
} }
return collectAndApplyUpdates(queryClient, pendingUpdates);
};
export const applyRatingOptimisticUpdatesDeferred = (
queryClient: QueryClient,
variables: SetRatingArgs,
rating: number,
): PreviousQueryData[] => {
const previousQueries: PreviousQueryData[] = [];
const itemIdSet = new Set<string>();
if (Array.isArray(variables.query.id)) {
variables.query.id.forEach((id) => {
itemIdSet.add(id);
});
} else {
itemIdSet.add(variables.query.id);
}
const queryKeysToUpdate: Array<{
data: unknown;
queryKey: readonly unknown[];
type: string;
}> = [];
const collectQueries = (baseKey: readonly unknown[], type: string) => {
const queries = queryClient.getQueriesData({ exact: false, queryKey: baseKey });
queries.forEach(([queryKey, data]) => {
if (data) {
previousQueries.push({ data, queryKey });
queryKeysToUpdate.push({ data, queryKey, type });
}
});
};
switch (variables.query.type) {
case LibraryItem.ALBUM: {
collectQueries(
queryKeys.albums.detail(variables.apiClientProps.serverId),
'album-detail',
);
collectQueries(queryKeys.albums.list(variables.apiClientProps.serverId), 'album-list');
collectQueries(
queryKeys.albums.infiniteList(variables.apiClientProps.serverId),
'album-infinite-list',
);
collectQueries(
[variables.apiClientProps.serverId, 'item-list-infinite-loader', LibraryItem.ALBUM],
'album-infinite-loader',
);
break;
}
case LibraryItem.ALBUM_ARTIST: {
collectQueries(
queryKeys.albumArtists.detail(variables.apiClientProps.serverId),
'album-artist-detail',
);
collectQueries(
queryKeys.albumArtists.list(variables.apiClientProps.serverId),
'album-artist-list',
);
collectQueries(
queryKeys.albumArtists.infiniteList(variables.apiClientProps.serverId),
'album-artist-infinite-list',
);
collectQueries(
[
variables.apiClientProps.serverId,
'item-list-infinite-loader',
LibraryItem.ALBUM_ARTIST,
],
'album-artist-infinite-loader',
);
break;
}
case LibraryItem.ARTIST: {
collectQueries(
queryKeys.artists.list(variables.apiClientProps.serverId),
'artist-list',
);
collectQueries(
queryKeys.artists.infiniteList(variables.apiClientProps.serverId),
'artist-infinite-list',
);
collectQueries(
[
variables.apiClientProps.serverId,
'item-list-infinite-loader',
LibraryItem.ARTIST,
],
'artist-infinite-loader',
);
break;
}
case LibraryItem.PLAYLIST_SONG:
case LibraryItem.QUEUE_SONG:
case LibraryItem.SONG: {
collectQueries(
queryKeys.albums.detail(variables.apiClientProps.serverId),
'album-detail',
);
collectQueries(
queryKeys.songs.detail(variables.apiClientProps.serverId),
'song-detail',
);
collectQueries(
queryKeys.albumArtists.topSongs(variables.apiClientProps.serverId),
'top-songs',
);
break;
}
}
queueMicrotask(() => {
queryKeysToUpdate.forEach(({ queryKey, type }) => {
queryClient.setQueryData(queryKey, (prev: any) => {
if (!prev) return prev;
switch (type) {
case 'album-artist-detail':
case 'album-detail':
case 'song-detail': {
if (itemIdSet.has(prev.id)) {
return { ...prev, userRating: rating };
}
if (prev.similarArtists) {
const hasMatch = prev.similarArtists.some((a: any) =>
itemIdSet.has(a.id),
);
if (hasMatch) {
return {
...prev,
similarArtists: prev.similarArtists.map((a: any) =>
itemIdSet.has(a.id) ? { ...a, userRating: rating } : a,
),
};
}
}
return prev;
}
case 'album-artist-infinite-list':
case 'album-infinite-list':
case 'artist-infinite-list': {
const updatedPages = updateItemsInPages(
prev.pages || [],
itemIdSet,
(item) => ({ ...item, userRating: rating }),
);
return updatedPages ? { ...prev, pages: updatedPages } : prev;
}
case 'album-artist-infinite-loader':
case 'album-infinite-loader':
case 'artist-infinite-loader': {
if (prev.data) {
const updatedData = updateItemInArray(prev.data, itemIdSet, (item) => ({
...item,
userRating: rating,
}));
return updatedData ? { ...prev, data: updatedData } : prev;
}
return prev;
}
case 'album-artist-list':
case 'album-list':
case 'artist-list':
case 'top-songs': {
const updatedItems = updateItemInArray(
prev.items || [],
itemIdSet,
(item) => ({ ...item, userRating: rating }),
);
return updatedItems ? { ...prev, items: updatedItems } : prev;
}
default:
return prev;
}
});
});
});
return previousQueries; return previousQueries;
}; };