Add Playlist action

ui/src/playlist/PlaylistActions.js

@@ -0,0 +1,42 @@
+import {
+  Button,
+  sanitizeListRestProps,
+  TopToolbar,
+  useTranslate,
+} from 'react-admin'
+import PlayArrowIcon from '@material-ui/icons/PlayArrow'
+import React from 'react'
+import { useDispatch } from 'react-redux'
+import { playTracks } from '../audioplayer'
+
+const PlaylistActions = ({
+  className,
+  ids,
+  data,
+  exporter,
+  permanentFilter,
+  ...rest
+}) => {
+  const dispatch = useDispatch()
+  const translate = useTranslate()
+
+  return (
+    <TopToolbar className={className} {...sanitizeListRestProps(rest)}>
+      <Button
+        onClick={() => {
+          dispatch(playTracks(data))
+        }}
+        label={translate('resources.album.actions.playAll')}
+      >
+        <PlayArrowIcon />
+      </Button>
+    </TopToolbar>
+  )
+}
+
+PlaylistActions.defaultProps = {
+  selectedIds: [],
+  onUnselectItems: () => null,
+}
+
+export default PlaylistActions

ui/src/playlist/PlaylistShow.js

@@ -3,6 +3,7 @@ import { useGetOne } from 'react-admin'
 import PlaylistDetails from './PlaylistDetails'
 import { Title } from '../common'
 import PlaylistSongs from './PlaylistSongs'
+import PlaylistActions from './PlaylistActions'
 
 const PlaylistShow = (props) => {
   const { data: record, loading, error } = useGetOne('playlist', props.id)
@@ -22,7 +23,7 @@ const PlaylistShow = (props) => {
         {...props}
         playlistId={props.id}
         title={<Title subTitle={record.name} />}
-        // actions={<AlbumActions />}
+        actions={<PlaylistActions />}
         filter={{ playlist_id: props.id }}
         resource={'playlistTrack'}
         exporter={false}