web/queue: fix filename on downloads, add mimetype, remove duplicates

filename is no longer passed to workers for no reason

web/src/components/queue/ProcessingQueueItem.svelte

@@ -34,13 +34,14 @@
 
     const download = (file: File) =>
         downloadFile({
-            file,
+            file: new File([file], info.filename, {
+                type: info.mimeType,
+            }),
         });
 </script>
 
 <div class="processing-item">
     <div class="processing-info">
-
         <div class="file-title">
             <div class="processing-type">
                 <svelte:component this={itemIcons[info.mediaType]} />
@@ -56,7 +57,7 @@
                     <ProgressBar
                         percentage={progress?.percentage}
                         workerId={pipeline.workerId}
-                        runningWorkerId={runningWorkerId}
+                        {runningWorkerId}
                         completedWorkers={info.completedWorkers}
                     />
                 {/each}
@@ -69,7 +70,9 @@
             {/if}
 
             {#if info.state === "running"}
-                {(info.completedWorkers?.length || 0) + 1}/{info.pipeline.length}
+                {#if info.pipeline.length > 1}
+                    {(info.completedWorkers?.length || 0) + 1}/{info.pipeline.length}
+                {/if}
                 {#if runningWorker && progress && progress.percentage}
                     {$t(`queue.state.running.${runningWorker.type}`)}: {Math.ceil(
                         progress.percentage
@@ -210,7 +213,7 @@
         }
     }
 
-    @media(hover: none) {
+    @media (hover: none) {
         .processing-info {
             overflow: hidden;
             flex: 1;

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

@@ -35,7 +35,6 @@ export const createRemuxPipeline = (file: File) => {
                 type: file.type,
                 extension: file.name.split(".").pop(),
             },
-            filename: file.name,
         },
     }];
 
@@ -45,6 +44,7 @@ export const createRemuxPipeline = (file: File) => {
             state: "waiting",
             pipeline,
             filename: file.name,
+            mimeType: file.type,
             mediaType,
         })
     }
@@ -82,7 +82,6 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse) => {
                 type: mime.getType(info.filename) || undefined,
                 extension: info.filename.split(".").pop(),
             },
-            filename: info.filename,
         },
     })
 
@@ -91,6 +90,7 @@ export const createSavePipeline = (info: CobaltLocalProcessingResponse) => {
         state: "waiting",
         pipeline,
         filename: info.filename,
+        mimeType: mime.getType(info.filename) || undefined,
         mediaType: "video",
     })
 }

web/src/lib/queen-bee/run-worker.ts

@@ -21,8 +21,7 @@ export const runRemuxWorker = async (
     parentId: string,
     files: CobaltFileReference[],
     args: string[],
-    output: FileInfo,
-    filename: string
+    output: FileInfo
 ) => {
     const worker = new RemuxWorker();
 
@@ -55,7 +54,6 @@ export const runRemuxWorker = async (
             files,
             args,
             output,
-            filename,
         }
     });
 
@@ -165,14 +163,13 @@ export const startWorker = async ({ worker, workerId, parentId, workerArgs }: Co
                 }
             }
 
-            if (files.length > 0 && workerArgs.ffargs && workerArgs.output && workerArgs.filename) {
+            if (files.length > 0 && workerArgs.ffargs && workerArgs.output) {
                 await runRemuxWorker(
                     workerId,
                     parentId,
                     files,
                     workerArgs.ffargs,
                     workerArgs.output,
-                    workerArgs.filename
                 );
             }
             break;

web/src/lib/types/queue.ts

@@ -9,6 +9,7 @@ export type CobaltQueueBaseItem = {
     pipeline: CobaltPipelineItem[],
     // TODO: metadata
     filename: string,
+    mimeType?: string,
     mediaType: CobaltPipelineResultFileType,
 };
 

web/src/lib/types/workers.ts

@@ -17,7 +17,6 @@ export type CobaltWorkerArgs = {
     url?: string,
     ffargs?: string[],
     output?: FileInfo,
-    filename?: string,
 }
 
 export type CobaltPipelineItem = {

web/src/lib/workers/remux.ts

@@ -27,7 +27,7 @@ const ff = new LibAVWrapper((progress) => {
 
 ff.init();
 
-const remux = async (files: CobaltFileReference[], args: string[], output: FileInfo, filename: string) => {
+const remux = async (files: CobaltFileReference[], args: string[], output: FileInfo) => {
     if (!(files && output && args)) return;
 
     await ff.init();
@@ -86,8 +86,7 @@ const remux = async (files: CobaltFileReference[], args: string[], output: FileI
 
         self.postMessage({
             cobaltRemuxWorker: {
-                render,
-                filename
+                render
             }
         });
     } catch (e) {
@@ -99,8 +98,8 @@ const remux = async (files: CobaltFileReference[], args: string[], output: FileI
 self.onmessage = async (event: MessageEvent) => {
     const ed = event.data.cobaltRemuxWorker;
     if (ed) {
-        if (ed.files && ed.args && ed.output && ed.filename) {
-            await remux(ed.files, ed.args, ed.output, ed.filename);
+        if (ed.files && ed.args && ed.output) {
+            await remux(ed.files, ed.args, ed.output);
         }
     }
 }