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

This commit is contained in:
Kasper Seweryn 2023-05-06 14:33:47 +02:00 committed by jo
parent 1f44cb8e6f
commit a8b7e07a86
No known key found for this signature in database
GPG Key ID: B2FEC9B22722B984
1 changed files with 18 additions and 12 deletions

View File

@ -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