From 27adb84177c9d0ccc8503142d5629a40cff53705 Mon Sep 17 00:00:00 2001
From: Deluan <deluan@navidrome.org>
Date: Thu, 24 Sep 2020 13:34:17 -0400
Subject: [PATCH] Add "Close" icon to player

---
 ui/src/audioplayer/Player.js | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/ui/src/audioplayer/Player.js b/ui/src/audioplayer/Player.js
index 80ec31de..4c352990 100644
--- a/ui/src/audioplayer/Player.js
+++ b/ui/src/audioplayer/Player.js
@@ -6,7 +6,13 @@ import { useAuthState, useDataProvider, useTranslate } from 'react-admin'
 import ReactJkMusicPlayer from 'react-jinke-music-player'
 import 'react-jinke-music-player/assets/index.css'
 import subsonic from '../subsonic'
-import { scrobble, syncQueue, currentPlaying, setVolume } from './queue'
+import {
+  scrobble,
+  syncQueue,
+  currentPlaying,
+  setVolume,
+  clearQueue,
+} from './queue'
 import themes from '../themes'
 import { makeStyles } from '@material-ui/core/styles'
 import config from '../config'
@@ -46,7 +52,7 @@ const Player = () => {
     autoPlayInitLoadPlayList: true,
     loadAudioErrorPlayNext: false,
     clearPriorAudioLists: false,
-    showDestroy: false,
+    showDestroy: true,
     showDownload: false,
     showReload: false,
     glassBg: false,
@@ -165,6 +171,13 @@ const Player = () => {
     [dispatch, dataProvider]
   )
 
+  const onBeforeDestroy = useCallback(() => {
+    return new Promise((resolve, reject) => {
+      dispatch(clearQueue())
+      reject()
+    })
+  }, [dispatch])
+
   if (authenticated && options.audioLists.length > 0) {
     return (
       <ReactJkMusicPlayer
@@ -176,6 +189,7 @@ const Player = () => {
         onAudioPause={onAudioPause}
         onAudioEnded={onAudioEnded}
         onAudioVolumeChange={onAudioVolumeChange}
+        onBeforeDestroy={onBeforeDestroy}
       />
     )
   }