fix: Add timeout and abort mechanism for image upload (#9226)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/composables/node/useNodeImageUpload.ts

@@ -9,6 +9,7 @@ import { api } from '@/scripts/api'
 import { useAssetsStore } from '@/stores/assetsStore'
 
 const PASTED_IMAGE_EXPIRY_MS = 2000
+const UPLOAD_TIMEOUT_MS = 120_000
 
 interface ImageUploadFormFields {
   /**
@@ -28,11 +29,17 @@ const uploadFile = async (
   if (isPasted) body.append('subfolder', 'pasted')
   if (formFields.type) body.append('type', formFields.type)
 
+  const controller = new AbortController()
+  const timeoutId = setTimeout(() => controller.abort(), UPLOAD_TIMEOUT_MS)
+
   const resp = await api.fetchApi('/upload/image', {
     method: 'POST',
-    body
+    body,
+    signal: controller.signal
   })
 
+  clearTimeout(timeoutId)
+
   if (resp.status !== 200) {
     useToastStore().addAlert(resp.status + ' - ' + resp.statusText)
     return
@@ -88,7 +95,11 @@ export const useNodeImageUpload = (
       if (!path) return
       return path
     } catch (error) {
-      useToastStore().addAlert(String(error))
+      if (error instanceof DOMException && error.name === 'AbortError') {
+        useToastStore().addAlert(t('g.uploadTimedOut'))
+      } else {
+        useToastStore().addAlert(String(error))
+      }
     }
   }
 

src/locales/en/main.json

@@ -176,6 +176,7 @@
     "control_before_generate": "control before generate",
     "choose_file_to_upload": "choose file to upload",
     "uploadAlreadyInProgress": "Upload already in progress",
+    "uploadTimedOut": "Upload timed out. Please try again.",
     "capture": "capture",
     "nodes": "Nodes",
     "nodesCount": "{count} node | {count} nodes",