Store workflow ID and title in prompt extra data

src/lib/api.ts

@@ -5,6 +5,7 @@ import type { ComfyImageLocation } from "$lib/utils";
 import type { SerializedLGraph, UUID } from "@litegraph-ts/core";
 import type { SerializedLayoutState } from "./stores/layoutStates";
 import type { ComfyNodeDef } from "./ComfyNodeDef";
+import type { WorkflowInstID } from "./stores/workflowState";
 
 export type ComfyPromptRequest = {
     client_id?: string,
@@ -68,6 +69,12 @@ export type ComfyPromptPNGInfo = {
 }
 
 export type ComfyBoxPromptExtraData = ComfyUIPromptExtraData & {
+    /* Workflow tab that sent the prompt.  */
+    workflowID?: WorkflowInstID,
+
+    workflowTitle?: string,
+
+    /* Thumbnails to show in the queue */
     thumbnails?: ComfyImageLocation[],
 }
 

src/lib/components/ComfyApp.ts

@@ -456,8 +456,8 @@ export default class ComfyApp {
 
         this.api.addEventListener("executing", (promptID: PromptID | null, nodeID: ComfyNodeID | null) => {
             const queueEntry = queueState.executingUpdated(promptID, nodeID);
-            if (queueEntry != null) {
-                const workflow = workflowState.getWorkflow(queueEntry.workflowID);
+            if (queueEntry != null && queueEntry.extraData?.workflowID != null) {
+                const workflow = workflowState.getWorkflow(queueEntry.extraData.workflowID);
                 workflow?.graph?.setDirtyCanvas(true, false);
             }
         });
@@ -465,7 +465,7 @@ export default class ComfyApp {
         this.api.addEventListener("executed", (promptID: PromptID, nodeID: ComfyNodeID, output: SerializedPromptOutput) => {
             const queueEntry = queueState.onExecuted(promptID, nodeID, output)
             if (queueEntry != null) {
-                const workflow = workflowState.getWorkflow(queueEntry.workflowID);
+                const workflow = workflowState.getWorkflow(queueEntry.extraData.workflowID);
                 if (workflow != null) {
                     workflow.graph.setDirtyCanvas(true, false);
                     const node = workflow.graph.getNodeByIdRecursive(nodeID) as ComfyGraphNode;
@@ -808,7 +808,7 @@ export default class ComfyApp {
             tag = null;
 
         this.processingQueue = true;
-        let workflow;
+        let workflow: ComfyWorkflow;
 
         try {
             while (this.queueItems.length) {
@@ -855,6 +855,8 @@ export default class ComfyApp {
                                 subgraphs: [tag]
                             }
                         },
+                        workflowID: workflow.id,
+                        workflowTitle: workflow.attrs.title,
                         thumbnails
                     }
 

src/lib/components/ComfyQueue.svelte

@@ -141,14 +141,11 @@
      const subgraphs: string[] | null = entry.extraData?.extra_pnginfo?.comfyBoxPrompt?.subgraphs;
 
      let message = "Prompt";
-     if (entry.workflowID != null) {
-         const workflow = workflowState.getWorkflow(entry.workflowID);
-         if (workflow != null && workflow.attrs.title) {
-             message = `${workflow.attrs.title}`
-         }
-         if (subgraphs?.length > 0)
-             message += ` (${subgraphs.join(', ')})`
+     if (entry.extraData?.workflowTitle != null) {
+         message = `${entry.extraData.workflowTitle}`
      }
+     if (subgraphs?.length > 0)
+         message += ` (${subgraphs.join(', ')})`
 
      let submessage = `Nodes: ${Object.keys(entry.prompt).length}`
 

src/lib/stores/queueState.ts

@@ -39,8 +39,6 @@ export type QueueEntry = {
 
     /*** Data not sent by ComfyUI's API, lost on page refresh ***/
 
-    /* Workflow tab that sent the prompt.  */
-    workflowID?: WorkflowInstID,
     /* Prompt outputs, collected while the prompt is still executing */
     outputs: SerializedPromptOutputs,
     /* Nodes of the workflow that have finished running so far. */
@@ -363,12 +361,10 @@ function afterQueued(workflowID: WorkflowInstID, promptID: PromptID, number: num
         const [index, entry, queue] = findEntryInPending(promptID);
         if (entry == null) {
             const entry = createNewQueueEntry(promptID, number, prompt, extraData);
-            entry.workflowID = workflowID;
             s.queuePending.update(qp => { qp.push(entry); return qp })
             console.debug("[queueState] ADD PROMPT", promptID)
         }
         else {
-            entry.workflowID = workflowID;
             entry.number = number;
             entry.prompt = prompt
             entry.extraData = extraData