diff --git a/ui/src/album/AlbumGridView.js b/ui/src/album/AlbumGridView.js index 7808f2b9e..94cddf9c9 100644 --- a/ui/src/album/AlbumGridView.js +++ b/ui/src/album/AlbumGridView.js @@ -19,6 +19,7 @@ import { ArtistLinkField, RangeField, } from '../common' +import { DraggableTypes } from '../consts' const useStyles = makeStyles( (theme) => ({ @@ -103,7 +104,7 @@ const Cover = withContentRect('bounds')( // noinspection JSSuspiciousNameCombination const classes = useCoverStyles({ height: contentRect.bounds.width }) const [, dragAlbumRef] = useDrag(() => ({ - type: 'album', + type: DraggableTypes.ALBUM, item: { albumIds: [record.id] }, options: { dropEffect: 'copy' }, })) diff --git a/ui/src/album/AlbumTableView.js b/ui/src/album/AlbumTableView.js index 70432b103..5d96340a7 100644 --- a/ui/src/album/AlbumTableView.js +++ b/ui/src/album/AlbumTableView.js @@ -20,6 +20,7 @@ import { useSelectedFields, } from '../common' import config from '../config' +import { DraggableTypes } from '../consts' const useStyles = makeStyles({ columnIcon: { @@ -51,7 +52,7 @@ const useStyles = makeStyles({ const AlbumDatagridRow = (props) => { const { record } = props const [, dragAlbumRef] = useDrag(() => ({ - type: 'album', + type: DraggableTypes.ALBUM, item: { albumIds: [record.id] }, options: { dropEffect: 'copy' }, })) diff --git a/ui/src/artist/ArtistList.js b/ui/src/artist/ArtistList.js index d919d1996..e8bda4d3f 100644 --- a/ui/src/artist/ArtistList.js +++ b/ui/src/artist/ArtistList.js @@ -30,6 +30,7 @@ import { } from '../common' import config from '../config' import ArtistListActions from './ArtistListActions' +import { DraggableTypes } from '../consts' const useStyles = makeStyles({ contextHeader: { @@ -84,7 +85,7 @@ const ArtistFilter = (props) => { const ArtistDatagridRow = (props) => { const { record } = props const [, dragArtistRef] = useDrag(() => ({ - type: 'artist', + type: DraggableTypes.ARTIST, item: { artistIds: [record.id] }, options: { dropEffect: 'copy' }, })) diff --git a/ui/src/common/SongDatagrid.js b/ui/src/common/SongDatagrid.js index 4aea81d89..c948fbfe3 100644 --- a/ui/src/common/SongDatagrid.js +++ b/ui/src/common/SongDatagrid.js @@ -14,6 +14,7 @@ import clsx from 'clsx' import { useDrag } from 'react-dnd' import { playTracks } from '../actions' import { AlbumContextMenu } from '../common' +import { DraggableTypes } from '../consts' const useStyles = makeStyles({ subtitle: { @@ -106,7 +107,7 @@ export const SongDatagridRow = ({ ) const [, dragDiscRef] = useDrag(() => ({ - type: 'disc', + type: DraggableTypes.DISC, item: { discs: [{ albumId: record.albumId, discNumber: record.discNumber }], }, @@ -114,7 +115,7 @@ export const SongDatagridRow = ({ })) const [, dragSongRef] = useDrag(() => ({ - type: 'song', + type: DraggableTypes.SONG, item: { ids: [record.id] }, options: { dropEffect: 'copy' }, })) diff --git a/ui/src/consts.js b/ui/src/consts.js index 140e2b3ae..bda543514 100644 --- a/ui/src/consts.js +++ b/ui/src/consts.js @@ -3,3 +3,18 @@ export const REST_URL = '/api' export const M3U_MIME_TYPE = 'audio/x-mpegurl' export const AUTO_THEME_ID = 'AUTO_THEME_ID' + +export const DraggableTypes = { + SONG: 'song', + ALBUM: 'album', + DISC: 'disc', + ARTIST: 'artist', + ALL: [], +} + +DraggableTypes.ALL.push( + DraggableTypes.SONG, + DraggableTypes.ALBUM, + DraggableTypes.DISC, + DraggableTypes.ARTIST +) diff --git a/ui/src/layout/PlaylistsSubMenu.js b/ui/src/layout/PlaylistsSubMenu.js index e76a9267f..49d4611be 100644 --- a/ui/src/layout/PlaylistsSubMenu.js +++ b/ui/src/layout/PlaylistsSubMenu.js @@ -12,35 +12,28 @@ import QueueMusicOutlinedIcon from '@material-ui/icons/QueueMusicOutlined' import { BiCog } from 'react-icons/all' import { useDrop } from 'react-dnd' import SubMenu from './SubMenu' +import { isWritable } from '../common' +import { DraggableTypes } from '../consts' const PlaylistMenuItemLink = ({ pls, sidebarIsOpen }) => { const dataProvider = useDataProvider() const notify = useNotify() - const addToPlaylist = (playlistId, data) => { - dataProvider - .addToPlaylist(playlistId, data) - .then((res) => { - notify('message.songsAddedToPlaylist', 'info', { - smart_count: res.data?.added, - }) - }) - .catch(() => { - notify('ra.page.error', 'warning') - }) - } - const [, dropRef] = useDrop(() => ({ - accept: ['song', 'album', 'disc', 'artist'], - drop: (item) => { - addToPlaylist(pls.id, item) - }, + accept: isWritable(pls.owner) ? DraggableTypes.ALL : [], + drop: (item) => + dataProvider + .addToPlaylist(pls.id, item) + .then((res) => { + notify('message.songsAddedToPlaylist', 'info', { + smart_count: res.data?.added, + }) + }) + .catch(() => { + notify('ra.page.error', 'warning') + }), })) - if (!pls) { - return null - } - return (