From 4a054de3d5a59d0a6c039e0efaeb226751819319 Mon Sep 17 00:00:00 2001
From: Deluan <deluan@navidrome.org>
Date: Mon, 16 Jan 2023 15:00:33 -0500
Subject: [PATCH] Hide togglable columns when in Album Grid view mode. Fixes
 #2064

---
 ui/src/album/AlbumListActions.js  | 7 ++++++-
 ui/src/common/ToggleFieldsMenu.js | 4 +++-
 2 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/ui/src/album/AlbumListActions.js b/ui/src/album/AlbumListActions.js
index 801672e4..45825dd5 100644
--- a/ui/src/album/AlbumListActions.js
+++ b/ui/src/album/AlbumListActions.js
@@ -86,6 +86,7 @@ const AlbumListActions = ({
   ...rest
 }) => {
   const isNotSmall = useMediaQuery((theme) => theme.breakpoints.up('sm'))
+  const albumView = useSelector((state) => state.albumView)
   return (
     <TopToolbar className={className} {...sanitizeListRestProps(rest)}>
       {filters &&
@@ -97,7 +98,11 @@ const AlbumListActions = ({
           context: 'button',
         })}
       {isNotSmall ? (
-        <ToggleFieldsMenu resource="album" topbarComponent={AlbumViewToggler} />
+        <ToggleFieldsMenu
+          resource="album"
+          topbarComponent={AlbumViewToggler}
+          hideColumns={albumView.grid}
+        />
       ) : (
         <AlbumViewToggler showTitle={false} />
       )}
diff --git a/ui/src/common/ToggleFieldsMenu.js b/ui/src/common/ToggleFieldsMenu.js
index eb90fdab..f8ee30d0 100644
--- a/ui/src/common/ToggleFieldsMenu.js
+++ b/ui/src/common/ToggleFieldsMenu.js
@@ -30,6 +30,7 @@ const useStyles = makeStyles({
 export const ToggleFieldsMenu = ({
   resource,
   topbarComponent: TopBarComponent,
+  hideColumns,
 }) => {
   const [anchorEl, setAnchorEl] = useState(null)
   const dispatch = useDispatch()
@@ -82,7 +83,7 @@ export const ToggleFieldsMenu = ({
         }}
       >
         {TopBarComponent && <TopBarComponent />}
-        {toggleableColumns ? (
+        {!hideColumns && toggleableColumns ? (
           <div>
             <Typography className={classes.title}>
               {translate('ra.toggleFieldsMenu.columnsToDisplay')}
@@ -107,4 +108,5 @@ export const ToggleFieldsMenu = ({
 ToggleFieldsMenu.propTypes = {
   resource: PropTypes.string.isRequired,
   topbarComponent: PropTypes.elementType,
+  hideColumns: PropTypes.bool,
 }