diff --git a/ui/src/common/AddToPlaylistMenu.js b/ui/src/common/AddToPlaylistMenu.js index f88b8032c..3e82e64a1 100644 --- a/ui/src/common/AddToPlaylistMenu.js +++ b/ui/src/common/AddToPlaylistMenu.js @@ -22,7 +22,7 @@ export const addAlbumToPlaylist = (dataProvider, albumId, playlistId) => .then((ids) => addTracksToPlaylist(dataProvider, ids, playlistId)) const AddToPlaylistMenu = React.forwardRef( - ({ selectedIds, albumId, onClose }, ref) => { + ({ selectedIds, albumId, onClose, onItemAdded }, ref) => { const notify = useNotify() const dataProvider = useDataProvider() const { ids, data, loaded } = useGetList( @@ -38,22 +38,23 @@ const AddToPlaylistMenu = React.forwardRef( const handleItemClick = (e) => { e.preventDefault() - const value = e.target.getAttribute('value') - if (value !== '') { + const playlistId = e.target.getAttribute('value') + if (playlistId !== '') { const add = albumId - ? addAlbumToPlaylist(dataProvider, albumId, value) - : addTracksToPlaylist(dataProvider, selectedIds, value) + ? addAlbumToPlaylist(dataProvider, albumId, playlistId) + : addTracksToPlaylist(dataProvider, selectedIds, playlistId) add .then((len) => { notify('message.songsAddedToPlaylist', 'info', { smart_count: len }) + onItemAdded && onItemAdded(playlistId, selectedIds) }) .catch(() => { notify('ra.page.error', 'warning') }) } e.stopPropagation() - onClose && onClose() + onClose && onClose(e) } return ( @@ -71,6 +72,8 @@ const AddToPlaylistMenu = React.forwardRef( AddToPlaylistMenu.propTypes = { selectedIds: PropTypes.arrayOf(PropTypes.any).isRequired, albumId: PropTypes.string, + onClose: PropTypes.func, + onItemAdded: PropTypes.func, } AddToPlaylistMenu.defaultProps = { diff --git a/ui/src/playlist/PlaylistSongs.js b/ui/src/playlist/PlaylistSongs.js index a638edafb..bfec7d04a 100644 --- a/ui/src/playlist/PlaylistSongs.js +++ b/ui/src/playlist/PlaylistSongs.js @@ -6,11 +6,13 @@ import { ListToolbar, TextField, useListController, + useRefresh, } from 'react-admin' import classnames from 'classnames' import { Card, useMediaQuery } from '@material-ui/core' import { makeStyles } from '@material-ui/core/styles' import { DurationField, SongDetails } from '../common' +import { SongContextMenu } from '../song/SongContextMenu' const useStyles = makeStyles( (theme) => ({ @@ -54,6 +56,7 @@ const PlaylistSongs = (props) => { const isXsmall = useMediaQuery((theme) => theme.breakpoints.down('xs')) // const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('md')) const controllerProps = useListController(props) + const refresh = useRefresh() const { bulkActionButtons, expand, className, playlistId } = props const { data, ids, version, loaded } = controllerProps @@ -65,6 +68,12 @@ const PlaylistSongs = (props) => { return
} + const onAddToPlaylist = (playlistId) => { + if (playlistId === props.id) { + refresh() + } + } + return ( <>