diff --git a/ui/src/album/AlbumContextMenu.js b/ui/src/album/AlbumContextMenu.js index b0a428591..ab71cedb4 100644 --- a/ui/src/album/AlbumContextMenu.js +++ b/ui/src/album/AlbumContextMenu.js @@ -1,27 +1,27 @@ -import React, {useState} from 'react' +import React, { useState } from 'react' import IconButton from '@material-ui/core/IconButton' import Menu from '@material-ui/core/Menu' import MenuItem from '@material-ui/core/MenuItem' import MoreVertIcon from '@material-ui/icons/MoreVert' -import { useDataProvider, useTranslate } from 'react-admin'; +import { useDataProvider, useTranslate } from 'react-admin' import { useDispatch } from 'react-redux' import { playAlbum, shuffleAlbum } from '../audioplayer' const AlbumContextMenu = (props) => { - const dataProvider = useDataProvider(); + const dataProvider = useDataProvider() const dispatch = useDispatch() - const translate = useTranslate() + const translate = useTranslate() const [anchorEl, setAnchorEl] = useState(null) const open = Boolean(anchorEl) const options = { - play: { - label: translate('resources.album.actions.playAll'), - action: (data, id) => (playAlbum(id, data)) - }, - shuffle: { - label: translate('resources.album.actions.shuffle'), - action: (data) => (shuffleAlbum(data)) - }, + play: { + label: translate('resources.album.actions.playAll'), + action: (data, id) => playAlbum(id, data), + }, + shuffle: { + label: translate('resources.album.actions.shuffle'), + action: (data) => shuffleAlbum(data), + }, } const handleClick = (e) => { @@ -37,15 +37,20 @@ const AlbumContextMenu = (props) => { const handleItemClick = (e) => { e.preventDefault() setAnchorEl(null) - const key = e.target.getAttribute('value') - dataProvider.getList('albumSong', { - pagination: { page: 0, perPage: 1000 }, - sort: { field: 'trackNumber', order: 'ASC' }, - filter: { album_id: props.id }, - }).then((response) => { - const adata = (response.data).reduce((acc, cur) => ({ ...acc, [cur.id]: cur }), {}) - dispatch(options[key].action(adata, response.data[0].id)) - }) + const key = e.target.getAttribute('value') + dataProvider + .getList('albumSong', { + pagination: { page: 0, perPage: 1000 }, + sort: { field: 'trackNumber', order: 'ASC' }, + filter: { album_id: props.id }, + }) + .then((response) => { + const adata = response.data.reduce( + (acc, cur) => ({ ...acc, [cur.id]: cur }), + {} + ) + dispatch(options[key].action(adata, response.data[0].id)) + }) } return ( @@ -63,7 +68,7 @@ const AlbumContextMenu = (props) => { anchorEl={anchorEl} keepMounted open={open} - onClose={handleOnClose} + onClose={handleOnClose} > {Object.keys(options).map((key) => ( diff --git a/ui/src/album/AlbumGridView.js b/ui/src/album/AlbumGridView.js index d699dcc33..3761fc923 100644 --- a/ui/src/album/AlbumGridView.js +++ b/ui/src/album/AlbumGridView.js @@ -6,7 +6,7 @@ import { Link } from 'react-router-dom' import { linkToRecord, Loading } from 'react-admin' import subsonic from '../subsonic' import { ArtistLinkField } from './ArtistLinkField' -import GridMenu from './GridMenu.js' +import AlbumContextMenu from './AlbumContextMenu.js' const useStyles = makeStyles((theme) => ({ root: { @@ -81,7 +81,7 @@ const LoadedAlbumGrid = ({ ids, data, basePath, width }) => { } - actionIcon={} + actionIcon={} /> ))}