Update playqueueadd props

This commit is contained in:
jeffvli 2023-05-20 14:55:08 -07:00
parent 7dd56bfb9b
commit 02caf896ff
24 changed files with 53 additions and 44 deletions

View file

@ -122,7 +122,7 @@ export const CardControls = ({
id: [itemData.id], id: [itemData.id],
type: itemType, type: itemType,
}, },
play: playType || playButtonBehavior, playType: playType || playButtonBehavior,
}); });
}; };

View file

@ -134,7 +134,7 @@ export const GridCardControls = ({
id: [itemData.id], id: [itemData.id],
type: itemType, type: itemType,
}, },
play: playType || playButtonBehavior, playType: playType || playButtonBehavior,
}); });
}; };

View file

@ -210,7 +210,7 @@ export const AlbumDetailContent = ({ tableRef }: AlbumDetailContentProps) => {
const handlePlay = async (playType?: Play) => { const handlePlay = async (playType?: Play) => {
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: detailQuery?.data?.songs, byData: detailQuery?.data?.songs,
play: playType || playButtonBehavior, playType: playType || playButtonBehavior,
}); });
}; };
@ -218,9 +218,16 @@ export const AlbumDetailContent = ({ tableRef }: AlbumDetailContentProps) => {
const handleRowDoubleClick = (e: RowDoubleClickedEvent<QueueSong>) => { const handleRowDoubleClick = (e: RowDoubleClickedEvent<QueueSong>) => {
if (!e.data) return; if (!e.data) return;
const rowData: QueueSong[] = [];
e.api.forEachNode((node) => {
if (!node.data) return;
rowData.push(node.data);
});
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: [e.data], byData: rowData,
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -294,7 +294,7 @@ export const AlbumListHeaderFilters = ({
const handlePlayQueueAdd = usePlayQueueAdd(); const handlePlayQueueAdd = usePlayQueueAdd();
const handlePlay = async (play: Play) => { const handlePlay = async (playType: Play) => {
if (!itemCount || itemCount === 0 || !server) return; if (!itemCount || itemCount === 0 || !server) return;
const query = { const query = {
@ -327,7 +327,7 @@ export const AlbumListHeaderFilters = ({
id: albumIds, id: albumIds,
type: LibraryItem.ALBUM, type: LibraryItem.ALBUM,
}, },
play, playType,
}); });
}; };

View file

@ -165,7 +165,7 @@ export const AlbumListHeader = ({
const handlePlayQueueAdd = usePlayQueueAdd(); const handlePlayQueueAdd = usePlayQueueAdd();
const playButtonBehavior = usePlayButtonBehavior(); const playButtonBehavior = usePlayButtonBehavior();
const handlePlay = async (play: Play) => { const handlePlay = async (playType: Play) => {
if (!itemCount || itemCount === 0) return; if (!itemCount || itemCount === 0) return;
const query = { const query = {
@ -198,7 +198,7 @@ export const AlbumListHeader = ({
id: albumIds, id: albumIds,
type: LibraryItem.ALBUM, type: LibraryItem.ALBUM,
}, },
play, playType,
}); });
}; };

View file

@ -30,7 +30,7 @@ const AlbumDetailRoute = () => {
id: [albumId], id: [albumId],
type: LibraryItem.ALBUM, type: LibraryItem.ALBUM,
}, },
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -249,7 +249,7 @@ export const AlbumArtistDetailContent = () => {
id: [albumArtistId], id: [albumArtistId],
type: LibraryItem.ALBUM_ARTIST, type: LibraryItem.ALBUM_ARTIST,
}, },
play: playType || playButtonBehavior, playType: playType || playButtonBehavior,
}); });
}; };
@ -259,7 +259,7 @@ export const AlbumArtistDetailContent = () => {
if (!e.data) return; if (!e.data) return;
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: [e.data], byData: [e.data],
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -36,7 +36,7 @@ export const AlbumArtistDetailTopSongsListContent = ({
if (!e.data) return; if (!e.data) return;
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: [e.data], byData: [e.data],
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -20,10 +20,10 @@ export const AlbumArtistDetailTopSongsListHeader = ({
const handlePlayQueueAdd = usePlayQueueAdd(); const handlePlayQueueAdd = usePlayQueueAdd();
const playButtonBehavior = usePlayButtonBehavior(); const playButtonBehavior = usePlayButtonBehavior();
const handlePlay = async (play: Play) => { const handlePlay = async (playType: Play) => {
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: data, byData: data,
play, playType,
}); });
}; };

View file

@ -28,7 +28,7 @@ const AlbumArtistDetailRoute = () => {
id: [albumArtistId], id: [albumArtistId],
type: LibraryItem.ALBUM_ARTIST, type: LibraryItem.ALBUM_ARTIST,
}, },
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -153,34 +153,34 @@ export const ContextMenuProvider = ({ children }: ContextMenuProviderProps) => {
}); });
const handlePlay = useCallback( const handlePlay = useCallback(
(play: Play) => { (playType: Play) => {
switch (ctx.type) { switch (ctx.type) {
case LibraryItem.ALBUM: case LibraryItem.ALBUM:
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { id: ctx.data.map((item) => item.id), type: ctx.type }, byItemType: { id: ctx.data.map((item) => item.id), type: ctx.type },
play, playType,
}); });
break; break;
case LibraryItem.ARTIST: case LibraryItem.ARTIST:
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { id: ctx.data.map((item) => item.id), type: ctx.type }, byItemType: { id: ctx.data.map((item) => item.id), type: ctx.type },
play, playType,
}); });
break; break;
case LibraryItem.ALBUM_ARTIST: case LibraryItem.ALBUM_ARTIST:
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { id: ctx.data.map((item) => item.id), type: ctx.type }, byItemType: { id: ctx.data.map((item) => item.id), type: ctx.type },
play, playType,
}); });
break; break;
case LibraryItem.SONG: case LibraryItem.SONG:
handlePlayQueueAdd?.({ byData: ctx.data, play }); handlePlayQueueAdd?.({ byData: ctx.data, playType });
break; break;
case LibraryItem.PLAYLIST: case LibraryItem.PLAYLIST:
for (const item of ctx.data) { for (const item of ctx.data) {
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { id: [item.id], type: ctx.type }, byItemType: { id: [item.id], type: ctx.type },
play, playType,
}); });
} }

