From 4e6305411cfbfda6ce177d4184c24ab7792070e1 Mon Sep 17 00:00:00 2001 From: jeffvli Date: Sun, 26 Sep 2021 16:02:13 -0700 Subject: [PATCH] Add move to index for playlist view --- src/components/playlist/PlaylistView.tsx | 5 +++- src/components/shared/ContextMenu.tsx | 32 ++++++++++++++++++------ src/redux/playlistSlice.ts | 7 ++++-- 3 files changed, 34 insertions(+), 10 deletions(-) diff --git a/src/components/playlist/PlaylistView.tsx b/src/components/playlist/PlaylistView.tsx index b5e35eb..2887481 100644 --- a/src/components/playlist/PlaylistView.tsx +++ b/src/components/playlist/PlaylistView.tsx @@ -244,7 +244,10 @@ const PlaylistView = ({ ...rest }) => { const handleDragEnd = () => { if (multiSelect.isDragging) { dispatch( - moveToIndex({ entries: multiSelect.selected, moveBeforeId: multiSelect.currentMouseOverId }) + moveToIndex({ + selectedEntries: multiSelect.selected, + moveBeforeId: multiSelect.currentMouseOverId, + }) ); dispatch(setIsDragging(false)); } diff --git a/src/components/shared/ContextMenu.tsx b/src/components/shared/ContextMenu.tsx index 5454e73..e405309 100644 --- a/src/components/shared/ContextMenu.tsx +++ b/src/components/shared/ContextMenu.tsx @@ -29,6 +29,7 @@ import { setStar, } from '../../redux/playQueueSlice'; import { + moveToIndex as plMoveToIndex, moveToBottom as plMoveToBottom, moveToTop as plMoveToTop, moveUp as plMoveUp, @@ -88,6 +89,7 @@ export const GlobalContextMenu = () => { const history = useHistory(); const dispatch = useAppDispatch(); const queryClient = useQueryClient(); + const playlist = useAppSelector((state) => state.playlist); const playQueue = useAppSelector((state) => state.playQueue); const misc = useAppSelector((state) => state.misc); const multiSelect = useAppSelector((state) => state.multiSelect); @@ -242,10 +244,21 @@ export const GlobalContextMenu = () => { }; const handleMoveSelectedToIndex = () => { - const currentEntryList = getCurrentEntryList(playQueue); - const uniqueIdOfIndexToMoveTo = playQueue[currentEntryList][indexToMoveTo].uniqueId; - - dispatch(moveToIndex({ entries: multiSelect.selected, moveBeforeId: uniqueIdOfIndexToMoveTo })); + if (misc.contextMenu.type === 'nowPlaying') { + const currentEntryList = getCurrentEntryList(playQueue); + const uniqueIdOfIndexToMoveTo = playQueue[currentEntryList][indexToMoveTo].uniqueId; + dispatch( + moveToIndex({ entries: multiSelect.selected, moveBeforeId: uniqueIdOfIndexToMoveTo }) + ); + } else { + const uniqueIdOfIndexToMoveTo = playlist.entry[indexToMoveTo].uniqueId; + dispatch( + plMoveToIndex({ + selectedEntries: multiSelect.selected, + moveBeforeId: uniqueIdOfIndexToMoveTo, + }) + ); + } }; const handleMoveToTop = () => { @@ -417,7 +430,11 @@ export const GlobalContextMenu = () => { setIndexToMoveTo(e)} /> @@ -425,8 +442,9 @@ export const GlobalContextMenu = () => { type="submit" onClick={handleMoveSelectedToIndex} disabled={ - indexToMoveTo > playQueue[getCurrentEntryList(playQueue)].length || - indexToMoveTo < 0 + (misc.contextMenu.type === 'nowPlaying' + ? indexToMoveTo > playQueue[getCurrentEntryList(playQueue)].length + : indexToMoveTo > playlist.entry.length) || indexToMoveTo < 0 } > Go diff --git a/src/redux/playlistSlice.ts b/src/redux/playlistSlice.ts index 1f33435..7d4b7de 100644 --- a/src/redux/playlistSlice.ts +++ b/src/redux/playlistSlice.ts @@ -30,10 +30,13 @@ const playlistSlice = createSlice({ state.entry = state.entry.filter((entry) => !uniqueIds.includes(entry.uniqueId)); }, - moveToIndex: (state, action: PayloadAction<{ entries: Entry[]; moveBeforeId: string }>) => { + moveToIndex: ( + state, + action: PayloadAction<{ selectedEntries: Entry[]; moveBeforeId: string }> + ) => { state.entry = moveSelectedToIndex( state.entry, - action.payload.entries, + action.payload.selectedEntries, action.payload.moveBeforeId ); },