diff --git a/ui/src/artist/ArtistList.js b/ui/src/artist/ArtistList.js index 1e59bc452..9b5856e0e 100644 --- a/ui/src/artist/ArtistList.js +++ b/ui/src/artist/ArtistList.js @@ -15,8 +15,8 @@ import { ArtistContextMenu, List, QuickFilter, - SimpleList, useGetHandleArtistClick, + ArtistSimpleList, } from '../common' import { makeStyles } from '@material-ui/core/styles' @@ -49,18 +49,21 @@ const ArtistFilter = (props) => ( ) -const ArtistListView = ({ hasShow, hasEdit, hasList, width, ...rest }) => { +const ArtistListView = ({ + hasShow, + hasEdit, + hasList, + width, + syncWithLocation, + ...rest +}) => { const classes = useStyles() const handleArtistLink = useGetHandleArtistClick(width) const history = useHistory() const isXsmall = useMediaQuery((theme) => theme.breakpoints.down('xs')) return isXsmall ? ( - r.name} - linkType={(id) => { - history.push(handleArtistLink(id)) - }} - rightIcon={(r) => } + history.push(handleArtistLink(id))} {...rest} /> ) : ( diff --git a/ui/src/common/ArtistSimpleList.js b/ui/src/common/ArtistSimpleList.js new file mode 100644 index 000000000..e364fff4c --- /dev/null +++ b/ui/src/common/ArtistSimpleList.js @@ -0,0 +1,80 @@ +import React from 'react' +import PropTypes from 'prop-types' +import List from '@material-ui/core/List' +import ListItem from '@material-ui/core/ListItem' +import ListItemIcon from '@material-ui/core/ListItemIcon' +import ListItemSecondaryAction from '@material-ui/core/ListItemSecondaryAction' +import ListItemText from '@material-ui/core/ListItemText' +import { makeStyles } from '@material-ui/core/styles' +import { sanitizeListRestProps } from 'ra-core' +import { ArtistContextMenu } from './index' + +const useStyles = makeStyles( + { + listItem: { + padding: '10px', + }, + title: { + paddingRight: '10px', + width: '80%', + }, + rightIcon: { + top: '26px', + }, + }, + { name: 'RaArtistSimpleList' } +) + +export const ArtistSimpleList = ({ + linkType, + className, + classes: classesOverride, + data, + hasBulkActions, + ids, + loading, + selectedIds, + total, + ...rest +}) => { + const classes = useStyles({ classes: classesOverride }) + return ( + (loading || total > 0) && ( + + {ids.map( + (id) => + data[id] && ( + linkType(id)}> + + {data[id].name} + } + /> + + + + + + + + ) + )} + + ) + ) +} + +ArtistSimpleList.propTypes = { + className: PropTypes.string, + classes: PropTypes.object, + data: PropTypes.object, + hasBulkActions: PropTypes.bool.isRequired, + ids: PropTypes.array, + selectedIds: PropTypes.arrayOf(PropTypes.any).isRequired, +} + +ArtistSimpleList.defaultProps = { + hasBulkActions: false, + selectedIds: [], +} diff --git a/ui/src/common/index.js b/ui/src/common/index.js index 1029f47af..0861f5cf3 100644 --- a/ui/src/common/index.js +++ b/ui/src/common/index.js @@ -27,3 +27,4 @@ export * from './useToggleStar' export * from './useTraceUpdate' export * from './Writable' export * from './SongSimpleList' +export * from './ArtistSimpleList'