View file

@ -154,7 +154,7 @@ export const PlaylistDetailContent = ({ tableRef }: PlaylistDetailContentProps)
id: [playlistId], id: [playlistId],
type: LibraryItem.PLAYLIST, type: LibraryItem.PLAYLIST,
}, },
play: playType || playButtonBehavior, playType: playType || playButtonBehavior,
}); });
}; };
@ -203,7 +203,7 @@ export const PlaylistDetailContent = ({ tableRef }: PlaylistDetailContentProps)
if (!e.data) return; if (!e.data) return;
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: [e.data], byData: [e.data],
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -214,7 +214,7 @@ export const PlaylistDetailSongListContent = ({ tableRef }: PlaylistDetailConten
if (!e.data) return; if (!e.data) return;
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: [e.data], byData: [e.data],
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -234,7 +234,7 @@ export const PlaylistDetailSongListHeaderFilters = ({
const handlePlay = async (playType: Play) => { const handlePlay = async (playType: Play) => {
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { id: [playlistId], type: LibraryItem.PLAYLIST }, byItemType: { id: [playlistId], type: LibraryItem.PLAYLIST },
play: playType, playType,
}); });
}; };

View file

@ -31,7 +31,7 @@ export const PlaylistDetailSongListHeader = ({
const handlePlay = async (playType: Play) => { const handlePlay = async (playType: Play) => {
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { id: [playlistId], type: LibraryItem.PLAYLIST }, byItemType: { id: [playlistId], type: LibraryItem.PLAYLIST },
play: playType, playType,
}); });
}; };

View file

@ -35,7 +35,7 @@ const PlaylistDetailRoute = () => {
id: [playlistId], id: [playlistId],
type: LibraryItem.PLAYLIST, type: LibraryItem.PLAYLIST,
}, },
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -89,14 +89,14 @@ export const LibraryCommandItem = ({
} }
const handlePlay = useCallback( const handlePlay = useCallback(
(e: MouseEvent, id: string, play: Play) => { (e: MouseEvent, id: string, playType: Play) => {
e.stopPropagation(); e.stopPropagation();
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { byItemType: {
id, id,
type: itemType, type: itemType,
}, },
play, playType,
}); });
}, },
[handlePlayQueueAdd, itemType], [handlePlayQueueAdd, itemType],

View file

@ -110,7 +110,7 @@ export const SearchContent = ({ tableRef, getDatasource }: SearchContentProps) =
case LibraryItem.SONG: case LibraryItem.SONG:
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: [e.data], byData: [e.data],
play: playButtonBehavior, playType: playButtonBehavior,
}); });
break; break;
} }

View file

@ -119,13 +119,13 @@ export const SidebarPlaylistList = ({ data }: SidebarPlaylistListProps) => {
const [debounced] = useDebouncedValue(rect, 25); const [debounced] = useDebouncedValue(rect, 25);
const handlePlayPlaylist = useCallback( const handlePlayPlaylist = useCallback(
(id: string, play: Play) => { (id: string, playType: Play) => {
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byItemType: { byItemType: {
id: [id], id: [id],
type: LibraryItem.PLAYLIST, type: LibraryItem.PLAYLIST,
}, },
play, playType,
}); });
}, },
[handlePlayQueueAdd], [handlePlayQueueAdd],

View file

