diff --git a/ui/src/playlist/PlaylistList.js b/ui/src/playlist/PlaylistList.js index 842d9d7c6..e8d315d8b 100644 --- a/ui/src/playlist/PlaylistList.js +++ b/ui/src/playlist/PlaylistList.js @@ -1,15 +1,16 @@ import React from 'react' import { - Datagrid, - TextField, BooleanField, - NumberField, + Datagrid, DateField, - Filter, - SearchInput, EditButton, + Filter, + NumberField, + SearchInput, + TextField, } from 'react-admin' import { DurationField, List } from '../common' +import Writable, { isWritable } from './Writable' const PlaylistFilter = (props) => ( @@ -19,14 +20,17 @@ const PlaylistFilter = (props) => ( const PlaylistList = (props) => ( }> - + isWritable(r.owner)}> - + + + + /> ) diff --git a/ui/src/playlist/PlaylistShow.js b/ui/src/playlist/PlaylistShow.js index d0a574f44..71f33d3d8 100644 --- a/ui/src/playlist/PlaylistShow.js +++ b/ui/src/playlist/PlaylistShow.js @@ -6,6 +6,7 @@ import { Title } from '../common' import PlaylistSongs from './PlaylistSongs' import PlaylistActions from './PlaylistActions' import PlaylistSongBulkActions from './PlaylistSongBulkActions' +import { isReadOnly } from './Writable' const PlaylistShow = (props) => { const viewVersion = useSelector((s) => s.admin.ui && s.admin.ui.viewVersion) @@ -23,6 +24,7 @@ const PlaylistShow = (props) => { } actions={} filter={{ playlist_id: props.id }} diff --git a/ui/src/playlist/PlaylistSongs.js b/ui/src/playlist/PlaylistSongs.js index 2c81a67ae..170aec790 100644 --- a/ui/src/playlist/PlaylistSongs.js +++ b/ui/src/playlist/PlaylistSongs.js @@ -49,7 +49,7 @@ const useStyles = makeStyles( }, noResults: { padding: 20 }, row: { - cursor: 'move', + cursor: (props) => (props.readOnly ? 'arrow' : 'move'), }, }), { name: 'RaList' } @@ -61,6 +61,13 @@ const useStylesListToolbar = makeStyles({ }, }) +const ReorderableList = ({ readOnly, children, ...rest }) => { + if (readOnly) { + return children + } + return {children} +} + const PlaylistSongs = (props) => { const classes = useStyles(props) const classesToolbar = useStylesListToolbar(props) @@ -70,7 +77,7 @@ const PlaylistSongs = (props) => { const dataProvider = useDataProvider() const refresh = useRefresh() const notify = useNotify() - const { bulkActionButtons, expand, className, playlistId } = props + const { bulkActionButtons, expand, className, playlistId, readOnly } = props const { data, ids, version } = controllerProps const anySong = data[ids[0]] @@ -136,7 +143,11 @@ const PlaylistSongs = (props) => { size={'small'} /> ) : ( - + } @@ -158,7 +169,7 @@ const PlaylistSongs = (props) => { showStar={false} /> - + )} diff --git a/ui/src/playlist/Writable.js b/ui/src/playlist/Writable.js new file mode 100644 index 000000000..f0885d7b7 --- /dev/null +++ b/ui/src/playlist/Writable.js @@ -0,0 +1,22 @@ +import { cloneElement } from 'react' + +export const isWritable = (owner) => { + return ( + localStorage.getItem('username') === owner || + localStorage.getItem('role') === 'admin' + ) +} + +export const isReadOnly = (owner) => { + return !isWritable(owner) +} + +const Writable = (props) => { + const { record, children } = props + if (isWritable(record.owner)) { + return cloneElement(children, props) + } + return null +} + +export default Writable