diff --git a/ui/src/album/AlbumListView.js b/ui/src/album/AlbumListView.js index 4df476ce6..40a7ff396 100644 --- a/ui/src/album/AlbumListView.js +++ b/ui/src/album/AlbumListView.js @@ -3,13 +3,13 @@ import { BooleanField, Datagrid, DateField, - NumberField, FunctionField, + NumberField, Show, SimpleShowLayout, TextField, } from 'react-admin' -import { DurationField, RangeField } from '../common' +import { DurationField, RangeField, SimpleList } from '../common' import { useMediaQuery } from '@material-ui/core' import AlbumContextMenu from './AlbumContextMenu' @@ -28,19 +28,32 @@ const AlbumDetails = (props) => { const AlbumListView = ({ hasShow, hasEdit, hasList, ...rest }) => { const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('md')) - return ( + const isXsmall = useMediaQuery((theme) => theme.breakpoints.down('xs')) + return isXsmall ? ( + r.name} + secondaryText={(r) => r.albumArtist} + tertiaryText={(r) => ( + <> + +     + + )} + linkType={'show'} + rightIcon={(r) => } + {...rest} + /> + ) : ( } rowClick={'show'} {...rest}> - (r.albumArtist ? r.albumArtist : r.artist)} - /> + r.albumArtist} /> {isDesktop && } {isDesktop && } - {isDesktop && } + {isDesktop && } ) } + export default AlbumListView