antebudimir/feishin
1
0
Fork 0
mirror of https://github.com/antebudimir/feishin.git synced 2026-01-01 02:13:33 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Support genres in context menu

Browse source
This commit is contained in:
jeffvli 2023-08-04 02:27:04 -07:00
parent 0b207c78e7
commit d0aba6e16e
12 changed files with 182 additions and 56 deletions
Download patch file Download diff file Expand all files Collapse all files

7
src/renderer/features/context-menu/context-menu-items.tsx
View file

@ -52,6 +52,13 @@ export const ALBUM_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
{ children: true, disabled: false, id: 'setRating' },
];
export const GENRE_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
{ id: 'play' },
{ id: 'playLast' },
{ divider: true, id: 'playNext' },
{ divider: true, id: 'addToPlaylist' },
];
export const ARTIST_CONTEXT_MENU_ITEMS: SetContextMenuItems = [
{ id: 'play' },
{ id: 'playLast' },

17
src/renderer/features/context-menu/context-menu-provider.tsx
View file

@ -196,6 +196,12 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
playType,
});
break;
case LibraryItem.GENRE:
handlePlayQueueAdd?.({
byItemType: { id: ctx.data.map((item) => item.id), type: ctx.type },
playType,
});
break;
case LibraryItem.SONG:
handlePlayQueueAdd?.({ byData: ctx.data, playType });
break;
@ -403,9 +409,11 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
const albumId: string[] = [];
const artistId: string[] = [];
const songId: string[] = [];
const genreId: string[] = [];
if (ctx.dataNodes) {
for (const node of ctx.dataNodes) {
console.log('node.data.itemType :>> ', node.data.itemType);
switch (node.data.itemType) {
case LibraryItem.ALBUM:
albumId.push(node.data.id);
@ -413,6 +421,9 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
case LibraryItem.ARTIST:
artistId.push(node.data.id);
break;
case LibraryItem.GENRE:
genreId.push(node.data.id);
break;
case LibraryItem.SONG:
songId.push(node.data.id);
break;
@ -427,6 +438,9 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
case LibraryItem.ARTIST:
artistId.push(item.id);
break;
case LibraryItem.GENRE:
genreId.push(item.id);
break;
case LibraryItem.SONG:
songId.push(item.id);
break;
@ -434,10 +448,13 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
}
}
console.log('genreId', genreId);
openContextModal({
innerProps: {
albumId: albumId.length > 0 ? albumId : undefined,
artistId: artistId.length > 0 ? artistId : undefined,
genreId: genreId.length > 0 ? genreId : undefined,
songId: songId.length > 0 ? songId : undefined,
},
modal: 'addToPlaylist',

4
src/renderer/features/genres/components/genre-list-table-view.tsx
View file

@ -4,7 +4,7 @@ import { VirtualGridAutoSizerContainer } from '/@/renderer/components/virtual-gr
import { VirtualTable } from '/@/renderer/components/virtual-table';
import { useVirtualTable } from '/@/renderer/components/virtual-table/hooks/use-virtual-table';
import { useListContext } from '/@/renderer/context/list-context';
import { ALBUM_CONTEXT_MENU_ITEMS } from '/@/renderer/features/context-menu/context-menu-items';
import { GENRE_CONTEXT_MENU_ITEMS } from '/@/renderer/features/context-menu/context-menu-items';
import { useCurrentServer } from '/@/renderer/store';
import { MutableRefObject, useCallback } from 'react';
import { RowDoubleClickedEvent } from '@ag-grid-community/core';
@ -22,7 +22,7 @@ export const GenreListTableView = ({ tableRef, itemCount }: GenreListTableViewPr
const navigate = useNavigate();
const tableProps = useVirtualTable({
contextMenu: ALBUM_CONTEXT_MENU_ITEMS,
contextMenu: GENRE_CONTEXT_MENU_ITEMS,
customFilters,
itemCount,
itemType: LibraryItem.GENRE,

45
src/renderer/features/genres/routes/genre-list-route.tsx
View file

@ -1,24 +1,18 @@
import type { AgGridReact as AgGridReactType } from '@ag-grid-community/react/lib/agGridReact';
import { useCallback, useMemo, useRef } from 'react';
import { api } from '/@/renderer/api';
import { queryKeys } from '/@/renderer/api/query-keys';
import { GenreListSort, LibraryItem, SortOrder } from '/@/renderer/api/types';
import { useMemo, useRef } from 'react';
import { GenreListSort, SortOrder } from '/@/renderer/api/types';
import { VirtualInfiniteGridRef } from '/@/renderer/components/virtual-grid';
import { ListContext } from '/@/renderer/context/list-context';
import { GenreListContent } from '/@/renderer/features/genres/components/genre-list-content';
import { GenreListHeader } from '/@/renderer/features/genres/components/genre-list-header';
import { useGenreList } from '/@/renderer/features/genres/queries/genre-list-query';
import { usePlayQueueAdd } from '/@/renderer/features/player';
import { AnimatedPage } from '/@/renderer/features/shared';
import { queryClient } from '/@/renderer/lib/react-query';
import { useCurrentServer } from '/@/renderer/store';
import { Play } from '/@/renderer/types';
const GenreListRoute = () => {
const gridRef = useRef<VirtualInfiniteGridRef | null>(null);
const tableRef = useRef<AgGridReactType | null>(null);
const server = useCurrentServer();
const handlePlayQueueAdd = usePlayQueueAdd();
const pageKey = 'genre';
const itemCountCheck = useGenreList({
@ -36,44 +30,11 @@ const GenreListRoute = () => {
? undefined
: itemCountCheck.data?.totalRecordCount;
const handlePlay = useCallback(
async (args: { initialSongId?: string; playType: Play }) => {
if (!itemCount || itemCount === 0) return;
const { playType } = args;
const query = {
startIndex: 0,
};
const queryKey = queryKeys.albums.list(server?.id || '', query);
const albumListRes = await queryClient.fetchQuery({
queryFn: ({ signal }) => {
return api.controller.getAlbumList({
apiClientProps: { server, signal },
query,
});
},
queryKey,
});
const albumIds = albumListRes?.items?.map((a) => a.id) || [];
handlePlayQueueAdd?.({
byItemType: {
id: albumIds,
type: LibraryItem.ALBUM,
},
playType,
});
},
[handlePlayQueueAdd, itemCount, server],
);
const providerValue = useMemo(() => {
return {
handlePlay,
pageKey,
};
}, [handlePlay]);
}, []);
return (
<AnimatedPage>

6
src/renderer/features/player/hooks/use-handle-playqueue-add.ts
View file

@ -25,6 +25,7 @@ import {
getAlbumSongsById,
getAlbumArtistSongsById,
getSongsByQuery,
getGenreSongsById,
} from '/@/renderer/features/player/utils';
import { queryKeys } from '/@/renderer/api/query-keys';
@ -38,6 +39,9 @@ const getRootQueryKey = (itemType: LibraryItem, serverId: string) => {
case LibraryItem.ALBUM_ARTIST:
queryKey = queryKeys.songs.list(serverId);
break;
case LibraryItem.GENRE:
queryKey = queryKeys.songs.list(serverId);
break;
case LibraryItem.PLAYLIST:
queryKey = queryKeys.playlists.songList(serverId);
break;
@ -112,6 +116,8 @@ export const useHandlePlayQueueAdd = () => {
queryClient,
server,
});
} else if (itemType === LibraryItem.GENRE) {
songList = await getGenreSongsById({ id, query, queryClient, server });
} else if (itemType === LibraryItem.SONG) {
if (id?.length === 1) {
songList = await getSongById({ id: id?.[0], queryClient, server });

61
src/renderer/features/player/utils.ts
View file

@ -9,7 +9,7 @@ import {
SongListSort,
SortOrder,
} from '/@/renderer/api/types';
import { ServerListItem } from '/@/renderer/types';
import { ServerListItem, ServerType } from '/@/renderer/types';
export const getPlaylistSongsById = async (args: {
id: string;
@ -86,6 +86,65 @@ export const getAlbumSongsById = async (args: {
return res;
};
export const getGenreSongsById = async (args: {
id: string[];
orderByIds?: boolean;
query?: Partial<SongListQuery>;
queryClient: QueryClient;
server: ServerListItem | null;
}) => {
const { id, queryClient, server, query } = args;
const data: SongListResponse = {
items: [],
startIndex: 0,
totalRecordCount: 0,
};
for (const genreId of id) {
const queryFilter: SongListQuery = {
_custom: {
...(server?.type === ServerType.JELLYFIN && {
jellyfin: {
GenreIds: genreId,
},
}),
...(server?.type === ServerType.NAVIDROME && {
navidrome: {
genre_id: genreId,
},
}),
},
sortBy: SongListSort.GENRE,
sortOrder: SortOrder.ASC,
startIndex: 0,
...query,
};
const queryKey = queryKeys.songs.list(server?.id, queryFilter);
const res = await queryClient.fetchQuery(
queryKey,
async ({ signal }) =>
api.controller.getSongList({
apiClientProps: {
server,
signal,
},
query: queryFilter,
}),
{
cacheTime: 1000 * 60,
staleTime: 1000 * 60,
},
);
data.items.push(...res!.items);
data.totalRecordCount += res!.totalRecordCount;
}
return data;
};
export const getAlbumArtistSongsById = async (args: {
id: string[];
orderByIds?: boolean;

14
src/renderer/features/playlists/components/add-to-playlist-context-modal.tsx
View file

@ -6,6 +6,7 @@ import { api } from '/@/renderer/api';
import { queryKeys } from '/@/renderer/api/query-keys';
import { PlaylistListSort, SongListQuery, SongListSort, SortOrder } from '/@/renderer/api/types';
import { Button, MultiSelect, Switch, toast } from '/@/renderer/components';
import { getGenreSongsById } from '/@/renderer/features/player';
import { useAddToPlaylist } from '/@/renderer/features/playlists/mutations/add-to-playlist-mutation';
import { usePlaylistList } from '/@/renderer/features/playlists/queries/playlist-list-query';
import { queryClient } from '/@/renderer/lib/react-query';
@ -17,9 +18,10 @@ export const AddToPlaylistContextModal = ({
}: ContextModalProps<{
albumId?: string[];
artistId?: string[];
genreId?: string[];
songId?: string[];
}>) => {
const { albumId, artistId, songId } = innerProps;
const { albumId, artistId, genreId, songId } = innerProps;
const server = useCurrentServer();
const [isLoading, setIsLoading] = useState(false);
@ -112,6 +114,16 @@ export const AddToPlaylistContextModal = ({
}
}
if (genreId && genreId.length > 0) {
const songs = await getGenreSongsById({
id: genreId,
queryClient,
server,
});
allSongIds.push(...(songs?.items?.map((song) => song.id) || []));
}
if (songId && songId.length > 0) {
allSongIds.push(...songId);
}