mirror of
https://github.com/antebudimir/feishin.git
synced 2026-01-03 03:11:40 +00:00
client-side only sort for all playlists (#1125)
* initial client-side only sort for all playlists * allow reordering jellyfin (assume it works properly) and navidrome * on playlist page, add to queue by sort order
This commit is contained in:
parent
d68165dab5
commit
1d46cd5ff9
16 changed files with 135 additions and 247 deletions
|
|
@ -2,7 +2,7 @@ import type { AgGridReact as AgGridReactType } from '@ag-grid-community/react/li
|
|||
|
||||
import { closeAllModals, openModal } from '@mantine/modals';
|
||||
import { motion } from 'motion/react';
|
||||
import { useRef, useState } from 'react';
|
||||
import { useMemo, useRef, useState } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { generatePath, useNavigate, useParams } from 'react-router';
|
||||
|
||||
|
|
@ -22,12 +22,7 @@ import { Box } from '/@/shared/components/box/box';
|
|||
import { Group } from '/@/shared/components/group/group';
|
||||
import { Text } from '/@/shared/components/text/text';
|
||||
import { toast } from '/@/shared/components/toast/toast';
|
||||
import {
|
||||
PlaylistSongListQuery,
|
||||
ServerType,
|
||||
SongListSort,
|
||||
SortOrder,
|
||||
} from '/@/shared/types/domain-types';
|
||||
import { ServerType, SongListSort, SortOrder, sortSongList } from '/@/shared/types/domain-types';
|
||||
|
||||
const PlaylistDetailSongListRoute = () => {
|
||||
const { t } = useTranslation();
|
||||
|
|
@ -148,22 +143,25 @@ const PlaylistDetailSongListRoute = () => {
|
|||
};
|
||||
|
||||
const page = usePlaylistDetailStore();
|
||||
const filters: Partial<PlaylistSongListQuery> = {
|
||||
sortBy: page?.table.id[playlistId]?.filter?.sortBy || SongListSort.ID,
|
||||
sortOrder: page?.table.id[playlistId]?.filter?.sortOrder || SortOrder.ASC,
|
||||
};
|
||||
|
||||
const itemCountCheck = usePlaylistSongList({
|
||||
const playlistSongs = usePlaylistSongList({
|
||||
query: {
|
||||
id: playlistId,
|
||||
limit: 1,
|
||||
startIndex: 0,
|
||||
...filters,
|
||||
},
|
||||
serverId: server?.id,
|
||||
});
|
||||
|
||||
const itemCount = itemCountCheck.data?.totalRecordCount || itemCountCheck.data?.items.length;
|
||||
const itemCount = playlistSongs.data?.totalRecordCount ?? undefined;
|
||||
|
||||
const filterSortedSongs = useMemo(() => {
|
||||
if (playlistSongs.data?.items) {
|
||||
const sortBy = page?.table.id[playlistId]?.filter?.sortBy || SongListSort.ID;
|
||||
const sortOrder = page?.table.id[playlistId]?.filter?.sortOrder || SortOrder.ASC;
|
||||
return sortSongList(playlistSongs.data?.items, sortBy, sortOrder);
|
||||
} else {
|
||||
return [];
|
||||
}
|
||||
}, [playlistSongs.data?.items, page?.table.id, playlistId]);
|
||||
|
||||
return (
|
||||
<AnimatedPage key={`playlist-detail-songList-${playlistId}`}>
|
||||
|
|
@ -203,12 +201,7 @@ const PlaylistDetailSongListRoute = () => {
|
|||
</Box>
|
||||
</motion.div>
|
||||
)}
|
||||
<PlaylistDetailSongListContent
|
||||
songs={
|
||||
server?.type === ServerType.SUBSONIC ? itemCountCheck.data?.items : undefined
|
||||
}
|
||||
tableRef={tableRef}
|
||||
/>
|
||||
<PlaylistDetailSongListContent songs={filterSortedSongs} tableRef={tableRef} />
|
||||
</AnimatedPage>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue