From 69afb6995947c349373c1d84063d0ecc42ce0baf Mon Sep 17 00:00:00 2001
From: Deluan <deluan@navidrome.org>
Date: Sun, 4 Jul 2021 11:44:41 -0400
Subject: [PATCH] Fix Disc context menu not visible in mobile

---
 ui/src/common/SongDatagrid.js | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/ui/src/common/SongDatagrid.js b/ui/src/common/SongDatagrid.js
index fcc21b96e..62cd5367b 100644
--- a/ui/src/common/SongDatagrid.js
+++ b/ui/src/common/SongDatagrid.js
@@ -1,7 +1,12 @@
 import React, { isValidElement, useMemo, useCallback } from 'react'
 import { useDispatch } from 'react-redux'
 import { Datagrid, PureDatagridBody, PureDatagridRow } from 'react-admin'
-import { TableCell, TableRow, Typography } from '@material-ui/core'
+import {
+  TableCell,
+  TableRow,
+  Typography,
+  useMediaQuery,
+} from '@material-ui/core'
 import PropTypes from 'prop-types'
 import { makeStyles } from '@material-ui/core/styles'
 import AlbumIcon from '@material-ui/icons/Album'
@@ -38,7 +43,7 @@ const useStyles = makeStyles({
     },
   },
   contextMenu: {
-    visibility: 'hidden',
+    visibility: (props) => (props.isDesktop ? 'hidden' : 'visible'),
   },
 })
 
@@ -48,7 +53,8 @@ const DiscSubtitleRow = ({
   colSpan,
   contextAlwaysVisible,
 }) => {
-  const classes = useStyles()
+  const isDesktop = useMediaQuery((theme) => theme.breakpoints.up('md'))
+  const classes = useStyles({ isDesktop })
   const handlePlayDisc = (discNumber) => () => {
     onClick(discNumber)
   }