diff --git a/src/components/nodes/GenerateImageNode.tsx b/src/components/nodes/GenerateImageNode.tsx index 863a2545..5c6f6caf 100644 --- a/src/components/nodes/GenerateImageNode.tsx +++ b/src/components/nodes/GenerateImageNode.tsx @@ -1,6 +1,6 @@ "use client"; -import React, { useCallback, useState, useEffect, useMemo } from "react"; +import React, { useCallback, useState, useEffect, useMemo, useRef } from "react"; import { Handle, Position, NodeProps, Node, useReactFlow } from "@xyflow/react"; import { BaseNode } from "./BaseNode"; import { ModelParameters } from "./ModelParameters"; @@ -8,6 +8,7 @@ import { useWorkflowStore, saveNanoBananaDefaults } from "@/store/workflowStore" import { NanoBananaNodeData, AspectRatio, Resolution, ModelType, ProviderType, SelectedModel, ModelInputDef } from "@/types"; import { ProviderModel, ModelCapability } from "@/lib/providers/types"; import { ModelSearchDialog } from "@/components/modals/ModelSearchDialog"; +import { useToast } from "@/components/Toast"; // All 10 aspect ratios supported by both models const ASPECT_RATIOS: AspectRatio[] = ["1:1", "2:3", "3:2", "3:4", "4:3", "4:5", "5:4", "9:16", "16:9", "21:9"]; @@ -385,6 +386,17 @@ export function GenerateImageNode({ id, data, selected }: NodeProps 1; + // Track previous status to detect error transitions + const prevStatusRef = useRef(nodeData.status); + + // Show toast when error occurs + useEffect(() => { + if (nodeData.status === "error" && prevStatusRef.current !== "error" && nodeData.error) { + useToast.getState().show("Generation failed", "error", true, nodeData.error); + } + prevStatusRef.current = nodeData.status; + }, [nodeData.status, nodeData.error]); + return ( <> )} + {/* Error overlay when generation failed */} + {nodeData.status === "error" && ( +
+ + + + Generation failed + See toast for details +
+ )} {/* Loading overlay for carousel navigation */} {isLoadingCarouselImage && (