From ca5da5b0ea15fbfcc076a51b9a6c43a85a401b96 Mon Sep 17 00:00:00 2001 From: Deluan Date: Fri, 14 Aug 2020 14:10:39 -0400 Subject: [PATCH] Use active filters when shuffling songs --- ui/src/common/ShuffleAllButton.js | 50 +++++++++++++++++++++++++++++++ ui/src/common/index.js | 2 ++ ui/src/song/SongListActions.js | 50 ++----------------------------- 3 files changed, 55 insertions(+), 47 deletions(-) create mode 100644 ui/src/common/ShuffleAllButton.js diff --git a/ui/src/common/ShuffleAllButton.js b/ui/src/common/ShuffleAllButton.js new file mode 100644 index 000000000..114c0ab88 --- /dev/null +++ b/ui/src/common/ShuffleAllButton.js @@ -0,0 +1,50 @@ +import React from 'react' +import { Button, useDataProvider, useNotify, useTranslate } from 'react-admin' +import { useDispatch } from 'react-redux' +import ShuffleIcon from '@material-ui/icons/Shuffle' +import { playTracks } from '../audioplayer' +import PropTypes from 'prop-types' + +const ShuffleAllButton = ({ filters }) => { + const translate = useTranslate() + const dataProvider = useDataProvider() + const dispatch = useDispatch() + const notify = useNotify() + + const handleOnClick = () => { + dataProvider + .getList('song', { + pagination: { page: 1, perPage: 200 }, + sort: { field: 'random', order: 'ASC' }, + filter: filters, + }) + .then((res) => { + const data = {} + res.data.forEach((song) => { + data[song.id] = song + }) + dispatch(playTracks(data)) + }) + .catch(() => { + notify('ra.page.error', 'warning') + }) + } + + return ( + + ) +} + +ShuffleAllButton.propTypes = { + filters: PropTypes.object, +} +ShuffleAllButton.defaultProps = { + filters: {}, +} + +export default ShuffleAllButton diff --git a/ui/src/common/index.js b/ui/src/common/index.js index 44dddb039..cc64690dc 100644 --- a/ui/src/common/index.js +++ b/ui/src/common/index.js @@ -15,6 +15,7 @@ import SongContextMenu from './SongContextMenu' import SongTitleField from './SongTitleField' import QuickFilter from './QuickFilter' import useAlbumsPerPage from './useAlbumsPerPage' +import ShuffleAllButton from './ShuffleAllButton' import { AlbumContextMenu, ArtistContextMenu } from './ContextMenus' export { @@ -40,4 +41,5 @@ export { SongContextMenu, QuickFilter, useAlbumsPerPage, + ShuffleAllButton, } diff --git a/ui/src/song/SongListActions.js b/ui/src/song/SongListActions.js index 4a25ed2d8..9352dcc4d 100644 --- a/ui/src/song/SongListActions.js +++ b/ui/src/song/SongListActions.js @@ -1,50 +1,6 @@ import React, { cloneElement } from 'react' -import { useDispatch } from 'react-redux' -import { - Button, - sanitizeListRestProps, - TopToolbar, - useDataProvider, - useTranslate, - useNotify, -} from 'react-admin' -import ShuffleIcon from '@material-ui/icons/Shuffle' -import { playTracks } from '../audioplayer' - -const ShuffleAllButton = () => { - const translate = useTranslate() - const dataProvider = useDataProvider() - const dispatch = useDispatch() - const notify = useNotify() - - const handleOnClick = () => { - dataProvider - .getList('song', { - pagination: { page: 1, perPage: 200 }, - sort: { field: 'random', order: 'ASC' }, - filter: {}, - }) - .then((res) => { - const data = {} - res.data.forEach((song) => { - data[song.id] = song - }) - dispatch(playTracks(data)) - }) - .catch(() => { - notify('ra.page.error', 'warning') - }) - } - - return ( - - ) -} +import { sanitizeListRestProps, TopToolbar } from 'react-admin' +import { ShuffleAllButton } from '../common' export const SongListActions = ({ currentSort, @@ -74,7 +30,7 @@ export const SongListActions = ({ filterValues, context: 'button', })} - + ) }