fix(queue): batch queue splice invocations when reordering items to avoid currentIndex being dumped down due to clamping

front/src/composables/audio/queue.ts

@@ -92,7 +92,7 @@ const queue = computed<QueueTrack[]>(() => {
 })
 
 // Current Index
-export const currentIndex = useClamp(useStorage('queue:index', 0), 0, () => tracks.value.length - 1)
+export const currentIndex = useClamp(useStorage('queue:index', 0), 0, () => Math.max(0, tracks.value.length - 1))
 export const currentTrack = computed(() => queue.value[currentIndex.value])
 
 // Use Queue
@@ -253,10 +253,14 @@ export const useQueue = createGlobalState(() => {
       ? shuffledIds
       : tracks
 
-    const [id] = list.value.splice(from, 1)
-    list.value.splice(to, 0, id)
-
     const current = currentIndex.value
+
+    // NOTE: We're batching the changes to avoid reactivity issues related to the currentIndex being clamped at list length
+    const listCopy = list.value.slice()
+    const [id] = listCopy.splice(from, 1)
+    listCopy.splice(to, 0, id)
+    list.value = listCopy
+
     if (current === from) {
       currentIndex.value = to
       return
@@ -327,6 +331,8 @@ export const useQueue = createGlobalState(() => {
     const lastTracks = [...tracks.value]
     tracks.value.length = 0
     await delMany(lastTracks)
+
+    currentIndex.value = 0
   }
 
   // Radio queue populating