When providers like fal.ai or Replicate expect array parameters (e.g.,
image_urls), single values from dynamicInputs are now automatically
wrapped in arrays based on the OpenAPI schema's type property.
Changes:
- Add isArray field to ModelInput type for schema detection
- Update getFalInputMapping() to return schemaArrayParams
- Update getInputMappingFromSchema() to return schemaArrayParams
- Apply array wrapping in both fal.ai and Replicate handlers
- Add tests for array wrapping behavior
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add provider icons (Gemini, Replicate, fal.ai) as filter buttons
- Replace dropdown with horizontal icon button group
- Add green badge color for Gemini provider
- Add 'Recently Used' section at top of model list
- Filter recent models by capability (image/video)
- Show max 4 recent models with cover images
- Track model usage via trackModelUsage on selection
- Add getProviderDisplayName helper for consistent naming
- Add GEMINI_IMAGE_MODELS constant with nano-banana and nano-banana-pro
- Update GET handler to include Gemini models in response
- Support provider=gemini filter (returns only Gemini models)
- Gemini models appear first in 'all providers' results
- No API key needed for Gemini (always available)
Create api.ts with GenerateRequest, GenerateResponse, LLMGenerateRequest,
LLMGenerateResponse. Move RecentModel to providers.ts. Convert index.ts
to pure re-export hub with no type definitions.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Create models.ts with AspectRatio, Resolution, ModelType.
Create workflow.ts with WorkflowEdge, WorkflowEdgeData, WorkflowSaveConfig,
WorkflowCostData, NodeGroup, GroupColor. Update nodes.ts to import from
domain files instead of index.ts to avoid circular dependencies.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add RecentModel interface to types/index.ts
- Add localStorage helpers: getRecentModels, saveRecentModels, MAX_RECENT_MODELS
- Add recentModels state to workflowStore (initialized from localStorage)
- Add trackModelUsage action to track model usage with timestamps
Create providers.ts with ProviderType, SelectedModel, ProviderConfig,
ProviderSettings, LLMProvider, and LLMModelType. Update index.ts to
re-export from providers.ts and import types for internal use.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Replace position-based sampling hash with MD5 in imageStorage.ts
- Add computeContentHash helper function
- Consistent with save-generation API (Phase 13 decision)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add tests verifying the parameters field (UI settings) is passed to
provider APIs:
- Replicate: parameters passed to prediction input
- Replicate: dynamicInputs take precedence when merging
- fal.ai: parameters passed to request body
- fal.ai: dynamicInputs take precedence when merging
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive tests for dynamic input handles:
- Multiple image handles for multi-frame video models
- Placeholder handles with dimmed opacity
- Handle ordering (images before text)
- Gap spacing between handle groups
- Schema integration tests
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive tests for dynamic input handles:
- Multiple image handles with schema-name attributes
- Multiple text handles with schema-name attributes
- Placeholder handle variations with dimmed opacity
- Handle ordering (images before text)
- Gap spacing between handle groups
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive tests for /api/models route covering:
- Basic functionality: fal.ai without key, both providers with keys
- Provider filtering by query param
- Capabilities filtering
- Search query param (client-side for Replicate, server-side for fal.ai)
- Caching behavior: cache hits, cache misses, refresh bypass
- Error handling: partial provider failures, all providers failing
- Pagination for both Replicate and fal.ai (max 15 pages)
- Capability inference for Replicate models (video keywords, i2v keywords)
- fal.ai category mapping to ModelCapability
- Model sorting by provider then name
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive tests for /api/generate fal.ai path:
- Image generation success (images array response)
- Video generation success (video object response)
- Works without API key (unauthenticated allowed)
- Rate limit (429) handling with and without key
- Various response formats (image, images, video, output)
- Large video (>20MB) returns URL instead of base64
- Empty dynamicInputs values are filtered
- Dynamic inputs passed to fal.ai request
- Environment variable API key fallback
- Error response formats (error.message, detail array)
- No media URL in response handling
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive tests for /api/generate Replicate path:
- Image generation success with API key header
- Video generation success
- 401 when API key missing
- Rate limit (429) handling
- Prediction failure handling
- Prediction timeout (5 min max)
- Polling for prediction completion
- Large video (>20MB) returns URL instead of base64
- Dynamic inputs passed to prediction
- Environment variable API key fallback
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add tests for input validation and edge cases:
- Reject requests with no prompt, images, or dynamic inputs
- Accept image-to-image (images only, no prompt)
- Accept dynamicInputs with prompt, image frames, and image_url
- Handle multiple images in request
Add provider routing tests:
- Route to Gemini when no selectedModel provided
- Route to Gemini when selectedModel.provider is gemini
- Return 401 for Replicate without API key
Add response handling tests:
- Verify proper response structure
- Handle default MIME type fallback
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Add comprehensive tests for /api/generate route covering Gemini path:
- Success with prompt only and with images
- Config options (aspectRatio, resolution, googleSearch)
- Model mapping (nano-banana, nano-banana-pro)
- API key handling (env var vs header)
- Error cases (missing key, rate limits, no candidates, text-only response)
- MIME type extraction from data URLs
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Tests Google/Gemini provider path covering success, validation, rate limits,
and API error handling. Uses vi.hoisted for proper mock class constructor.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
GroupsOverlay tests (24 tests):
- Test empty state rendering (no groups)
- Test group background rendering in ViewportPortal
- Test position, size, and color application
- Test group controls header with name display
- Test name editing (click, Enter, Escape, blur)
- Test lock/unlock toggle functionality
- Test color picker display and color selection
- Test delete group functionality
- Test multiple groups rendering
ModelParameters tests (30 tests):
- Test initial rendering (Gemini bypass, empty modelId)
- Test loading state and schema fetching
- Test error handling (fetch failure, network error)
- Test empty schema handling (component hides)
- Test collapse/expand toggle functionality
- Test parameter count display
- Test string input rendering and onChange
- Test number input with min/max validation
- Test integer validation (decimal error)
- Test boolean checkbox with schema defaults
- Test enum/select rendering with options
- Test parameter name formatting (snake_case to Title)
- Test API key headers in fetch requests
- Test onInputsLoaded callback
- Test multiple parameter types rendering
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Test empty state rendering (returns null when no history)
- Test trigger button with count badge and title
- Test fan open/close toggle functionality
- Test max 10 items in fan view with overflow indicator
- Test sidebar display with all history items
- Test Clear All functionality calling clearGlobalHistory
- Test model display (Pro vs Standard labels)
- Test prompt display with truncation and empty state
- Test drag and drop with proper data transfer
- Test relative time formatting (just now, minutes, hours)
- Test image thumbnail rendering in fan and sidebar
- Test keyboard navigation (Escape to close)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add QuickstartTemplatesView tests for preset and community workflow loading
- Add PromptWorkflowView tests for prompt input, validation, and generation
- Add QuickstartBackButton tests for click behavior and disabled state
- Mock fetch for template and workflow APIs
- Test error handling and loading states
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add WelcomeModal tests for rendering, navigation, file loading, and view transitions
- Add QuickstartInitialView tests for option buttons, external links, and accessibility
- Mock fetch for community workflows API and getAllPresets template function
- Test file input handling with valid/invalid workflow files
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Test visibility (render/not render based on isOpen)
- Test textarea with initial prompt value and typing updates
- Test Submit button calls onSubmit with updated prompt
- Test Cancel button behavior with/without unsaved changes
- Test unsaved changes confirmation dialog
- Test Escape key and backdrop click behaviors
- Test font size dropdown persistence with localStorage
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
ProjectSetupModal tests:
- Add tests for visibility and tab navigation
- Add tests for new project vs settings mode
- Add tests for form validation (name, directory)
- Add tests for save/create behavior with directory validation
- Add tests for browse directory functionality
- Add tests for keyboard shortcuts (Enter, Escape)
- Add tests for Providers tab API key inputs
CostDialog tests:
- Add tests for basic rendering and sections
- Add tests for cost display formatting
- Add tests for per-model cost breakdown
- Add tests for empty state handling
- Add tests for reset costs functionality
- Add tests for close behavior
- Add tests for pricing reference display
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add tests for visibility (isOpen, modal count registration)
- Add tests for search functionality (debounced search, auto-focus)
- Add tests for provider filter (dropdown, API filtering)
- Add tests for capability filter (image vs video filtering)
- Add tests for model card rendering (name, description, badges)
- Add tests for model selection (callback mode, create node mode)
- Add tests for close behavior (button, Escape, backdrop click)
- Add tests for loading, error, and empty states
- Add tests for API headers with provider keys
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
Toast tests:
- Add tests for basic rendering (message, close button)
- Add tests for type styling (info, success, warning, error)
- Add tests for type icons
- Add tests for close button functionality
- Add tests for auto-hide after 4 seconds
- Add tests for persistent toast behavior
- Add tests for details section (collapsed/expanded states)
- Add tests for useToast store (show/hide)
CostIndicator tests:
- Add tests for basic rendering (hidden when no nodes/costs)
- Add tests for zero cost display
- Add tests for non-zero cost formatting
- Add tests for CostDialog opening/closing
- Add tests for cost updates when nodes change
- Add tests for splitGrid node cost calculation
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add tests for basic rendering (position, header, shortcuts)
- Add tests for node type filtering by handle type (source/target)
- Add tests for menu item click behavior
- Add tests for keyboard navigation (arrows, enter, escape)
- Add tests for click outside closing
- Add tests for mouse hover highlighting
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
EditableEdge.test.tsx (17 tests):
- Basic rendering with path and interaction layer
- Edge colors for image, prompt, and pause states
- Pause indicator visibility
- Draggable handles in angular mode
- Selection state opacity
- Loading animation for target node
ReferenceEdge.test.tsx (13 tests):
- Basic rendering with dashed style
- Gray color gradient
- No interactive elements (read-only)
- Selection state opacity
- Connection to source and target nodes
EdgeToolbar.test.tsx (13 tests):
- Visibility based on edge selection
- Pause toggle button with correct icons
- Delete button functionality
- Toolbar positioning
- Button styling for pause states
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add 31 tests for WorkflowCanvas covering:
- Basic rendering (ReactFlow, Background, Controls, MiniMap)
- Welcome modal visibility based on canvas state
- Node and edge type registration
- Drag and drop for nodes, images, and workflows
- Keyboard shortcuts (Ctrl+Enter, Ctrl+C, Shift+key node creation)
- Canvas configuration (zoom, delete keys, multi-selection)
- Group handling support
- Add ResizeObserver and DOMMatrixReadOnly mocks to test setup for React Flow
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Basic rendering tests (title, icon, links)
- Unconfigured project state display
- Configured project state with CostIndicator
- Save state display (saving, saved timestamp)
- Unsaved changes indicator (red dot)
- New Project button modal trigger
- Open file button and file input
- Save button with disabled state
- Settings button modal trigger
- Open Project Folder button visibility and API call
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Basic rendering with title and handles (image input/output)
- Empty state with "Drop, click, or connect" message
- Image display (sourceImage, outputImage, priority logic)
- Edit overlay with annotation count display
- Modal opening via image click with existing annotations
- Remove button clearing all image data and annotations
- File upload with format/size validation (PNG, JPG, WebP; <10MB)
- Drag and drop handling
- Custom title editing functionality
Note: Tests focus on component shell and state management,
not internal Konva canvas interactions per plan guidance.
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Basic rendering with title and handles (text/image input, text output)
- Provider selector (Google, OpenAI) with model switching
- Model selector dropdown based on selected provider
- Temperature slider rendering and editing
- Loading state with spinner
- Error state display with fallback message
- Output text display with regenerate and clear buttons
- Custom title editing functionality
- Model fallback when current model is invalid for provider
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add comprehensive tests for GenerateVideoNode component
- Test fal.ai and Replicate provider badges (Gemini excluded)
- Verify Gemini is not available for video generation
- Test video output display with controls, autoplay, loop, muted
- Test video history carousel navigation
- Test loading and error states
- Test dynamic input handles from schema
- Test run button and custom title functionality
- Test Browse button opens ModelSearchDialog
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add comprehensive tests for GenerateImageNode component
- Test provider badge display for Gemini, fal.ai, and Replicate
- Test model selection, browse button, and ModelSearchDialog
- Test output image display, loading states, and error states
- Test image history carousel navigation
- Test legacy data migration from model to selectedModel
- Test dynamic input handles for external providers
- Test run button and custom title functionality
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
SplitGridNode tests (23):
- Basic rendering with title, input/output handles
- Grid configuration display (rows x cols)
- Empty state and unconfigured warning
- Source image display with grid overlay
- Settings modal open/close and auto-open behavior
- Split button functionality and disabled states
- Child node count display
- Loading and error states
- Custom title editing
GroupNode tests (28):
- Basic rendering with group name and color
- Color picker button and delete button
- Group name editing (Enter, Escape, blur)
- Color picker open/close and color selection
- Delete group functionality
- Node resizer visibility based on selection
- Header drag functionality
- All 6 group colors (neutral, blue, green, purple, orange, red)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add 31 tests covering all OutputNode functionality
- Test empty state rendering with placeholder
- Test image content display with correct src
- Test all video detection paths:
- data.video present
- contentType === "video"
- data.image starts with "data:video/"
- data.image contains ".mp4" or ".webm"
- Test video controls (controls, loop, muted, autoPlay, playsInline)
- Test lightbox open/close functionality
- Test download for data URL and HTTP URL content
- Test custom title display and editing
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
PromptNode test extensions:
- Add test for expand button rendering
- Add test for incrementModalCount called when expand clicked
- Add test for text output handle presence
ImageInputNode tests (21 tests):
- Basic rendering (title, drop zone, handles)
- Image display (image src, filename, dimensions)
- File input change handler with FileReader mocking
- File validation (reject non-images, reject >10MB files)
- Accept PNG, JPEG, WebP file types
- Remove button functionality
- Drag and drop event handling
- Click to upload via drop zone
- Custom title and comment functionality
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add 35 comprehensive tests for BaseNode component
- Test basic rendering (title, children, className, customTitle, titlePrefix, headerAction)
- Test title editing flow (click to edit, typing, submit on Enter, cancel on Escape, blur)
- Test comment functionality (add, edit, save, cancel, escape key)
- Test expand button rendering and click handler
- Test run button rendering, click handler, and disabled state
- Test lock badge display for nodes in locked groups
- Test visual states (selected, executing, error styling)
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Create src/store/utils/nodeDefaults.ts with node creation utilities
- Move createDefaultNodeData function (90 lines)
- Move GROUP_COLORS and GROUP_COLOR_ORDER constants
- Consolidate defaultNodeDimensions (was duplicated in addNode and createGroup)
- Fix: createGroup's dimensions now includes generateVideo node type
- Re-export GROUP_COLORS from workflowStore for backward compatibility
- Create PromptNode.test.tsx with React Testing Library
- Test textarea rendering and placeholder
- Test initial prompt value display
- Test updateNodeData callback on user input
- Mock Zustand store and wrap with ReactFlowProvider
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
- Add jsdom, @testing-library/react, @testing-library/jest-dom, vite-tsconfig-paths
- Update vitest.config.ts with jsdom environment, react and tsconfigPaths plugins
- Create src/test/setup.ts with cleanup and jest-dom matchers
- Add vitest/globals type to tsconfig.json
Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
shrimbly