Merge branch 'master' into subsonic-folder

ui/src/artist/ArtistShow.jsx

@@ -50,7 +50,9 @@ const useStyles = makeStyles(
 
 const ArtistDetails = (props) => {
   const record = useRecordContext(props)
-  const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('sm'))
+  const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('sm'), {
+    noSsr: true,
+  })
   const [artistInfo, setArtistInfo] = useState()
 
   const biography = artistInfo?.biography || record.biography

ui/src/artist/MobileArtistDetails.jsx

@@ -83,7 +83,7 @@ const useStyles = makeStyles(
 )
 
 const MobileArtistDetails = ({ artistInfo, biography, record }) => {
-  const img = subsonic.getCoverArtUrl(record)
+  const img = subsonic.getCoverArtUrl(record, 800)
   const [expanded, setExpanded] = useState(false)
   const classes = useStyles({ img, expanded })
   const title = record.name

ui/src/common/SongDatagrid.jsx

@@ -85,7 +85,14 @@ const DiscSubtitleRow = forwardRef(
     const classes = useStyles({ isDesktop })
     const [imageError, setImageError] = useState(false)
     const [isLightboxOpen, setLightboxOpen] = useState(false)
+    const lightboxClosedAt = React.useRef(0)
     const handlePlaySubset = (discNumber) => () => {
+      // Ignore clicks shortly after the lightbox was closed to prevent
+      // mobile touch events from "falling through" the overlay and
+      // triggering playback.
+      if (Date.now() - lightboxClosedAt.current < 400) {
+        return
+      }
       onClick(discNumber)
     }
 
@@ -112,7 +119,10 @@ const DiscSubtitleRow = forwardRef(
       [imageError],
     )
 
-    const handleCloseLightbox = useCallback(() => setLightboxOpen(false), [])
+    const handleCloseLightbox = useCallback(() => {
+      lightboxClosedAt.current = Date.now()
+      setLightboxOpen(false)
+    }, [])
 
     const subtitle = record.discSubtitle
       ? record.discSubtitle