Refactor remaining queries/mutations for new controller

This commit is contained in:
jeffvli 2023-04-30 18:00:50 -07:00
parent 40aabd2217
commit bdd023fde3
15 changed files with 92 additions and 109 deletions

View file

@ -5,36 +5,31 @@ import { NDAlbumDetail, NDAlbumArtistDetail } from '/@/renderer/api/navidrome.ty
import { queryKeys } from '/@/renderer/api/query-keys';
import { SSAlbumDetail, SSAlbumArtistDetail } from '/@/renderer/api/subsonic.types';
import {
RawRatingResponse,
RatingArgs,
SetRatingArgs,
Album,
AlbumArtist,
LibraryItem,
AnyLibraryItems,
RatingResponse,
} from '/@/renderer/api/types';
import {
useCurrentServer,
useSetAlbumListItemDataById,
useSetQueueRating,
useAuthStore,
} from '/@/renderer/store';
import { useSetAlbumListItemDataById, useSetQueueRating, getServerById } from '/@/renderer/store';
import { ServerType } from '/@/renderer/types';
export const useUpdateRating = () => {
const queryClient = useQueryClient();
const currentServer = useCurrentServer();
const setAlbumListData = useSetAlbumListItemDataById();
const setQueueRating = useSetQueueRating();
return useMutation<
RawRatingResponse,
RatingResponse,
HTTPError,
Omit<RatingArgs, 'server'>,
Omit<SetRatingArgs, 'server' | 'apiClientProps'>,
{ previous: { items: AnyLibraryItems } | undefined }
>({
mutationFn: (args) => {
const server = useAuthStore.getState().actions.getServer(args._serverId) || currentServer;
return api.controller.updateRating({ ...args, server });
const server = getServerById(args.serverId);
if (!server) throw new Error('Server not found');
return api.controller.updateRating({ ...args, apiClientProps: { server } });
},
onError: (_error, _variables, context) => {
for (const item of context?.previous?.items || []) {

View file

@ -13,7 +13,7 @@ export const useAlbumArtistList = (args: QueryHookArgs<AlbumArtistListQuery>) =>
enabled: !!server?.id,
queryFn: ({ signal }) => {
if (!server) throw new Error('Server not found');
api.controller.getAlbumArtistList({ apiClientProps: { server, signal }, query });
return api.controller.getAlbumArtistList({ apiClientProps: { server, signal }, query });
},
queryKey: queryKeys.albumArtists.list(server?.id || '', query),
...options,

View file

@ -1,24 +1,22 @@
import { useCallback } from 'react';
import { useQuery } from '@tanstack/react-query';
import { controller } from '/@/renderer/api/controller';
import { queryKeys } from '/@/renderer/api/query-keys';
import type { GenreListQuery, RawGenreListResponse } from '/@/renderer/api/types';
import type { QueryOptions } from '/@/renderer/lib/react-query';
import { useCurrentServer } from '/@/renderer/store';
import { api } from '/@/renderer/api';
import type { GenreListQuery } from '/@/renderer/api/types';
import type { QueryHookArgs } from '/@/renderer/lib/react-query';
import { getServerById } from '/@/renderer/store';
export const useGenreList = (query: GenreListQuery, options?: QueryOptions) => {
const server = useCurrentServer();
export const useGenreList = (args: QueryHookArgs<GenreListQuery>) => {
const { options, query, serverId } = args || {};
const server = getServerById(serverId);
return useQuery({
cacheTime: 1000 * 60 * 60 * 2,
enabled: !!server?.id,
queryFn: ({ signal }) => controller.getGenreList({ query, server, signal }),
enabled: !!server,
queryFn: ({ signal }) => {
if (!server) throw new Error('Server not found');
return controller.getGenreList({ apiClientProps: { server, signal }, query });
},
queryKey: queryKeys.genres.list(server?.id || ''),
select: useCallback(
(data: RawGenreListResponse | undefined) => api.normalize.genreList(data, server),
[server],
),
staleTime: 1000 * 60 * 60,
...options,
});

View file

@ -8,7 +8,12 @@ import { getServerById, useIncrementQueuePlayCount } from '/@/renderer/store';
export const useSendScrobble = (options?: MutationOptions) => {
const incrementPlayCount = useIncrementQueuePlayCount();
return useMutation<ScrobbleResponse, HTTPError, Omit<ScrobbleArgs, 'server'>, null>({
return useMutation<
ScrobbleResponse,
HTTPError,
Omit<ScrobbleArgs, 'server' | 'apiClientProps'>,
null
>({
mutationFn: (args) => {
const server = getServerById(args.serverId);
if (!server) throw new Error('Server not found');

View file

@ -23,6 +23,9 @@ export const useAddToPlaylist = (args: MutationHookArgs) => {
},
onSuccess: (_data, variables) => {
const { serverId } = variables;
if (!serverId) return;
queryClient.invalidateQueries(queryKeys.playlists.list(serverId), { exact: false });
queryClient.invalidateQueries(queryKeys.playlists.detail(serverId, variables.query.id));
queryClient.invalidateQueries(

View file

@ -1,14 +1,12 @@
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { useMutation } from '@tanstack/react-query';
import { HTTPError } from 'ky';
import { api } from '/@/renderer/api';
import { queryKeys } from '/@/renderer/api/query-keys';
import { CreatePlaylistArgs, CreatePlaylistResponse } from '/@/renderer/api/types';
import { MutationHookArgs } from '/@/renderer/lib/react-query';
import { getServerById } from '/@/renderer/store';
export const useCreatePlaylist = (args: MutationHookArgs) => {
const { options } = args || {};
const queryClient = useQueryClient();
return useMutation<
CreatePlaylistResponse,
@ -21,10 +19,6 @@ export const useCreatePlaylist = (args: MutationHookArgs) => {
if (!server) throw new Error('Server not found');
return api.controller.createPlaylist({ ...args, apiClientProps: { server } });
},
onSuccess: (_data, variables) => {
const serverId = variables.serverId;
queryClient.invalidateQueries(queryKeys.playlists.list(serverId), { exact: false });
},
...options,
});
};

View file

@ -22,6 +22,9 @@ export const useRemoveFromPlaylist = (options?: MutationOptions) => {
},
onSuccess: (_data, variables) => {
const { serverId } = variables;
if (!serverId) return;
queryClient.invalidateQueries(queryKeys.playlists.list(serverId), { exact: false });
queryClient.invalidateQueries(queryKeys.playlists.detail(serverId, variables.query.id));
queryClient.invalidateQueries(

View file

@ -10,7 +10,12 @@ export const useUpdatePlaylist = (args: MutationHookArgs) => {
const { options } = args || {};
const queryClient = useQueryClient();
return useMutation<UpdatePlaylistResponse, HTTPError, Omit<UpdatePlaylistArgs, 'server'>, null>({
return useMutation<
UpdatePlaylistResponse,
HTTPError,
Omit<UpdatePlaylistArgs, 'server' | 'apiClientProps'>,
null
>({
mutationFn: (args) => {
const server = getServerById(args.serverId);
if (!server) throw new Error('Server not found');
@ -18,6 +23,9 @@ export const useUpdatePlaylist = (args: MutationHookArgs) => {
},
onSuccess: (_data, variables) => {
const { query, serverId } = variables;
if (!serverId) return;
queryClient.invalidateQueries(queryKeys.playlists.list(serverId));
if (query?.id) {

View file

@ -1,6 +1,6 @@
import { useQuery, useInfiniteQuery } from '@tanstack/react-query';
import { queryKeys } from '/@/renderer/api/query-keys';
import type { PlaylistSongListQuery, SongListResponse } from '/@/renderer/api/types';
import type { PlaylistSongListQuery, PlaylistSongListResponse } from '/@/renderer/api/types';
import type { QueryHookArgs } from '/@/renderer/lib/react-query';
import { getServerById } from '/@/renderer/store';
import { api } from '/@/renderer/api';
@ -10,10 +10,10 @@ export const usePlaylistSongList = (args: QueryHookArgs<PlaylistSongListQuery>)
const server = getServerById(serverId);
return useQuery({
enabled: !!server?.id,
enabled: !!server,
queryFn: ({ signal }) => {
if (!server) throw new Error('Server not found');
api.controller.getPlaylistSongList({ apiClientProps: { server, signal }, query });
return api.controller.getPlaylistSongList({ apiClientProps: { server, signal }, query });
},
queryKey: queryKeys.playlists.songList(server?.id || '', query.id, query),
...options,
@ -25,24 +25,22 @@ export const usePlaylistSongListInfinite = (args: QueryHookArgs<PlaylistSongList
const server = getServerById(serverId);
return useInfiniteQuery({
enabled: !!server?.id,
getNextPageParam: (lastPage: SongListResponse, allPages) => {
enabled: !!server,
getNextPageParam: (lastPage: PlaylistSongListResponse | undefined, pages) => {
if (!lastPage?.items) return undefined;
if (lastPage?.items?.length >= (query?.limit || 50)) {
return allPages?.length;
return pages?.length;
}
return undefined;
},
queryFn: ({ pageParam = 0, signal }) => {
return api.controller.getPlaylistSongList({
apiClientProps: { server, signal },
query: { ...query, limit: query.limit || 50, startIndex: pageParam * (query.limit || 50) },
server,
signal,
});
},
queryKey: queryKeys.playlists.detailSongList(server?.id || '', query.id, query),
...options,
});
};

View file

@ -1,4 +1,4 @@
import { useMutation } from '@tanstack/react-query';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { HTTPError } from 'ky';
import { api } from '/@/renderer/api';
import { queryKeys } from '/@/renderer/api/query-keys';
@ -9,11 +9,12 @@ import {
FavoriteResponse,
LibraryItem,
} from '/@/renderer/api/types';
import { MutationHookArgs, queryClient } from '/@/renderer/lib/react-query';
import { MutationHookArgs } from '/@/renderer/lib/react-query';
import { getServerById, useSetAlbumListItemDataById, useSetQueueFavorite } from '/@/renderer/store';
export const useCreateFavorite = (args?: MutationHookArgs) => {
export const useCreateFavorite = (args: MutationHookArgs) => {
const { options } = args || {};
const queryClient = useQueryClient();
const setAlbumListData = useSetAlbumListItemDataById();
const setQueueFavorite = useSetQueueFavorite();
@ -30,6 +31,9 @@ export const useCreateFavorite = (args?: MutationHookArgs) => {
},
onSuccess: (_data, variables) => {
const { serverId } = variables;
if (!serverId) return;
for (const id of variables.query.id) {
// Set the userFavorite property to true for the album in the album list data store
if (variables.query.type === LibraryItem.ALBUM) {

View file

@ -1,4 +1,4 @@
import { useMutation } from '@tanstack/react-query';
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { HTTPError } from 'ky';
import { api } from '/@/renderer/api';
import { queryKeys } from '/@/renderer/api/query-keys';
@ -9,12 +9,12 @@ import {
FavoriteResponse,
LibraryItem,
} from '/@/renderer/api/types';
import { MutationHookArgs, queryClient } from '/@/renderer/lib/react-query';
import { MutationHookArgs } from '/@/renderer/lib/react-query';
import { getServerById, useSetAlbumListItemDataById, useSetQueueFavorite } from '/@/renderer/store';
export const useDeleteFavorite = (args: MutationHookArgs) => {
const { options } = args || {};
// const queryClient = useQueryClient();
const queryClient = useQueryClient();
const setAlbumListData = useSetAlbumListItemDataById();
const setQueueFavorite = useSetQueueFavorite();
@ -31,6 +31,9 @@ export const useDeleteFavorite = (args: MutationHookArgs) => {
},
onSuccess: (_data, variables) => {
const { serverId } = variables;
if (!serverId) return;
for (const id of variables.query.id) {
// Set the userFavorite property to false for the album in the album list data store
if (variables.query.type === LibraryItem.ALBUM) {

View file

@ -1,9 +1,7 @@
import { useMutation, useQueryClient } from '@tanstack/react-query';
import { HTTPError } from 'ky';
import { api } from '/@/renderer/api';
import { NDAlbumArtistDetail, NDAlbumDetail } from '/@/renderer/api/navidrome.types';
import { queryKeys } from '/@/renderer/api/query-keys';
import { SSAlbumArtistDetail, SSAlbumDetail } from '/@/renderer/api/subsonic.types';
import {
Album,
AlbumArtist,
@ -11,7 +9,8 @@ import {
LibraryItem,
SetRatingArgs,
RatingResponse,
ServerType,
AlbumDetailResponse,
AlbumArtistDetailResponse,
} from '/@/renderer/api/types';
import { MutationHookArgs } from '/@/renderer/lib/react-query';
import { getServerById, useSetAlbumListItemDataById, useSetQueueRating } from '/@/renderer/store';
@ -65,61 +64,35 @@ export const useSetRating = (args: MutationHookArgs) => {
variables.query.item.length === 1 && variables.query.item[0].itemType === LibraryItem.ALBUM;
if (isAlbumDetailPage) {
const { serverType, id: albumId, serverId } = variables.query.item[0] as Album;
const { id: albumId, serverId } = variables.query.item[0] as Album;
const queryKey = queryKeys.albums.detail(serverId || '', { id: albumId });
const previous = queryClient.getQueryData<any>(queryKey);
const previous = queryClient.getQueryData<AlbumDetailResponse>(queryKey);
if (previous) {
switch (serverType) {
case ServerType.NAVIDROME:
queryClient.setQueryData<NDAlbumDetail>(queryKey, {
...previous,
rating: variables.query.rating,
});
break;
case ServerType.SUBSONIC:
queryClient.setQueryData<SSAlbumDetail>(queryKey, {
...previous,
userRating: variables.query.rating,
});
break;
case ServerType.JELLYFIN:
// Jellyfin does not support ratings
break;
}
queryClient.setQueryData<AlbumDetailResponse>(queryKey, {
...previous,
userRating: variables.query.rating,
});
}
}
// We only need to set if we're already on the album detail page
// We only need to set if we're already on the album artist detail page
const isAlbumArtistDetailPage =
variables.query.item.length === 1 &&
variables.query.item[0].itemType === LibraryItem.ALBUM_ARTIST;
if (isAlbumArtistDetailPage) {
const { serverType, id: albumArtistId, serverId } = variables.query.item[0] as AlbumArtist;
const { id: albumArtistId, serverId } = variables.query.item[0] as AlbumArtist;
const queryKey = queryKeys.albumArtists.detail(serverId || '', {
id: albumArtistId,
});
const previous = queryClient.getQueryData<any>(queryKey);
const previous = queryClient.getQueryData<AlbumArtistDetailResponse>(queryKey);
if (previous) {
switch (serverType) {
case ServerType.NAVIDROME:
queryClient.setQueryData<NDAlbumArtistDetail>(queryKey, {
...previous,
rating: variables.query.rating,
});
break;
case ServerType.SUBSONIC:
queryClient.setQueryData<SSAlbumArtistDetail>(queryKey, {
...previous,
userRating: variables.query.rating,
});
break;
case ServerType.JELLYFIN:
// Jellyfin does not support ratings
break;
}
queryClient.setQueryData<AlbumArtistDetailResponse>(queryKey, {
...previous,
userRating: variables.query.rating,
});
}
}
},

View file

@ -1,23 +1,22 @@
import { useCallback } from 'react';
import { useQuery } from '@tanstack/react-query';
import { api } from '/@/renderer/api';
import { queryKeys } from '/@/renderer/api/query-keys';
import { useCurrentServer } from '/@/renderer/store';
import { RawMusicFolderListResponse } from '/@/renderer/api/types';
import { getServerById } from '/@/renderer/store';
import { MusicFolderListQuery } from '../../../api/types';
import { QueryHookArgs } from '../../../lib/react-query';
export const useMusicFolders = () => {
const server = useCurrentServer();
export const useMusicFolders = (args: QueryHookArgs<MusicFolderListQuery>) => {
const { options, serverId } = args || {};
const server = getServerById(serverId);
const query = useQuery({
enabled: !!server?.id,
queryFn: ({ signal }) => api.controller.getMusicFolderList({ server, signal }),
enabled: !!server,
queryFn: ({ signal }) => {
if (!server) throw new Error('Server not found');
return api.controller.getMusicFolderList({ apiClientProps: { server, signal } });
},
queryKey: queryKeys.musicFolders.list(server?.id || ''),
select: useCallback(
(data: RawMusicFolderListResponse | undefined) => {
return api.normalize.musicFolderList(data, server);
},
[server],
),
...options,
});
return query;

View file

@ -13,7 +13,7 @@ export const useSongList = (args: QueryHookArgs<SongListQuery>) => {
enabled: !!server?.id,
queryFn: ({ signal }) => {
if (!server) throw new Error('Server not found');
controller.getSongList({ apiClientProps: { server, signal }, query });
return controller.getSongList({ apiClientProps: { server, signal }, query });
},
queryKey: queryKeys.songs.list(server?.id || '', query),
...options,

View file

@ -5,7 +5,7 @@ import type {
UseInfiniteQueryOptions,
} from '@tanstack/react-query';
import { QueryClient, QueryCache } from '@tanstack/react-query';
import { toast } from '/@/renderer/components';
import { toast } from '/@/renderer/components/toast/index';
const queryCache = new QueryCache({
onError: (error: any, query) => {
@ -39,7 +39,7 @@ export const queryClient = new QueryClient({
export type QueryHookArgs<T> = {
options?: QueryOptions;
query: T;
serverId?: string;
serverId: string | undefined;
};
export type MutationHookArgs = {