From d74345f5eee906ef26fd4b6757e8a13bdfb145a2 Mon Sep 17 00:00:00 2001 From: jeffvli Date: Sat, 16 Oct 2021 03:34:51 -0700 Subject: [PATCH] Add context menu option to view song in folder --- src/components/library/AlbumList.tsx | 7 +- src/components/library/ArtistList.tsx | 7 +- src/components/library/ArtistView.tsx | 7 +- src/components/library/FolderList.tsx | 16 +- src/components/library/GenreList.tsx | 1 + src/components/playlist/PlaylistList.tsx | 1 + src/components/shared/ContextMenu.tsx | 184 +++++++++++---------- src/components/viewtypes/ListViewTable.tsx | 2 +- src/redux/miscSlice.ts | 1 + 9 files changed, 136 insertions(+), 90 deletions(-) diff --git a/src/components/library/AlbumList.tsx b/src/components/library/AlbumList.tsx index c5f5afc..e0b7e63 100644 --- a/src/components/library/AlbumList.tsx +++ b/src/components/library/AlbumList.tsx @@ -188,7 +188,12 @@ const AlbumList = () => { }} listType="album" virtualized - disabledContextMenuOptions={['moveSelectedTo', 'removeFromCurrent', 'deletePlaylist']} + disabledContextMenuOptions={[ + 'moveSelectedTo', + 'removeFromCurrent', + 'deletePlaylist', + 'viewInFolder', + ]} handleFavorite={handleRowFavorite} /> )} diff --git a/src/components/library/ArtistList.tsx b/src/components/library/ArtistList.tsx index 01de9db..2f73b77 100644 --- a/src/components/library/ArtistList.tsx +++ b/src/components/library/ArtistList.tsx @@ -131,7 +131,12 @@ const ArtistList = () => { }} listType="artist" virtualized - disabledContextMenuOptions={['moveSelectedTo', 'removeFromCurrent', 'deletePlaylist']} + disabledContextMenuOptions={[ + 'moveSelectedTo', + 'removeFromCurrent', + 'deletePlaylist', + 'viewInFolder', + ]} handleFavorite={handleRowFavorite} /> )} diff --git a/src/components/library/ArtistView.tsx b/src/components/library/ArtistView.tsx index 1a2e31b..df8e6b6 100644 --- a/src/components/library/ArtistView.tsx +++ b/src/components/library/ArtistView.tsx @@ -283,7 +283,12 @@ const ArtistView = ({ ...rest }: any) => { }} listType="album" isModal={rest.isModal} - disabledContextMenuOptions={['removeFromCurrent', 'moveSelectedTo', 'deletePlaylist']} + disabledContextMenuOptions={[ + 'removeFromCurrent', + 'moveSelectedTo', + 'deletePlaylist', + 'viewInFolder', + ]} handleFavorite={handleRowFavorite} /> )} diff --git a/src/components/library/FolderList.tsx b/src/components/library/FolderList.tsx index 829c56a..b9750ce 100644 --- a/src/components/library/FolderList.tsx +++ b/src/components/library/FolderList.tsx @@ -1,6 +1,7 @@ -import React, { useState } from 'react'; +import React, { useEffect, useState } from 'react'; import settings from 'electron-settings'; import { useQuery } from 'react-query'; +import { useHistory } from 'react-router-dom'; import { ButtonToolbar, Icon } from 'rsuite'; import { getIndexes, getMusicDirectory } from '../../api/api'; import PageLoader from '../loader/PageLoader'; @@ -19,9 +20,12 @@ import { fixPlayer2Index, setPlayQueueByRowClick } from '../../redux/playQueueSl import { setStatus } from '../../redux/playerSlice'; import useSearchQuery from '../../hooks/useSearchQuery'; import { setFolder } from '../../redux/folderSlice'; +import useRouterQuery from '../../hooks/useRouterQuery'; const FolderList = () => { const dispatch = useAppDispatch(); + const history = useHistory(); + const query = useRouterQuery(); const folder = useAppSelector((state) => state.folder); const { isLoading, isError, data, error }: any = useQuery(['folders'], () => getIndexes(), { refetchOnReconnect: false, @@ -46,6 +50,12 @@ const FolderList = () => { 'path', ]); + useEffect(() => { + if (query.get('folderId') !== 'null') { + dispatch(setFolder({ id: query.get('folderId') || undefined })); + } + }, [dispatch, query]); + let timeout: any = null; const handleRowClick = (e: any, rowData: any) => { if (timeout === null) { @@ -68,6 +78,7 @@ const FolderList = () => { dispatch(clearSelected()); if (rowData.isDir) { + history.push(`/library/folder?folderId=${rowData.id}`); dispatch(setFolder({ id: rowData.id })); } else { dispatch( @@ -108,6 +119,7 @@ const FolderList = () => { valueKey="id" virtualized onChange={(e: string) => { + history.push(`/library/folder?folderId=${e}`); dispatch(setFolder({ id: e })); }} /> @@ -117,6 +129,7 @@ const FolderList = () => { disabled={!folderData?.parent} onClick={() => { if (folderData?.parent) { + history.push(`/library/folder?folderId=${folderData?.parent}`); dispatch(setFolder({ id: folderData?.parent })); } }} @@ -151,6 +164,7 @@ const FolderList = () => { 'moveSelectedTo', 'removeFromCurrent', 'deletePlaylist', + 'viewInFolder', ]} /> diff --git a/src/components/library/GenreList.tsx b/src/components/library/GenreList.tsx index 70e20fc..243002c 100644 --- a/src/components/library/GenreList.tsx +++ b/src/components/library/GenreList.tsx @@ -87,6 +87,7 @@ const GenreList = () => { 'addToFavorites', 'removeFromFavorites', 'viewInModal', + 'viewInFolder', ]} /> )} diff --git a/src/components/playlist/PlaylistList.tsx b/src/components/playlist/PlaylistList.tsx index c8946d0..6066a97 100644 --- a/src/components/playlist/PlaylistList.tsx +++ b/src/components/playlist/PlaylistList.tsx @@ -179,6 +179,7 @@ const PlaylistList = () => { 'addToFavorites', 'removeFromFavorites', 'removeFromCurrent', + 'viewInFolder', ]} /> )} diff --git a/src/components/shared/ContextMenu.tsx b/src/components/shared/ContextMenu.tsx index 6a2d848..f753324 100644 --- a/src/components/shared/ContextMenu.tsx +++ b/src/components/shared/ContextMenu.tsx @@ -514,6 +514,15 @@ export const GlobalContextMenu = () => { } }; + const handleViewInFolder = () => { + dispatch(setContextMenu({ show: false })); + if (misc.contextMenu.type.match('music|nowPlaying') && multiSelect.selected.length === 1) { + history.push(`/library/folder?folderId=${multiSelect.selected[0].parent}`); + } else { + notifyToast('error', 'Select only one row'); + } + }; + return ( <> {misc.contextMenu.show && ( @@ -521,7 +530,7 @@ export const GlobalContextMenu = () => { xPos={misc.contextMenu.xPos} yPos={misc.contextMenu.yPos} width={190} - numOfButtons={10} + numOfButtons={11} numOfDividers={3} > { onClick={handleRemoveFromCurrent} disabled={misc.contextMenu.disabledOptions.includes('removeFromCurrent')} /> + +
+ + setIndexToMoveTo(e)} + /> + playQueue[getCurrentEntryList(playQueue)]?.length + : indexToMoveTo > playlist.entry?.length) || indexToMoveTo < 0 + } + > + Go + + +
+ + + + + } + onClick={handleMoveToTop} + block + > + Top + + + + } + onClick={handleMoveUpOne} + block + > + Up + + + + + + } + onClick={handleMoveToBottom} + block + > + Bottom + + + + + } + onClick={handleMoveDownOne} + block + > + Down + + + + + + } + > + + { onClick={handleViewInModal} disabled={misc.contextMenu.disabledOptions.includes('viewInModal')} /> - -
- - setIndexToMoveTo(e)} - /> - playQueue[getCurrentEntryList(playQueue)]?.length - : indexToMoveTo > playlist.entry?.length) || indexToMoveTo < 0 - } - > - Go - - -
- - - - - } - onClick={handleMoveToTop} - block - > - Top - - - - } - onClick={handleMoveUpOne} - block - > - Up - - - - - - } - onClick={handleMoveToBottom} - block - > - Bottom - - - - - } - onClick={handleMoveDownOne} - block - > - Down - - - - - - } - > - - + )} diff --git a/src/components/viewtypes/ListViewTable.tsx b/src/components/viewtypes/ListViewTable.tsx index 16e3577..f3ea775 100644 --- a/src/components/viewtypes/ListViewTable.tsx +++ b/src/components/viewtypes/ListViewTable.tsx @@ -290,7 +290,7 @@ const ListViewTable = ({ // Use the calculated ContextMenu height // numOfButtons * 30 + props.numOfDividers * 1.5 - const contextMenuHeight = 9 * 30 + 3 * 1.5; + const contextMenuHeight = 11 * 30 + 3 * 1.5; if (e.pageY + contextMenuHeight >= window.innerHeight) { pageY = e.pageY - contextMenuHeight; } else { diff --git a/src/redux/miscSlice.ts b/src/redux/miscSlice.ts index 6ea7425..987a5a4 100644 --- a/src/redux/miscSlice.ts +++ b/src/redux/miscSlice.ts @@ -26,6 +26,7 @@ type ContextMenuOptions = | 'addToFavorites' | 'removeFromFavorites' | 'viewInModal' + | 'viewInFolder' | 'moveSelectedTo'; export interface ContextMenu {