add clear queue button

src/player/Queue.vue

@@ -1,5 +1,13 @@
 <template>
   <div>
+    <div class="d-flex justify-content-between align-items-center mb-2">
+      <h1 class="mb-0">
+        Playing
+      </h1>
+      <b-button variant="secondary" @click="clear()">
+        Clear
+      </b-button>
+    </div>
     <TrackList :tracks="tracks">
       <template #context-menu="{index}">
         <b-dropdown-item-button @click="remove(index)">
@@ -26,6 +34,7 @@
     methods: {
       ...mapMutations('player', {
         remove: 'removeFromQueue',
+        clear: 'clearQueue',
       }),
     }
   })

src/player/store.ts

@@ -101,6 +101,14 @@ export const playerModule: Module<State, any> = {
         state.queueIndex--
       }
     },
+    clearQueue(state) {
+      if (state.queueIndex >= 0) {
+        state.queue = [state.queue[state.queueIndex]]
+        state.queueIndex = 0
+        localStorage.setItem('queue', JSON.stringify(state.queue))
+        localStorage.setItem('queueIndex', '0')
+      }
+    },
     setNextInQueue(state, tracks) {
       state.queue.splice(state.queueIndex + 1, 0, ...tracks)
     },