- Add isLoadingCarouselVideo state for loading indicator
- Add generationsPath from store for video loading
- Add loadVideoById callback to fetch videos from API
- Add carousel navigation handlers (handleCarouselPrevious/Next)
- Add hasCarouselVideos check for conditional display
- Add carousel UI with prev/next buttons and position indicator
- Add loading overlay during carousel navigation
- Update validation.ts with videoHistory fields
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Import useToast and useRef for error handling
- Add useEffect to trigger persistent toast when error occurs
- Add red error overlay visible over previous output video
- Overlay shows error icon and directs user to toast for details
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Introduced a model search dialog for selecting external models in GenerateImageNode and GenerateVideoNode.
- Updated node titles to reflect selected models dynamically.
- Improved parameter handling by expanding the ModelParameters component to notify parent nodes on schema load.
- Adjusted handle positions and styles for better alignment and visual consistency.
- Enhanced input validation and processing for dynamic inputs across the workflow.
Use calc() to offset handle positions by 5px (half of 10px handle size)
to center handles at their percentage positions. This ensures edge
connection points align with the visible handle dots and labels.
Avoid using CSS transform which breaks React Flow's handle detection.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Handle colors: cyan (#22d3ee) for image, magenta (#d946ef) for text
- Labels positioned outside node boundary (left of inputs, right of outputs)
- Label text color matches handle color
- Inputs sorted: image handles at top, text handles at bottom
- Visual gap between image and text input groups
- Added CSS variables for handle colors (used by label styling)
- Output handles also have colored labels (Video/Image)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Render dynamic input handles from model schema (GenerateImage/VideoNode)
- Update connection validation with getHandleType() helper
- Add dynamicInputs to getConnectedInputs() return value
- Pass dynamicInputs through generation pipeline (workflowStore -> API)
- Update generateWithFal/Replicate to use dynamic inputs
- Process large images in dynamicInputs to URLs for external providers
- Support prompt from dynamicInputs when top-level prompt is empty
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add ModelInputDef type to node data interfaces
- Update ModelParameters to pass inputs via onInputsLoaded callback
- GenerateImageNode and GenerateVideoNode store input schema
This sets up the foundation for dynamic handle rendering.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add onExpandChange callback to ModelParameters component
- Remove max-height constraint from expanded parameters
- GenerateImageNode/GenerateVideoNode calculate new height based on parameter count
- Node height grows when expanded, shrinks when collapsed
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add inline validation for number/integer parameters with min/max bounds
- Show red border and error text for out-of-range values
- Clear parameters when switching provider or model (schemas differ)
- Validation shows specific constraints (Min/Max values, integer requirement)
- Add modelsFetchError state with retry button in GenerateImage/VideoNode
- Show clear errors when model list fails to load (API key issues, connection)
- Improve API route error messages to include model name
- Add rate limit handling (429) with user-friendly messages
- Parse provider-specific error responses for better detail
- Improve timeout message for video generation
- Create ModelParameters component with collapsible UI
- Fetches schema from /api/models/{modelId} endpoint
- Renders appropriate inputs based on parameter type (string, number, boolean, enum)
- Add parameters field to NanoBananaNodeData and GenerateVideoNodeData
- Integrate into GenerateImageNode and GenerateVideoNode
Add GenerateVideoNode for video generation using Replicate and fal.ai:
- Add GenerateVideoNodeData interface with video output field
- Add generateVideo to NodeType union
- Create GenerateVideoNode component with provider/model selection
- Register in WorkflowCanvas with purple minimap color (#9333ea)
- Add default dimensions and node data creation in store
- Update validation.ts for new node type
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
shrimbly