Save each Comfy run as a new clip even if the output filename repeats.

Purging desktop files let MiniMax reuse MiniMax_H3_00001_, so the next job returned the previous clip. Ignore stale events from the last job so a second generate cannot paste the first video over the new one.

pages/index.vue

@@ -487,6 +487,7 @@ let timer: ReturnType<typeof setInterval> | null = null
 let source: EventSource | null = null
 let pollTimer: ReturnType<typeof setInterval> | null = null
 let settledUi = false
+let listenGen = 0
 
 const elapsedLabel = computed(() => {
   const seconds = Math.floor(elapsedMs.value / 1000)
@@ -739,7 +740,7 @@ async function resumeActiveJob() {
     jobId.value = id
     concealOutput.value = hidden
     settledUi = false
-    applyJobEvent(snap, hidden, locked)
+    applyJobEvent(snap, hidden, locked, id)
     const running = snap.status === 'queued' || snap.status === 'uploading' || snap.status === 'running' || snap.type === 'snapshot'
     if (running && !settledUi) {
       busy.value = true
@@ -828,10 +829,14 @@ async function lockFolder(id: string) {
   }
 }
 
+function clipVideoUrl(clipId: string) {
+  return `/api/library/clips/${clipId}/video?t=${Date.now()}`
+}
+
 function openClip(item: LibraryClip) {
   lockedSave.value = false
   concealOutput.value = item.hideThumbnail
-  videoUrl.value = `/api/library/clips/${item.id}/video`
+  videoUrl.value = clipVideoUrl(item.id)
   awaitingReveal.value = item.hideThumbnail
   playerSize.value = { width: item.width || 1344, height: item.height || 768 }
   browseFolderId.value = item.folderId
@@ -874,6 +879,8 @@ async function generate() {
   }
   statusBusy.value = false
   busy.value = true
+  listenGen += 1
+  stopListen()
   settledUi = false
   progress.value = 1
   videoUrl.value = ''
@@ -905,6 +912,7 @@ async function generate() {
     jobId.value = started.jobId
     maxStep.value = started.steps
     playerSize.value = { width: started.width, height: started.height }
+    settledUi = false
     persistActiveJob(started.jobId, started.hideThumbnail === true || hideThumbnail.value, started.folderLocked === true)
     listen(started.jobId, started.hideThumbnail === true || hideThumbnail.value, started.folderLocked === true)
   } catch (error: any) {
@@ -927,7 +935,10 @@ function stopListen() {
   }
 }
 
-function applyJobEvent(payload: Record<string, any>, hidden: boolean, folderLocked: boolean) {
+function applyJobEvent(payload: Record<string, any>, hidden: boolean, folderLocked: boolean, expectedJobId: string) {
+  if (expectedJobId && jobId.value && expectedJobId !== jobId.value) return
+  if (payload.jobId && expectedJobId && payload.jobId !== expectedJobId) return
+
   if (payload.message) statusMessage.value = payload.message
   statusBusy.value = payload.type === 'busy' || payload.busy === true
   if (typeof payload.progress === 'number') progress.value = payload.progress
@@ -952,12 +963,12 @@ function applyJobEvent(payload: Record<string, any>, hidden: boolean, folderLock
       browseFolderId.value = folderId.value
       statusMessage.value = 'Saved to the locked folder. Unlock it to view.'
     } else if (payload.clipId) {
-      videoUrl.value = `/api/library/clips/${payload.clipId}/video`
+      videoUrl.value = clipVideoUrl(payload.clipId)
       awaitingReveal.value = Boolean(payload.hideThumbnail || hidden)
       concealOutput.value = awaitingReveal.value
       lockedSave.value = false
     } else {
-      videoUrl.value = `/api/media?filename=${encodeURIComponent(payload.filename)}&subfolder=${encodeURIComponent(payload.subfolder || 'video')}&type=${encodeURIComponent(payload.mediaType || 'output')}`
+      videoUrl.value = `/api/media?filename=${encodeURIComponent(payload.filename)}&subfolder=${encodeURIComponent(payload.subfolder || 'video')}&type=${encodeURIComponent(payload.mediaType || 'output')}&t=${Date.now()}`
       awaitingReveal.value = Boolean(payload.hideThumbnail || hidden)
       concealOutput.value = awaitingReveal.value
       lockedSave.value = false
@@ -983,26 +994,31 @@ function applyJobEvent(payload: Record<string, any>, hidden: boolean, folderLock
 }
 
 function listen(id: string, hidden: boolean, folderLocked = false) {
+  const gen = ++listenGen
   stopListen()
   source = new EventSource(`/api/generate/${id}/stream`)
   source.onmessage = (event) => {
-    applyJobEvent(JSON.parse(event.data), hidden, folderLocked)
+    if (gen !== listenGen) return
+    applyJobEvent(JSON.parse(event.data), hidden, folderLocked, id)
   }
   const tick = async () => {
-    if (settledUi) {
-      stopListen()
+    if (gen !== listenGen || settledUi) {
+      if (gen === listenGen && settledUi) stopListen()
       return
     }
     try {
       const snap = await $fetch<Record<string, any>>(`/api/generate/${id}`)
-      applyJobEvent(snap, hidden, folderLocked)
+      if (gen !== listenGen) return
+      applyJobEvent(snap, hidden, folderLocked, id)
     } catch {
+      if (gen !== listenGen) return
       try {
         const recovered = await $fetch<Record<string, any>>('/api/generate/recover', {
           method: 'POST',
           body: { jobId: id }
         })
-        applyJobEvent(recovered, hidden, folderLocked)
+        if (gen !== listenGen) return
+        applyJobEvent(recovered, hidden, folderLocked, id)
       } catch {
         // Job snapshot can 404 briefly after a restart; keep polling while busy.
       }