From b6693cd4b2bc1edfe1b801beea56d16b68d47bdf Mon Sep 17 00:00:00 2001
From: wukko <me@wukko.me>
Date: Mon, 19 May 2025 16:32:48 +0600
Subject: [PATCH] web/queue: fix total progress

the issue was caused by currentTasks state dependence in ProcessingQueue, now it's properly updated just like before :3
---
 web/src/components/queue/ProcessingQueue.svelte     | 7 ++++---
 web/src/components/queue/ProcessingQueueItem.svelte | 2 +-
 web/src/lib/task-manager/queue.ts                   | 9 ++++-----
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/web/src/components/queue/ProcessingQueue.svelte b/web/src/components/queue/ProcessingQueue.svelte
index a38b9bb2..9bde6094 100644
--- a/web/src/components/queue/ProcessingQueue.svelte
+++ b/web/src/components/queue/ProcessingQueue.svelte
@@ -5,9 +5,10 @@
 
     import { clearFileStorage } from "$lib/storage/opfs";
 
-    import { queueVisible } from "$lib/state/queue-visibility";
-    import { clearQueue, queue as readableQueue } from "$lib/state/task-manager/queue";
     import { getProgress } from "$lib/task-manager/queue";
+    import { queueVisible } from "$lib/state/queue-visibility";
+    import { currentTasks } from "$lib/state/task-manager/current-tasks";
+    import { clearQueue, queue as readableQueue } from "$lib/state/task-manager/queue";
 
     import SectionHeading from "$components/misc/SectionHeading.svelte";
     import PopoverContainer from "$components/misc/PopoverContainer.svelte";
@@ -24,7 +25,7 @@
     let queue = $derived(Object.entries($readableQueue));
 
     let totalProgress = $derived(queue.length ? queue.map(
-        ([, item]) => getProgress(item) * 100
+        ([, item]) => getProgress(item, $currentTasks) * 100
     ).reduce((a, b) => a + b) / (100 * queue.length) : 0);
 
     let indeterminate = $derived(queue.length > 0 && totalProgress === 0);
diff --git a/web/src/components/queue/ProcessingQueueItem.svelte b/web/src/components/queue/ProcessingQueueItem.svelte
index af781bde..b5f14245 100644
--- a/web/src/components/queue/ProcessingQueueItem.svelte
+++ b/web/src/components/queue/ProcessingQueueItem.svelte
@@ -64,7 +64,7 @@
     const generateStatusText = ({ info, retrying, currentTasks }: StatusText) => {
         switch (info.state) {
         case "running":
-            const progress = getProgress(info);
+            const progress = getProgress(info, currentTasks);
 
             const runningWorkers = info.pipeline.filter(w => w.workerId in currentTasks);
             const running = [...new Set(runningWorkers.map(task => $t(`queue.state.running.${task.worker}`)))].join(', ');
diff --git a/web/src/lib/task-manager/queue.ts b/web/src/lib/task-manager/queue.ts
index a1b93df2..c75ff477 100644
--- a/web/src/lib/task-manager/queue.ts
+++ b/web/src/lib/task-manager/queue.ts
@@ -4,11 +4,11 @@ import { ffmpegMetadataArgs } from "$lib/util";
 import { createDialog } from "$lib/state/dialogs";
 import { addItem } from "$lib/state/task-manager/queue";
 import { openQueuePopover } from "$lib/state/queue-visibility";
-import { currentTasks } from "$lib/state/task-manager/current-tasks";
 
+import type { CobaltQueueItem } from "$lib/types/queue";
+import type { CobaltCurrentTasks } from "$lib/types/task-manager";
 import type { CobaltPipelineItem, CobaltPipelineResultFileType } from "$lib/types/workers";
 import type { CobaltLocalProcessingResponse, CobaltSaveRequestBody } from "$lib/types/api";
-import type { CobaltQueueItem } from "$lib/types/queue";
 
 export const getMediaType = (type: string) => {
     const kind = type.split('/')[0];
@@ -204,20 +204,19 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse, request:
     openQueuePopover();
 }
 
-export const getProgress = (item: CobaltQueueItem): number => {
+export const getProgress = (item: CobaltQueueItem, currentTasks: CobaltCurrentTasks): number => {
     if (item.state === 'done' || item.state === 'error') {
         return 1;
     } else if (item.state === 'waiting') {
         return 0;
     }
 
-    const runningTasks = get(currentTasks);
     let sum = 0;
     for (const worker of item.pipeline) {
         if (item.completedWorkers.has(worker.workerId)) {
             sum += 1;
         } else {
-            const task = runningTasks[worker.workerId];
+            const task = currentTasks[worker.workerId];
             sum += (task?.progress?.percentage || 0) / 100;
         }
     }