fix(useGetParticipants): better handle canceling requests

Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>

src/composables/useGetParticipants.js

@@ -120,36 +120,26 @@ export function useGetParticipants(isActive = ref(true), isTopBar = true) {
 		}
 
 		fetchingParticipants = true
-
-		// Cancel the parallel request queue to not fetch twice
-		clearTimeout(throttleFastUpdateTimeout)
-		throttleFastUpdateTimeout = null
-		clearTimeout(throttleSlowUpdateTimeout)
-		throttleSlowUpdateTimeout = null
-		clearTimeout(throttleLongUpdateTimeout)
-		throttleLongUpdateTimeout = null
+		cancelPendingUpdates()
 
 		await store.dispatch('fetchParticipants', { token: token.value })
 		fetchingParticipants = false
 	}
 
 	const throttleFastUpdate = () => {
-		if (throttleFastUpdateTimeout) {
-			return
+		if (!fetchingParticipants && !throttleFastUpdateTimeout) {
+			throttleFastUpdateTimeout = setTimeout(cancelableGetParticipants, 3_000)
 		}
-		throttleFastUpdateTimeout = setTimeout(cancelableGetParticipants, 3_000)
 	}
 	const throttleSlowUpdate = () => {
-		if (throttleSlowUpdateTimeout) {
-			return
+		if (!fetchingParticipants && !throttleSlowUpdateTimeout) {
+			throttleSlowUpdateTimeout = setTimeout(cancelableGetParticipants, 15_000)
 		}
-		throttleSlowUpdateTimeout = setTimeout(cancelableGetParticipants, 15_000)
 	}
 	const throttleLongUpdate = () => {
-		if (throttleLongUpdateTimeout) {
-			return
+		if (!fetchingParticipants && !throttleLongUpdateTimeout) {
+			throttleLongUpdateTimeout = setTimeout(cancelableGetParticipants, 60_000)
 		}
-		throttleLongUpdateTimeout = setTimeout(cancelableGetParticipants, 60_000)
 	}
 
 	onMounted(() => {
@@ -158,6 +148,10 @@ export function useGetParticipants(isActive = ref(true), isTopBar = true) {
 		}
 	})
 
+	watch(token, () => {
+		cancelPendingUpdates()
+	})
+
 	watch(isActive, (newValue) => {
 		if (newValue && pendingChanges) {
 			throttleUpdateParticipants()
@@ -165,11 +159,25 @@ export function useGetParticipants(isActive = ref(true), isTopBar = true) {
 	})
 
 	onBeforeUnmount(() => {
+		cancelPendingUpdates()
 		if (isTopBar) {
 			stopGetParticipants()
 		}
 	})
 
+	/**
+	 * Cancel scheduled participant list updates
+	 * Applies to all parallel queues to not fetch twice
+	 */
+	function cancelPendingUpdates() {
+		clearTimeout(throttleFastUpdateTimeout)
+		throttleFastUpdateTimeout = null
+		clearTimeout(throttleSlowUpdateTimeout)
+		throttleSlowUpdateTimeout = null
+		clearTimeout(throttleLongUpdateTimeout)
+		throttleLongUpdateTimeout = null
+	}
+
 	return {
 		cancelableGetParticipants,
 	}