@ -162,7 +162,7 @@ export const SongListContent = ({ itemCount, tableRef }: SongListContentProps) =
if (!e.data) return; if (!e.data) return;
handlePlayQueueAdd?.({ handlePlayQueueAdd?.({
byData: [e.data], byData: [e.data],
play: playButtonBehavior, playType: playButtonBehavior,
}); });
}; };

View file

@ -261,7 +261,7 @@ export const SongListHeaderFilters = ({
handleFilterChange(filter); handleFilterChange(filter);
}; };
const handlePlay = async (play: Play) => { const handlePlay = async (playType: Play) => {
if (!itemCount || itemCount === 0) return; if (!itemCount || itemCount === 0) return;
const query: SongListQuery = { startIndex: 0, ...filter, ...customFilters }; const query: SongListQuery = { startIndex: 0, ...filter, ...customFilters };
@ -270,7 +270,7 @@ export const SongListHeaderFilters = ({
id: query, id: query,
type: LibraryItem.SONG, type: LibraryItem.SONG,
}, },
play, playType,
}); });
}; };

View file

@ -94,7 +94,7 @@ export const SongListHeader = ({
const playButtonBehavior = usePlayButtonBehavior(); const playButtonBehavior = usePlayButtonBehavior();
const handlePlay = async (play: Play) => { const handlePlay = async (playType: Play) => {
if (!itemCount || itemCount === 0) return; if (!itemCount || itemCount === 0) return;
const query: SongListQuery = { startIndex: 0, ...filter, ...customFilters }; const query: SongListQuery = { startIndex: 0, ...filter, ...customFilters };
@ -103,7 +103,7 @@ export const SongListHeader = ({
id: query, id: query,
type: LibraryItem.SONG, type: LibraryItem.SONG,
}, },
play, playType,
}); });
}; };

View file

@ -56,7 +56,7 @@ export interface QueueData {
export interface PlayerSlice extends PlayerState { export interface PlayerSlice extends PlayerState {
actions: { actions: {
addToQueue: (songs: QueueSong[], type: Play) => PlayerData; addToQueue: (args: { initialIndex: number; playType: Play; songs: QueueSong[] }) => PlayerData;
autoNext: () => PlayerData; autoNext: () => PlayerData;
checkIsFirstTrack: () => boolean; checkIsFirstTrack: () => boolean;
checkIsLastTrack: () => boolean; checkIsLastTrack: () => boolean;
@ -95,7 +95,8 @@ export const usePlayerStore = create<PlayerSlice>()(
devtools( devtools(
immer((set, get) => ({ immer((set, get) => ({
actions: { actions: {
addToQueue: (songs, type) => { addToQueue: (args) => {
const { playType, songs } = args;
const { shuffledIndex } = get().current; const { shuffledIndex } = get().current;
const shuffledQueue = get().queue.shuffled; const shuffledQueue = get().queue.shuffled;
const queueSongs = map(songs, (song) => ({ const queueSongs = map(songs, (song) => ({
@ -103,7 +104,7 @@ export const usePlayerStore = create<PlayerSlice>()(
uniqueId: nanoid(), uniqueId: nanoid(),
})); }));
if (type === Play.NOW) { if (playType === Play.NOW) {
if (get().shuffle === PlayerShuffle.TRACK) { if (get().shuffle === PlayerShuffle.TRACK) {
const shuffledSongs = shuffle(queueSongs); const shuffledSongs = shuffle(queueSongs);
const foundIndex = queueSongs.findIndex( const foundIndex = queueSongs.findIndex(
@ -131,7 +132,7 @@ export const usePlayerStore = create<PlayerSlice>()(
state.current.song = queueSongs[0]; state.current.song = queueSongs[0];
}); });
} }
} else if (type === Play.LAST) { } else if (playType === Play.LAST) {
// Shuffle the queue after the current track // Shuffle the queue after the current track
const shuffledQueueWithNewSongs = const shuffledQueueWithNewSongs =
get().shuffle === PlayerShuffle.TRACK get().shuffle === PlayerShuffle.TRACK
@ -148,7 +149,7 @@ export const usePlayerStore = create<PlayerSlice>()(
state.queue.default = [...get().queue.default, ...queueSongs]; state.queue.default = [...get().queue.default, ...queueSongs];
state.queue.shuffled = shuffledQueueWithNewSongs; state.queue.shuffled = shuffledQueueWithNewSongs;
}); });
} else if (type === Play.NEXT) { } else if (playType === Play.NEXT) {
const queue = get().queue.default; const queue = get().queue.default;
const currentIndex = get().current.index; const currentIndex = get().current.index;

View file

@ -154,7 +154,8 @@ export type PlayQueueAddOptions = {
id: string[] | any; id: string[] | any;
type: LibraryItem; type: LibraryItem;
}; };
play: Play; initialIndex?: number;
playType: Play;
}; };
export type GridCardData = { export type GridCardData = {