From bf3024939ac63dfb8d8e18437b896de901b35256 Mon Sep 17 00:00:00 2001 From: jeffvli Date: Thu, 27 Apr 2023 21:25:57 -0700 Subject: [PATCH] Refactor all query hooks --- .../albums/queries/album-detail-query.ts | 22 ++++---- .../albums/queries/album-list-query.ts | 32 ++++++----- .../queries/album-artist-detail-query.ts | 22 ++++---- .../queries/album-artist-list-query.ts | 21 ++++--- .../artists/queries/artist-info-query.ts | 22 ++++---- .../artists/queries/top-songs-list-query.ts | 21 ++++--- .../home/queries/recently-played-query.ts | 56 ++++++------------- .../queries/playlist-detail-query.ts | 21 ++++--- .../playlists/queries/playlist-list-query.ts | 23 ++++---- .../queries/playlist-song-list-query.ts | 45 ++++++--------- .../features/songs/queries/song-list-query.ts | 22 ++++---- .../features/users/queries/user-list-query.ts | 23 ++++---- 12 files changed, 145 insertions(+), 185 deletions(-) diff --git a/src/renderer/features/albums/queries/album-detail-query.ts b/src/renderer/features/albums/queries/album-detail-query.ts index cd6a83a6..a9a3bea4 100644 --- a/src/renderer/features/albums/queries/album-detail-query.ts +++ b/src/renderer/features/albums/queries/album-detail-query.ts @@ -1,22 +1,20 @@ import { useQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '../../../store/auth.store'; -import type { AlbumDetailQuery, RawAlbumDetailResponse } from '/@/renderer/api/types'; +import type { QueryHookArgs } from '/@/renderer/lib/react-query'; +import { getServerById } from '../../../store/auth.store'; +import type { AlbumDetailQuery } from '/@/renderer/api/types'; import { controller } from '/@/renderer/api/controller'; -import { useCallback } from 'react'; -import { api } from '/@/renderer/api'; -export const useAlbumDetail = (query: AlbumDetailQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useAlbumDetail = (args: QueryHookArgs) => { + const { options, query, serverId } = args; + const server = getServerById(serverId); return useQuery({ - queryFn: ({ signal }) => controller.getAlbumDetail({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return controller.getAlbumDetail({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.albums.detail(server?.id || '', query), - select: useCallback( - (data: RawAlbumDetailResponse | undefined) => api.normalize.albumDetail(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/albums/queries/album-list-query.ts b/src/renderer/features/albums/queries/album-list-query.ts index 5d66bc21..0246332d 100644 --- a/src/renderer/features/albums/queries/album-list-query.ts +++ b/src/renderer/features/albums/queries/album-list-query.ts @@ -1,23 +1,27 @@ -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 { AlbumListQuery, RawAlbumListResponse } from '/@/renderer/api/types'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; -import { api } from '/@/renderer/api'; +import type { AlbumListQuery } from '/@/renderer/api/types'; +import type { QueryHookArgs } from '/@/renderer/lib/react-query'; +import { getServerById } from '/@/renderer/store'; -export const useAlbumList = (query: AlbumListQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useAlbumList = (args: QueryHookArgs) => { + const { options, query, serverId } = args; + const server = getServerById(serverId); return useQuery({ - enabled: !!server?.id, - queryFn: ({ signal }) => controller.getAlbumList({ query, server, signal }), - queryKey: queryKeys.albums.list(server?.id || '', query), - select: useCallback( - (data: RawAlbumListResponse | undefined) => api.normalize.albumList(data, server), - [server], - ), + enabled: !!serverId, + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return controller.getAlbumList({ + apiClientProps: { + server, + signal, + }, + query, + }); + }, + queryKey: queryKeys.albums.list(serverId || '', query), ...options, }); }; diff --git a/src/renderer/features/artists/queries/album-artist-detail-query.ts b/src/renderer/features/artists/queries/album-artist-detail-query.ts index f2a08122..8e323745 100644 --- a/src/renderer/features/artists/queries/album-artist-detail-query.ts +++ b/src/renderer/features/artists/queries/album-artist-detail-query.ts @@ -1,23 +1,21 @@ -import { useCallback } from 'react'; import { useQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { AlbumArtistDetailQuery, RawAlbumArtistDetailResponse } from '/@/renderer/api/types'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; +import type { AlbumArtistDetailQuery } from '/@/renderer/api/types'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; +import { QueryHookArgs } from '../../../lib/react-query'; -export const useAlbumArtistDetail = (query: AlbumArtistDetailQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useAlbumArtistDetail = (args: QueryHookArgs) => { + const { options, query, serverId } = args || {}; + const server = getServerById(serverId); return useQuery({ enabled: !!server?.id && !!query.id, - queryFn: ({ signal }) => api.controller.getAlbumArtistDetail({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return api.controller.getAlbumArtistDetail({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.albumArtists.detail(server?.id || '', query), - select: useCallback( - (data: RawAlbumArtistDetailResponse | undefined) => - api.normalize.albumArtistDetail(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/artists/queries/album-artist-list-query.ts b/src/renderer/features/artists/queries/album-artist-list-query.ts index 3ce19882..bc50f338 100644 --- a/src/renderer/features/artists/queries/album-artist-list-query.ts +++ b/src/renderer/features/artists/queries/album-artist-list-query.ts @@ -1,22 +1,21 @@ -import { useCallback } from 'react'; import { useQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { AlbumArtistListQuery, RawAlbumArtistListResponse } from '/@/renderer/api/types'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; +import type { AlbumArtistListQuery } from '/@/renderer/api/types'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; +import { QueryHookArgs } from '../../../lib/react-query'; -export const useAlbumArtistList = (query: AlbumArtistListQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useAlbumArtistList = (args: QueryHookArgs) => { + const { options, query, serverId } = args || {}; + const server = getServerById(serverId); return useQuery({ enabled: !!server?.id, - queryFn: ({ signal }) => api.controller.getAlbumArtistList({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + api.controller.getAlbumArtistList({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.albumArtists.list(server?.id || '', query), - select: useCallback( - (data: RawAlbumArtistListResponse | undefined) => api.normalize.albumArtistList(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/artists/queries/artist-info-query.ts b/src/renderer/features/artists/queries/artist-info-query.ts index 8c93abe4..f61301ae 100644 --- a/src/renderer/features/artists/queries/artist-info-query.ts +++ b/src/renderer/features/artists/queries/artist-info-query.ts @@ -1,23 +1,21 @@ -import { useCallback } from 'react'; import { useQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { AlbumArtistDetailQuery, RawAlbumArtistDetailResponse } from '/@/renderer/api/types'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; +import type { AlbumArtistDetailQuery } from '/@/renderer/api/types'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; +import { QueryHookArgs } from '../../../lib/react-query'; -export const useAlbumArtistInfo = (query: AlbumArtistDetailQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useAlbumArtistInfo = (args: QueryHookArgs) => { + const { options, query, serverId } = args || {}; + const server = getServerById(serverId); return useQuery({ enabled: !!server?.id && !!query.id, - queryFn: ({ signal }) => api.controller.getAlbumArtistDetail({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return api.controller.getAlbumArtistDetail({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.albumArtists.detail(server?.id || '', query), - select: useCallback( - (data: RawAlbumArtistDetailResponse | undefined) => - api.normalize.albumArtistDetail(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/artists/queries/top-songs-list-query.ts b/src/renderer/features/artists/queries/top-songs-list-query.ts index 038c006a..7524b4f2 100644 --- a/src/renderer/features/artists/queries/top-songs-list-query.ts +++ b/src/renderer/features/artists/queries/top-songs-list-query.ts @@ -1,22 +1,21 @@ -import { useCallback } from 'react'; import { useQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { RawTopSongListResponse, TopSongListQuery } from '/@/renderer/api/types'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; +import type { TopSongListQuery } from '/@/renderer/api/types'; +import type { QueryHookArgs } from '/@/renderer/lib/react-query'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; -export const useTopSongsList = (query: TopSongListQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useTopSongsList = (args: QueryHookArgs) => { + const { options, query, serverId } = args || {}; + const server = getServerById(serverId); return useQuery({ enabled: !!server?.id, - queryFn: ({ signal }) => api.controller.getTopSongList({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return api.controller.getTopSongList({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.albumArtists.topSongs(server?.id || '', query), - select: useCallback( - (data: RawTopSongListResponse | undefined) => api.normalize.topSongList(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/home/queries/recently-played-query.ts b/src/renderer/features/home/queries/recently-played-query.ts index 6468698e..2e91454b 100644 --- a/src/renderer/features/home/queries/recently-played-query.ts +++ b/src/renderer/features/home/queries/recently-played-query.ts @@ -1,20 +1,13 @@ -import { useCallback } from 'react'; import { useQuery } from '@tanstack/react-query'; import { api } from '/@/renderer/api'; -import { ndNormalize } from '/@/renderer/api/navidrome.api'; -import { NDAlbum } from '/@/renderer/api/navidrome.types'; import { queryKeys } from '/@/renderer/api/query-keys'; -import { - AlbumListQuery, - AlbumListSort, - RawAlbumListResponse, - SortOrder, -} from '/@/renderer/api/types'; -import { useCurrentServer } from '/@/renderer/store'; -import { QueryOptions } from '/@/renderer/lib/react-query'; +import { AlbumListQuery, AlbumListSort, SortOrder } from '/@/renderer/api/types'; +import { getServerById } from '/@/renderer/store'; +import { QueryHookArgs } from '/@/renderer/lib/react-query'; -export const useRecentlyPlayed = (query: Partial, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useRecentlyPlayed = (args: QueryHookArgs>) => { + const { options, query, serverId } = args; + const server = getServerById(serverId); const requestQuery: AlbumListQuery = { limit: 5, @@ -25,34 +18,19 @@ export const useRecentlyPlayed = (query: Partial, options?: Quer }; return useQuery({ - queryFn: ({ signal }) => - api.controller.getAlbumList({ + enabled: !!server?.id, + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return api.controller.getAlbumList({ + apiClientProps: { + server, + signal, + }, query: requestQuery, - server, - signal, - }), - queryKey: queryKeys.albums.list(server?.id || '', requestQuery), - select: useCallback( - (data: RawAlbumListResponse | undefined) => { - let albums; - switch (server?.type) { - case 'jellyfin': - break; - case 'navidrome': - albums = data?.items.map((item) => ndNormalize.album(item as NDAlbum, server)); - break; - case 'subsonic': - break; - } + }); + }, - return { - items: albums, - startIndex: data?.startIndex, - totalRecordCount: data?.totalRecordCount, - }; - }, - [server], - ), + queryKey: queryKeys.albums.list(server?.id || '', requestQuery), ...options, }); }; diff --git a/src/renderer/features/playlists/queries/playlist-detail-query.ts b/src/renderer/features/playlists/queries/playlist-detail-query.ts index b0340ef7..8876ef24 100644 --- a/src/renderer/features/playlists/queries/playlist-detail-query.ts +++ b/src/renderer/features/playlists/queries/playlist-detail-query.ts @@ -1,22 +1,21 @@ -import { useCallback } from 'react'; import { useQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { PlaylistDetailQuery, RawPlaylistDetailResponse } from '/@/renderer/api/types'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; +import type { PlaylistDetailQuery } from '/@/renderer/api/types'; +import type { QueryHookArgs } from '/@/renderer/lib/react-query'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; -export const usePlaylistDetail = (query: PlaylistDetailQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const usePlaylistDetail = (args: QueryHookArgs) => { + const { options, query, serverId } = args || {}; + const server = getServerById(serverId); return useQuery({ enabled: !!server?.id, - queryFn: ({ signal }) => api.controller.getPlaylistDetail({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return api.controller.getPlaylistDetail({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.playlists.detail(server?.id || '', query.id, query), - select: useCallback( - (data: RawPlaylistDetailResponse | undefined) => api.normalize.playlistDetail(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/playlists/queries/playlist-list-query.ts b/src/renderer/features/playlists/queries/playlist-list-query.ts index ae353629..b768fe63 100644 --- a/src/renderer/features/playlists/queries/playlist-list-query.ts +++ b/src/renderer/features/playlists/queries/playlist-list-query.ts @@ -1,23 +1,26 @@ -import { useCallback } from 'react'; import { useQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { PlaylistListQuery, RawPlaylistListResponse } from '/@/renderer/api/types'; +import type { PlaylistListQuery } from '/@/renderer/api/types'; import type { QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; -export const usePlaylistList = (query: PlaylistListQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const usePlaylistList = (args: { + options?: QueryOptions; + query: PlaylistListQuery; + serverId?: string; +}) => { + const { options, query, serverId } = args; + const server = getServerById(serverId); return useQuery({ cacheTime: 1000 * 60 * 60, enabled: !!server?.id, - queryFn: ({ signal }) => api.controller.getPlaylistList({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + return api.controller.getPlaylistList({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.playlists.list(server?.id || '', query), - select: useCallback( - (data: RawPlaylistListResponse | undefined) => api.normalize.playlistList(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/playlists/queries/playlist-song-list-query.ts b/src/renderer/features/playlists/queries/playlist-song-list-query.ts index 32ad8bba..796c66b3 100644 --- a/src/renderer/features/playlists/queries/playlist-song-list-query.ts +++ b/src/renderer/features/playlists/queries/playlist-song-list-query.ts @@ -1,35 +1,32 @@ -import { useCallback } from 'react'; -import { useQuery, useInfiniteQuery, InfiniteData } from '@tanstack/react-query'; +import { useQuery, useInfiniteQuery } from '@tanstack/react-query'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { PlaylistSongListQuery, RawSongListResponse } from '/@/renderer/api/types'; -import type { InfiniteQueryOptions, QueryOptions } from '/@/renderer/lib/react-query'; -import { useCurrentServer } from '/@/renderer/store'; +import type { PlaylistSongListQuery, SongListResponse } from '/@/renderer/api/types'; +import type { QueryHookArgs } from '/@/renderer/lib/react-query'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; -export const usePlaylistSongList = (query: PlaylistSongListQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const usePlaylistSongList = (args: QueryHookArgs) => { + const { options, query, serverId } = args || {}; + const server = getServerById(serverId); return useQuery({ enabled: !!server?.id, - queryFn: ({ signal }) => api.controller.getPlaylistSongList({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + api.controller.getPlaylistSongList({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.playlists.songList(server?.id || '', query.id, query), - select: useCallback( - (data: RawSongListResponse | undefined) => api.normalize.songList(data, server), - [server], - ), ...options, }); }; -export const usePlaylistSongListInfinite = ( - query: PlaylistSongListQuery, - options?: InfiniteQueryOptions, -) => { - const server = useCurrentServer(); +export const usePlaylistSongListInfinite = (args: QueryHookArgs) => { + const { options, query, serverId } = args || {}; + const server = getServerById(serverId); return useInfiniteQuery({ enabled: !!server?.id, - getNextPageParam: (lastPage: RawSongListResponse, allPages) => { + getNextPageParam: (lastPage: SongListResponse, allPages) => { if (!lastPage?.items) return undefined; if (lastPage?.items?.length >= (query?.limit || 50)) { return allPages?.length; @@ -45,17 +42,7 @@ export const usePlaylistSongListInfinite = ( }); }, queryKey: queryKeys.playlists.detailSongList(server?.id || '', query.id, query), - select: useCallback( - (data: InfiniteData) => { - return { - ...data, - pages: data.pages.map((page, index) => { - return { ...api.normalize.songList(page, server), pageIndex: index }; - }), - }; - }, - [server], - ), + ...options, }); }; diff --git a/src/renderer/features/songs/queries/song-list-query.ts b/src/renderer/features/songs/queries/song-list-query.ts index 291f26c6..fc691f54 100644 --- a/src/renderer/features/songs/queries/song-list-query.ts +++ b/src/renderer/features/songs/queries/song-list-query.ts @@ -1,23 +1,21 @@ import { useQuery } from '@tanstack/react-query'; -import { useCallback } from 'react'; import { controller } from '/@/renderer/api/controller'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { RawSongListResponse, SongListQuery } from '/@/renderer/api/types'; -import { useCurrentServer } from '/@/renderer/store'; -import { api } from '/@/renderer/api'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; +import type { SongListQuery } from '/@/renderer/api/types'; +import { getServerById } from '/@/renderer/store'; +import type { QueryHookArgs } from '/@/renderer/lib/react-query'; -export const useSongList = (query: SongListQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useSongList = (args: QueryHookArgs) => { + const { query, options, serverId } = args || {}; + const server = getServerById(serverId); return useQuery({ enabled: !!server?.id, - queryFn: ({ signal }) => controller.getSongList({ query, server, signal }), + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + controller.getSongList({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.songs.list(server?.id || '', query), - select: useCallback( - (data: RawSongListResponse | undefined) => api.normalize.songList(data, server), - [server], - ), ...options, }); }; diff --git a/src/renderer/features/users/queries/user-list-query.ts b/src/renderer/features/users/queries/user-list-query.ts index d88caaf4..61b2e2dd 100644 --- a/src/renderer/features/users/queries/user-list-query.ts +++ b/src/renderer/features/users/queries/user-list-query.ts @@ -1,22 +1,21 @@ import { useQuery } from '@tanstack/react-query'; -import { useCallback } from 'react'; import { queryKeys } from '/@/renderer/api/query-keys'; -import type { RawUserListResponse, UserListQuery } from '/@/renderer/api/types'; -import { useCurrentServer } from '/@/renderer/store'; +import type { UserListQuery } from '/@/renderer/api/types'; +import { getServerById } from '/@/renderer/store'; import { api } from '/@/renderer/api'; -import type { QueryOptions } from '/@/renderer/lib/react-query'; +import type { QueryHookArgs } from '/@/renderer/lib/react-query'; -export const useUserList = (query: UserListQuery, options?: QueryOptions) => { - const server = useCurrentServer(); +export const useUserList = (args: QueryHookArgs) => { + const { query, serverId, options } = args || {}; + const server = getServerById(serverId); return useQuery({ - enabled: !!server?.id, - queryFn: ({ signal }) => api.controller.getUserList({ query, server, signal }), + enabled: !!server, + queryFn: ({ signal }) => { + if (!server) throw new Error('Server not found'); + api.controller.getUserList({ apiClientProps: { server, signal }, query }); + }, queryKey: queryKeys.users.list(server?.id || '', query), - select: useCallback( - (data: RawUserListResponse | undefined) => api.normalize.userList(data, server), - [server], - ), ...options, }); };