web/ProcessingQueue: open the queue popover when new item is added

web/src/lib/queen-bee/queue.ts

@@ -1,6 +1,8 @@
 import mime from "mime";
 
 import { addItem } from "$lib/state/queen-bee/queue";
+import { showQueuePopover } from "$lib/state/queue-visibility";
+
 import type { CobaltPipelineItem } from "$lib/types/workers";
 import type { CobaltLocalProcessingResponse, CobaltSaveRequestBody } from "$lib/types/api";
 
@@ -46,7 +48,9 @@ export const createRemuxPipeline = (file: File) => {
             filename: file.name,
             mimeType: file.type,
             mediaType,
-        })
+        });
+
+        showQueuePopover();
     }
 }
 
@@ -65,7 +69,7 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse, request:
             workerArgs: {
                 url: tunnel,
             },
-        })
+        });
     }
 
     pipeline.push({
@@ -83,7 +87,7 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse, request:
                 format: info.filename.split(".").pop(),
             },
         },
-    })
+    });
 
     addItem({
         id: parentId,
@@ -94,5 +98,7 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse, request:
         filename: info.filename,
         mimeType: mime.getType(info.filename) || undefined,
         mediaType: "video",
-    })
+    });
+
+    showQueuePopover();
 }

web/src/lib/state/queue-visibility.ts

@@ -0,0 +1,10 @@
+import { get, writable } from "svelte/store";
+
+export const queueVisible = writable(false);
+
+export const showQueuePopover = () => {
+    const visible = get(queueVisible);
+    if (!visible) {
+        return queueVisible.update(v => !v);
+    }
+}