Better behaviour of Prev/Next buttons when share has only one song:

- Allow Prev to restart the song
- Disable Next

ui/src/SharePlayer.js

@@ -2,7 +2,20 @@ import ReactJkMusicPlayer from 'navidrome-music-player'
 import { shareInfo } from './config'
 import { shareCoverUrl, shareStreamUrl } from './utils'
 
+import { makeStyles } from '@material-ui/core/styles'
+
+const useStyle = makeStyles({
+  player: {
+    '& .group .next-audio': {
+      pointerEvents: (props) => props.single && 'none',
+      opacity: (props) => props.single && 0.65,
+    },
+  },
+})
+
 const SharePlayer = () => {
+  const classes = useStyle({ single: shareInfo?.tracks.length === 1 })
+
   const list = shareInfo?.tracks.map((s) => {
     return {
       name: s.title,
@@ -22,11 +35,12 @@ const SharePlayer = () => {
     showMediaSession: true,
     theme: 'auto',
     showThemeSwitch: false,
+    restartCurrentOnPrev: true,
     remove: false,
     spaceBar: true,
     volumeFade: { fadeIn: 200, fadeOut: 200 },
   }
-  return <ReactJkMusicPlayer {...options} />
+  return <ReactJkMusicPlayer {...options} className={classes.player} />
 }
 
 export default SharePlayer

ui/src/audioplayer/styles.js

@@ -80,14 +80,10 @@ const useStyle = makeStyles(
         },
       '& .music-player-panel .panel-content .progress-bar-content section.audio-main':
         {
-          display: (props) => {
+          display: (props) => (props.isRadio ? 'none' : 'inline-flex'),
-            return props.isRadio ? 'none' : 'inline-flex'
-          },
         },
       '& .react-jinke-music-player-mobile-progress': {
-        display: (props) => {
+        display: (props) => (props.isRadio ? 'none' : 'flex'),
-          return props.isRadio ? 'none' : 'flex'
-        },
       },
     },
   }),