Merge branch 'main' into feat/vue-nodes-onboarding-toast

Author: simula-r

src/components/sidebar/tabs/QueueSidebarTab.vue

@@ -104,6 +104,7 @@ import { useI18n } from 'vue-i18n'
 
 import NoResultsPlaceholder from '@/components/common/NoResultsPlaceholder.vue'
 import VirtualGrid from '@/components/common/VirtualGrid.vue'
+import { isCloud } from '@/platform/distribution/types'
 import { useSettingStore } from '@/platform/settings/settingStore'
 import type { ComfyNode } from '@/platform/workflow/validation/schemas/workflowSchema'
 import { api } from '@/scripts/api'
@@ -206,7 +207,9 @@ const menuItems = computed<MenuItem[]>(() => {
       label: t('g.loadWorkflow'),
       icon: 'pi pi-file-export',
       command: () => menuTargetTask.value?.loadWorkflow(app),
-      disabled: !menuTargetTask.value?.workflow
+      disabled: isCloud
+        ? !menuTargetTask.value?.isHistory
+        : !menuTargetTask.value?.workflow
     },
     {
       label: t('g.goToNode'),

src/platform/remote/comfyui/history/reconciliation.ts

@@ -13,25 +13,22 @@
 import { isCloud } from '@/platform/distribution/types'
 import type { TaskItem } from '@/schemas/apiSchema'
 
-interface ReconciliationResult {
-  /** All items to display, sorted by queueIndex descending (newest first) */
-  items: TaskItem[]
-}
-
 /**
  * V1 reconciliation: QueueIndex-based filtering works because V1 has stable,
  * monotonically increasing queue indices.
  *
  * Sort order: Sorts serverHistory by queueIndex descending (newest first) to ensure
  * consistent ordering. JavaScript .filter() maintains iteration order, so filtered
  * results remain sorted. clientHistory is assumed already sorted from previous update.
+ *
+ * @returns All items to display, sorted by queueIndex descending (newest first)
  */
 function reconcileHistoryV1(
   serverHistory: TaskItem[],
   clientHistory: TaskItem[],
   maxItems: number,
   lastKnownQueueIndex: number | undefined
-): ReconciliationResult {
+): TaskItem[] {
   const sortedServerHistory = serverHistory.sort(
     (a, b) => b.prompt[0] - a.prompt[0]
   )
@@ -53,13 +50,9 @@ function reconcileHistoryV1(
   )
 
   // Merge new and reused items, sort by queueIndex descending, limit to maxItems
-  const allItems = [...itemsAddedSinceLastSync, ...clientItemsStillOnServer]
+  return [...itemsAddedSinceLastSync, ...clientItemsStillOnServer]
     .sort((a, b) => b.prompt[0] - a.prompt[0])
     .slice(0, maxItems)
-
-  return {
-    items: allItems
-  }
 }
 
 /**
@@ -69,12 +62,14 @@ function reconcileHistoryV1(
  * Sort order: Sorts serverHistory by queueIndex descending (newest first) to ensure
  * consistent ordering. JavaScript .filter() maintains iteration order, so filtered
  * results remain sorted. clientHistory is assumed already sorted from previous update.
+ *
+ * @returns All items to display, sorted by queueIndex descending (newest first)
  */
 function reconcileHistoryV2(
   serverHistory: TaskItem[],
   clientHistory: TaskItem[],
   maxItems: number
-): ReconciliationResult {
+): TaskItem[] {
   const sortedServerHistory = serverHistory.sort(
     (a, b) => b.prompt[0] - a.prompt[0]
   )
@@ -84,29 +79,18 @@ function reconcileHistoryV2(
   )
   const clientPromptIds = new Set(clientHistory.map((item) => item.prompt[1]))
 
-  const newPromptIds = new Set(
-    [...serverPromptIds].filter((id) => !clientPromptIds.has(id))
+  const newItems = sortedServerHistory.filter(
+    (item) => !clientPromptIds.has(item.prompt[1])
   )
 
-  const newItems = sortedServerHistory.filter((item) =>
-    newPromptIds.has(item.prompt[1])
-  )
-
-  const retainedPromptIds = new Set(
-    [...serverPromptIds].filter((id) => clientPromptIds.has(id))
-  )
   const clientItemsStillOnServer = clientHistory.filter((item) =>
-    retainedPromptIds.has(item.prompt[1])
+    serverPromptIds.has(item.prompt[1])
   )
 
   // Merge new and reused items, sort by queueIndex descending, limit to maxItems
-  const allItems = [...newItems, ...clientItemsStillOnServer]
+  return [...newItems, ...clientItemsStillOnServer]
     .sort((a, b) => b.prompt[0] - a.prompt[0])
     .slice(0, maxItems)
-
-  return {
-    items: allItems
-  }
 }
 
 /**
@@ -125,7 +109,7 @@ export function reconcileHistory(
   clientHistory: TaskItem[],
   maxItems: number,
   lastKnownQueueIndex?: number
-): ReconciliationResult {
+): TaskItem[] {
   if (isCloud) {
     return reconcileHistoryV2(serverHistory, clientHistory, maxItems)
   }

src/platform/workflow/cloud/getWorkflowFromHistory.ts

@@ -0,0 +1,21 @@
+import type { ComfyWorkflowJSON } from '@/platform/workflow/validation/schemas/workflowSchema'
+import type { PromptId } from '@/schemas/apiSchema'
+
+export async function getWorkflowFromHistory(
+  fetchApi: (url: string) => Promise<Response>,
+  promptId: PromptId
+): Promise<ComfyWorkflowJSON | undefined> {
+  try {
+    const res = await fetchApi(`/history_v2/${promptId}`)
+    const json = await res.json()
+
+    const historyItem = json[promptId]
+    if (!historyItem) return undefined
+
+    const workflow = historyItem.prompt?.extra_data?.extra_pnginfo?.workflow
+    return workflow ?? undefined
+  } catch (error) {
+    console.error(`Failed to fetch workflow for prompt ${promptId}:`, error)
+    return undefined
+  }
+}

src/platform/workflow/cloud/index.ts

@@ -0,0 +1,10 @@
+/**
+ * Cloud: Fetches workflow by prompt_id. Desktop: Returns undefined (workflows already in history).
+ */
+import { isCloud } from '@/platform/distribution/types'
+
+import { getWorkflowFromHistory as cloudImpl } from './getWorkflowFromHistory'
+
+export const getWorkflowFromHistory = isCloud
+  ? cloudImpl
+  : async () => undefined

src/renderer/extensions/vueNodes/components/ImagePreview.vue

@@ -34,7 +34,7 @@
         ref="currentImageEl"
         :src="currentImageUrl"
         :alt="imageAltText"
-        class="block size-full object-contain"
+        class="block size-full object-contain pointer-events-none"
         @load="handleImageLoad"
         @error="handleImageError"
       />

src/schemas/apiSchema.ts

@@ -13,6 +13,7 @@ import { LinkReleaseTriggerAction } from '@/types/searchBoxTypes'
 const zNodeType = z.string()
 export const zQueueIndex = z.number()
 export const zPromptId = z.string()
+export type PromptId = z.infer<typeof zPromptId>
 export const resultItemType = z.enum(['input', 'output', 'temp'])
 export type ResultItemType = z.infer<typeof resultItemType>
 

src/stores/queueStore.ts

@@ -2,7 +2,9 @@ import _ from 'es-toolkit/compat'
 import { defineStore } from 'pinia'
 import { computed, ref, shallowRef, toRaw, toValue } from 'vue'
 
+import { isCloud } from '@/platform/distribution/types'
 import { reconcileHistory } from '@/platform/remote/comfyui/history/reconciliation'
+import { getWorkflowFromHistory } from '@/platform/workflow/cloud'
 import type {
   ComfyWorkflowJSON,
   NodeId
@@ -379,24 +381,37 @@ export class TaskItemImpl {
   }
 
   public async loadWorkflow(app: ComfyApp) {
-    if (!this.workflow) {
+    let workflowData = this.workflow
+
+    if (isCloud && !workflowData && this.isHistory) {
+      workflowData = await getWorkflowFromHistory(
+        (url) => app.api.fetchApi(url),
+        this.promptId
+      )
+    }
+
+    if (!workflowData) {
       return
     }
-    await app.loadGraphData(toRaw(this.workflow))
-    if (this.outputs) {
-      const nodeOutputsStore = useNodeOutputStore()
-      const rawOutputs = toRaw(this.outputs)
-      for (const nodeExecutionId in rawOutputs) {
-        nodeOutputsStore.setNodeOutputsByExecutionId(
-          nodeExecutionId,
-          rawOutputs[nodeExecutionId]
-        )
-      }
-      useExtensionService().invokeExtensions(
-        'onNodeOutputsUpdated',
-        app.nodeOutputs
+
+    await app.loadGraphData(toRaw(workflowData))
+
+    if (!this.outputs) {
+      return
+    }
+
+    const nodeOutputsStore = useNodeOutputStore()
+    const rawOutputs = toRaw(this.outputs)
+    for (const nodeExecutionId in rawOutputs) {
+      nodeOutputsStore.setNodeOutputsByExecutionId(
+        nodeExecutionId,
+        rawOutputs[nodeExecutionId]
       )
     }
+    useExtensionService().invokeExtensions(
+      'onNodeOutputsUpdated',
+      app.nodeOutputs
+    )
   }
 
   public flatten(): TaskItemImpl[] {
@@ -492,7 +507,7 @@ export const useQueueStore = defineStore('queue', () => {
 
       const currentHistory = toValue(historyTasks)
 
-      const { items } = reconcileHistory(
+      const items = reconcileHistory(
         history.History,
         currentHistory.map((impl) => impl.toTaskItem()),
         toValue(maxHistoryItems),

tests-ui/tests/platform/remote/comfyui/history/reconciliation.test.ts

@@ -21,8 +21,8 @@ function createHistoryItem(promptId: string, queueIndex = 0): TaskItem {
   }
 }
 
-function getAllPromptIds(result: { items: TaskItem[] }): string[] {
-  return result.items.map((item) => item.prompt[1])
+function getAllPromptIds(result: TaskItem[]): string[] {
+  return result.map((item) => item.prompt[1])
 }
 
 describe('reconcileHistory (V1)', () => {
@@ -74,9 +74,9 @@ describe('reconcileHistory (V1)', () => {
 
       const result = reconcileHistory(serverHistory, [], 10, undefined)
 
-      expect(result.items).toHaveLength(2)
-      expect(result.items[0].prompt[1]).toBe('item-1')
-      expect(result.items[1].prompt[1]).toBe('item-2')
+      expect(result).toHaveLength(2)
+      expect(result[0].prompt[1]).toBe('item-1')
+      expect(result[1].prompt[1]).toBe('item-2')
     })
   })
 
@@ -144,9 +144,9 @@ describe('reconcileHistory (V1)', () => {
 
       const result = reconcileHistory(serverHistory, clientHistory, 2, 10)
 
-      expect(result.items).toHaveLength(2)
-      expect(result.items[0].prompt[1]).toBe('new-1')
-      expect(result.items[1].prompt[1]).toBe('new-2')
+      expect(result).toHaveLength(2)
+      expect(result[0].prompt[1]).toBe('new-1')
+      expect(result[1].prompt[1]).toBe('new-2')
     })
   })
 
@@ -168,13 +168,13 @@ describe('reconcileHistory (V1)', () => {
 
       const result = reconcileHistory([], clientHistory, 10, 5)
 
-      expect(result.items).toHaveLength(0)
+      expect(result).toHaveLength(0)
     })
 
     it('should return empty result when both collections are empty', () => {
       const result = reconcileHistory([], [], 10, undefined)
 
-      expect(result.items).toHaveLength(0)
+      expect(result).toHaveLength(0)
     })
   })
 })
@@ -295,9 +295,9 @@ describe('reconcileHistory (V2/Cloud)', () => {
 
       const result = reconcileHistory(serverHistory, clientHistory, 2)
 
-      expect(result.items).toHaveLength(2)
-      expect(result.items[0].prompt[1]).toBe('new-1')
-      expect(result.items[1].prompt[1]).toBe('new-2')
+      expect(result).toHaveLength(2)
+      expect(result[0].prompt[1]).toBe('new-1')
+      expect(result[1].prompt[1]).toBe('new-2')
     })
   })
 
@@ -310,9 +310,9 @@ describe('reconcileHistory (V2/Cloud)', () => {
 
       const result = reconcileHistory(serverHistory, [], 10)
 
-      expect(result.items).toHaveLength(2)
-      expect(result.items[0].prompt[1]).toBe('item-1')
-      expect(result.items[1].prompt[1]).toBe('item-2')
+      expect(result).toHaveLength(2)
+      expect(result[0].prompt[1]).toBe('item-1')
+      expect(result[1].prompt[1]).toBe('item-2')
     })
 
     it('should return empty result when server history is empty', () => {
@@ -323,13 +323,13 @@ describe('reconcileHistory (V2/Cloud)', () => {
 
       const result = reconcileHistory([], clientHistory, 10)
 
-      expect(result.items).toHaveLength(0)
+      expect(result).toHaveLength(0)
     })
 
     it('should return empty result when both collections are empty', () => {
       const result = reconcileHistory([], [], 10)
 
-      expect(result.items).toHaveLength(0)
+      expect(result).toHaveLength(0)
     })
   })
 })