From 4dde7acf6a70165770aacf3b5233df61276f8077 Mon Sep 17 00:00:00 2001
From: shrimbly <falloon.willie@gmail.com>
Date: Tue, 10 Feb 2026 07:35:51 +1300
Subject: [PATCH] fix: video regeneration spinner stuck + cancel error message

Fix video element not reloading on regeneration by adding key prop tied
to video history ID. Fix cancel showing timeout message by passing
"user-cancelled" reason through AbortController and checking it in all
three executor catch blocks.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/nodes/GenerateVideoNode.tsx   |  1 +
 src/store/execution/generateVideoExecutor.ts |  5 ++++-
 src/store/execution/llmGenerateExecutor.ts   | 19 ++++++++++++++++---
 src/store/execution/nanoBananaExecutor.ts    |  5 ++++-
 src/store/workflowStore.ts                   |  2 +-
 5 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/src/components/nodes/GenerateVideoNode.tsx b/src/components/nodes/GenerateVideoNode.tsx
index fc265ac6..19f71b99 100644
--- a/src/components/nodes/GenerateVideoNode.tsx
+++ b/src/components/nodes/GenerateVideoNode.tsx
@@ -592,6 +592,7 @@ export function GenerateVideoNode({ id, data, selected }: NodeProps<GenerateVide
           <>
           <div className="relative w-full flex-1 min-h-0">
             <video
+              key={nodeData.videoHistory?.[nodeData.selectedVideoHistoryIndex || 0]?.id}
               src={nodeData.outputVideo}
               controls
               autoPlay
diff --git a/src/store/execution/generateVideoExecutor.ts b/src/store/execution/generateVideoExecutor.ts
index ab51c139..c223db34 100644
--- a/src/store/execution/generateVideoExecutor.ts
+++ b/src/store/execution/generateVideoExecutor.ts
@@ -195,7 +195,10 @@ export async function executeGenerateVideo(
   } catch (error) {
     let errorMessage = "Video generation failed";
     if (error instanceof DOMException && error.name === "AbortError") {
-      errorMessage = "Request timed out. Video generation may take longer.";
+      const isUserCancel = signal?.reason === "user-cancelled";
+      errorMessage = isUserCancel
+        ? "Generation cancelled."
+        : "Request timed out. Video generation may take longer.";
     } else if (error instanceof TypeError && error.message.includes("NetworkError")) {
       errorMessage = "Network error. Check your connection and try again.";
     } else if (error instanceof TypeError) {
diff --git a/src/store/execution/llmGenerateExecutor.ts b/src/store/execution/llmGenerateExecutor.ts
index 3b1aca5e..92d58ec9 100644
--- a/src/store/execution/llmGenerateExecutor.ts
+++ b/src/store/execution/llmGenerateExecutor.ts
@@ -107,11 +107,24 @@ export async function executeLlmGenerate(
       throw new Error(result.error || "LLM generation failed");
     }
   } catch (error) {
+    let errorMessage = "LLM generation failed";
+    if (error instanceof DOMException && error.name === "AbortError") {
+      const isUserCancel = signal?.reason === "user-cancelled";
+      errorMessage = isUserCancel
+        ? "Generation cancelled."
+        : "Request timed out. Try using a simpler prompt.";
+    } else if (error instanceof TypeError && error.message.includes("NetworkError")) {
+      errorMessage = "Network error. Check your connection and try again.";
+    } else if (error instanceof TypeError) {
+      errorMessage = `Network error: ${error.message}`;
+    } else if (error instanceof Error) {
+      errorMessage = error.message;
+    }
+
     updateNodeData(node.id, {
       status: "error",
-      error: error instanceof Error ? error.message : "LLM generation failed",
+      error: errorMessage,
     });
-    if (error instanceof DOMException && error.name === "AbortError") throw error;
-    throw error instanceof Error ? error : new Error("LLM generation failed");
+    throw error instanceof Error ? error : new Error(errorMessage);
   }
 }
diff --git a/src/store/execution/nanoBananaExecutor.ts b/src/store/execution/nanoBananaExecutor.ts
index 8d1e4e84..7fc95dc4 100644
--- a/src/store/execution/nanoBananaExecutor.ts
+++ b/src/store/execution/nanoBananaExecutor.ts
@@ -214,7 +214,10 @@ export async function executeNanoBanana(
     // Convert network/abort errors to user-friendly messages
     let errorMessage = "Generation failed";
     if (error instanceof DOMException && error.name === "AbortError") {
-      errorMessage = "Request timed out. Try reducing image sizes or using a simpler prompt.";
+      const isUserCancel = signal?.reason === "user-cancelled";
+      errorMessage = isUserCancel
+        ? "Generation cancelled."
+        : "Request timed out. Try reducing image sizes or using a simpler prompt.";
     } else if (error instanceof TypeError && error.message.includes("NetworkError")) {
       errorMessage = "Network error. Check your connection and try again.";
     } else if (error instanceof TypeError) {
diff --git a/src/store/workflowStore.ts b/src/store/workflowStore.ts
index cf8bfe6b..e398cfd4 100644
--- a/src/store/workflowStore.ts
+++ b/src/store/workflowStore.ts
@@ -967,7 +967,7 @@ export const useWorkflowStore = create<WorkflowStore>((set, get) => ({
     // Abort any in-flight requests
     const controller = get()._abortController;
     if (controller) {
-      controller.abort();
+      controller.abort("user-cancelled");
     }
     set({ isRunning: false, currentNodeIds: [], _abortController: null });
   },