From 781155ff394dbc7eb0a00b094c47e327244a64d2 Mon Sep 17 00:00:00 2001
From: Deluan <deluan@navidrome.org>
Date: Mon, 15 Feb 2021 14:05:27 -0500
Subject: [PATCH] Replace cursor with pointer when hovering over an expandable
 comment.

Fixes https://github.com/navidrome/navidrome/issues/637#issuecomment-778599670
---
 ui/src/album/AlbumDetails.js | 17 +++++++++++------
 1 file changed, 11 insertions(+), 6 deletions(-)

diff --git a/ui/src/album/AlbumDetails.js b/ui/src/album/AlbumDetails.js
index dfcb88925..724383b56 100644
--- a/ui/src/album/AlbumDetails.js
+++ b/ui/src/album/AlbumDetails.js
@@ -9,6 +9,7 @@ import {
   useMediaQuery,
 } from '@material-ui/core'
 import { useTranslate } from 'react-admin'
+import clsx from 'clsx'
 import Lightbox from 'react-image-lightbox'
 import 'react-image-lightbox/style.css'
 import subsonic from '../subsonic'
@@ -74,6 +75,9 @@ const useStyles = makeStyles((theme) => ({
     marginTop: '1em',
     float: 'left',
   },
+  pointerCursor: {
+    cursor: 'pointer',
+  },
 }))
 
 const AlbumComment = ({ record }) => {
@@ -93,18 +97,19 @@ const AlbumComment = ({ record }) => {
     setExpanded(!expanded)
   }, [expanded, setExpanded])
 
+  const numLines = record.comment.split('\n').length
+
   return (
     <Collapse
       collapsedHeight={'1.5em'}
       in={expanded}
       timeout={'auto'}
-      className={classes.commentBlock}
+      className={clsx(
+        classes.commentBlock,
+        numLines > 1 && classes.pointerCursor
+      )}
     >
-      <Typography
-        variant={'body1'}
-        className={classes.commentText}
-        onClick={handleExpandClick}
-      >
+      <Typography variant={'body1'} onClick={handleExpandClick}>
         {formatted}
       </Typography>
     </Collapse>