On each upload, call load from ProcessContext

src/lib/components/forms/DocumentUpload.svelte

@@ -67,7 +67,7 @@ progress through the three-part upload process.
     isWithinSizeLimit,
   } from "$lib/utils/files";
   import { getCsrfToken } from "$lib/utils/api";
-  import { load } from "../processing/ProcessContext.svelte";
+  import { getProcessLoader } from "../processing/ProcessContext.svelte";
 
   export let files: File[] = getFilesToUpload();
   export let projects: Project[] = [];
@@ -85,6 +85,9 @@ progress through the three-part upload process.
   let STATUS: Record<string, UploadStatus> = {};
   let loading = false; // are requests in flight?
 
+  // Get load function from processing context
+  const loadProcessing = getProcessLoader();
+
   // fields
   let access: Access = "private";
   let language: { value: string; label: string } = {
@@ -190,8 +193,6 @@ progress through the three-part upload process.
           form,
         ),
       );
-    // Try to load processing context after all uploads are triggered
-    load();
 
     // errors are handled within each promise, so we can just wait for all to be settled
     await Promise.allSettled(promises);
@@ -284,6 +285,8 @@ progress through the three-part upload process.
     if (error) {
       STATUS[id].error = error;
     }
+    // trigger process load request
+    loadProcessing?.();
   }
 </script>
 

src/lib/components/processing/ProcessContext.svelte

@@ -8,7 +8,7 @@ This makes the state of those processes available via context.
   import type { Run } from "@/addons/types";
   import type { Maybe, Pending } from "@/lib/api/types";
 
-  import { throttle } from "lodash-es";
+  import throttle from "lodash-es/throttle";
   import {
     getContext,
     setContext,
@@ -25,6 +25,7 @@ This makes the state of those processes available via context.
   interface ProcessContext {
     documents: Writable<Pending[]>;
     addons: Writable<Run[]>;
+    load: () => void;
   }
 
   interface Debounced {
@@ -41,6 +42,10 @@ This makes the state of those processes available via context.
     return getContext<ProcessContext>("processing")?.addons;
   }
 
+  export function getProcessLoader(): Maybe<() => void> {
+    return getContext<ProcessContext>("processing")?.load;
+  }
+
   export let addons: Writable<Run[]> = writable([]);
   export let documents: Writable<Pending[]> = writable([]);
 
@@ -65,7 +70,7 @@ This makes the state of those processes available via context.
 
 <script lang="ts">
   // stores we need deeper in the component tree, available via context
-  setContext<ProcessContext>("processing", { addons, documents });
+  setContext<ProcessContext>("processing", { addons, documents, load });
 
   onMount(() => {
     load();