third-party-mirrors/navidrome
1
0
Fork 0
mirror of https://github.com/navidrome/navidrome.git synced 2025-06-16 15:22:25 +03:00
Code Issues Packages Projects Releases Wiki Activity

Show external links on all resolutions but mobile

Browse Source
This commit is contained in:
Deluan 2021-10-21 10:30:53 -04:00
parent 104679ca6e
commit 2a756eab88
2 changed files with 6 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
ui/src/album/AlbumDetails.js
View File

@ -206,6 +206,7 @@ const Details = (props) => {
const AlbumDetails = (props) => { const AlbumDetails = (props) => {
const record = useRecordContext(props) const record = useRecordContext(props)
const isXsmall = useMediaQuery((theme) => theme.breakpoints.down('xs'))
const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('lg')) const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('lg'))
const classes = useStyles() const classes = useStyles()
const [isLightboxOpen, setLightboxOpen] = React.useState(false) const [isLightboxOpen, setLightboxOpen] = React.useState(false)
@ -270,7 +271,7 @@ const AlbumDetails = (props) => {
) : ( ) : (
<Typography component={'p'}>{record.genre}</Typography> <Typography component={'p'}>{record.genre}</Typography>
)} )}
{isDesktop && ( {!isXsmall && (
<Typography component={'div'} className={classes.recordMeta}> <Typography component={'div'} className={classes.recordMeta}>
<AlbumExternalLinks className={classes.externalLinks} /> <AlbumExternalLinks className={classes.externalLinks} />
</Typography> </Typography>

12
ui/src/artist/ArtistExternalLink.js
View File

@ -1,6 +1,6 @@
import React from 'react' import React from 'react'
import { useTranslate } from 'react-admin' import { useTranslate } from 'react-admin'
import { IconButton, Tooltip, Link, useMediaQuery } from '@material-ui/core' import { IconButton, Tooltip, Link } from '@material-ui/core'
import { ImLastfm2 } from 'react-icons/im' import { ImLastfm2 } from 'react-icons/im'
import MusicBrainz from '../icons/MusicBrainz' import MusicBrainz from '../icons/MusicBrainz'
@ -21,8 +21,6 @@ const ArtistExternalLinks = ({ artistInfo, record }) => {
links.push(`https://musicbrainz.org/artist/${artistInfo.musicBrainzId}`) links.push(`https://musicbrainz.org/artist/${artistInfo.musicBrainzId}`)
} }
const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('sm'))
const addLink = (url, title, icon) => { const addLink = (url, title, icon) => {
const translatedTitle = translate(title) const translatedTitle = translate(title)
const link = ( const link = (
@ -38,13 +36,11 @@ const ArtistExternalLinks = ({ artistInfo, record }) => {
linkButtons.push(<span key={`link-${record.id}-${id}`}>{link}</span>) linkButtons.push(<span key={`link-${record.id}-${id}`}>{link}</span>)
} }
isDesktop && addLink(links[0], 'message.openIn.lastfm', <ImLastfm2 />) addLink(links[0], 'message.openIn.lastfm', <ImLastfm2 />)
artistInfo?.musicBrainzId &&
isDesktop &&
artistInfo?.musicBrainzId &&
addLink(links[1], 'message.openIn.musicbrainz', <MusicBrainz />) addLink(links[1], 'message.openIn.musicbrainz', <MusicBrainz />)
return isDesktop && <div>{intersperse(linkButtons, ' ')}</div> return <div>{intersperse(linkButtons, ' ')}</div>
} }
export default ArtistExternalLinks export default ArtistExternalLinks