Conversation
…ipping The default content div used overflow-hidden which clipped handles positioned at left: -7px / right: -7px. Nodes that need clipping (ImageInput, Annotation, VideoTrim) already set their own contentClassName. Co-Authored-By: Claude Opus 4.6 <[email protected]>
Variables from upstream Prompt nodes weren't discovered when a Router sat between the Prompt and PromptConstructor. Added resolveTextSourcesThroughRouters() helper that recursively traverses router nodes to find actual text sources, used in both the component and executor. Co-Authored-By: Claude Opus 4.6 <[email protected]>
Co-Authored-By: Claude Opus 4.6 <[email protected]>
Store measured settings panel height in node data (_settingsPanelHeight). On workflow load, subtract it from persisted height so BaseNode's expand effect re-adds the real panel height from a clean baseline instead of double-counting. Co-Authored-By: Claude Opus 4.6 <[email protected]>
The pre-subtraction in loadWorkflow was overridden by React Flow's dimension reconciliation. Instead, correct at the source: in BaseNode's expand timeout, read _settingsPanelHeight from node data and only add the delta (measured - saved) so reloaded nodes don't double-count. Also clear _settingsPanelHeight on collapse to avoid stale values. Co-Authored-By: Claude Opus 4.6 <[email protected]>
Use the Lucide split icon (rotated 90deg) for the auto-route button to better convey the splitting action. Also improve settings reactivity by reading from Zustand store directly and reparsing atomically on setting changes. Co-Authored-By: Claude Opus 4.6 <[email protected]>
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (2)
📝 WalkthroughWalkthroughPersist settings-panel heights on nodes, add router-aware resolution for upstream text sources, atomically reparse ArrayNode split-setting changes, move/adjust node handle and overflow rendering (including z-index), update a modal backdrop test selector, and bump package version to 1.1.3. Changes
Sequence Diagram(s)mermaid Estimated code review effort🎯 4 (Complex) | ⏱️ ~45 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 1 | ❌ 2❌ Failed checks (1 warning, 1 inconclusive)
✅ Passed checks (1 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
…s to prevent handle clipping Nodes that passed overflow-clip via contentClassName to BaseNode were clipping their React Flow handles since handles are children of the content div. Moved the clip to inner content wrappers that don't contain handles. Co-Authored-By: Claude Opus 4.6 <[email protected]>
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/components/nodes/BaseNode.tsx`:
- Around line 111-114: The code mutates node.data (_settingsPanelHeight) via
React Flow's setNodes (in the applyNodeDimensions/getNodeDimension branches) but
the app treats workflowStore (useWorkflowStore) as the source of truth; change
these updates to call the store helper updateNodeData(node.id, {
_settingsPanelHeight: 0 }) (or a small helper that applies dimensions and then
calls updateNodeData) instead of writing into node.data directly so subscribers
and persistence remain in sync; locate the occurrences around
applyNodeDimensions/getNodeDimension (and the similar blocks at lines noted) and
replace direct node.data changes with calls to updateNodeData while preserving
the width/height dimension logic.
- Around line 148-155: When restoring node size after measuring panel height,
clamp the computed new height to the node's minimum: compute savedPanelHeight
and heightToAdd as before, then ensure the updated height uses
Math.max(minHeight, currentHeight + heightToAdd) before calling
applyNodeDimensions; update the returned data to still set _settingsPanelHeight
to finalHeight. Modify the branch around savedPanelHeight/heightToAdd
(references: savedPanelHeight, heightToAdd, finalHeight, minHeight,
getNodeDimension, applyNodeDimensions, _settingsPanelHeight) so the node never
shrinks below minHeight on reloads or model changes.
In `@src/store/utils/connectedInputs.ts`:
- Around line 128-155: resolveTextSourcesThroughRouters currently only unwraps
"router" nodes and stops at "switch" nodes, causing upstream prompt/LLM
variables to be missed; update the traversal so "switch" is treated as a
passthrough like in getConnectedInputsPure. In practice, modify the logic inside
resolveTextSourcesThroughRouters (the node.type check) to also recurse when
node.type === "switch" (i.e., treat node.type === "router" || node.type ===
"switch"), gather upstreamNodes the same way (filter edges by target === node.id
and targetHandle === "text", map to allNodes by e.source, filter undefined), and
call resolveTextSourcesThroughRouters recursively with the same visited Set so
switch nodes are unwrapped into their upstream text sources. Ensure visited
handling remains unchanged to avoid cycles.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 242a09cc-267e-4b55-9871-18aada65209f
📒 Files selected for processing (7)
src/components/__tests__/WelcomeModal.test.tsxsrc/components/nodes/ArrayNode.tsxsrc/components/nodes/BaseNode.tsxsrc/components/nodes/PromptConstructorNode.tsxsrc/store/execution/simpleNodeExecutors.tssrc/store/utils/connectedInputs.tssrc/types/nodes.ts
| return { | ||
| ...applyNodeDimensions(node, getNodeDimension(node, "width"), newHeight), | ||
| data: { ...node.data, _settingsPanelHeight: 0 }, | ||
| }; |
There was a problem hiding this comment.
🛠️ Refactor suggestion | 🟠 Major
Persist _settingsPanelHeight through the Zustand store, not setNodes.
These branches now mutate node.data through React Flow while the repo treats workflowStore.ts as the source of truth for node state. Since components in this PR already read node data back from the store, _settingsPanelHeight should go through updateNodeData() (or a small helper that updates dimensions and data together) so persistence and other subscribers stay in sync. As per coding guidelines, "All application state lives in workflowStore.ts using Zustand; access via useWorkflowStore() hook" and "Update node state using updateNodeData(nodeId, partialData) instead of direct mutations".
Also applies to: 153-156, 203-206
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/nodes/BaseNode.tsx` around lines 111 - 114, The code mutates
node.data (_settingsPanelHeight) via React Flow's setNodes (in the
applyNodeDimensions/getNodeDimension branches) but the app treats workflowStore
(useWorkflowStore) as the source of truth; change these updates to call the
store helper updateNodeData(node.id, { _settingsPanelHeight: 0 }) (or a small
helper that applies dimensions and then calls updateNodeData) instead of writing
into node.data directly so subscribers and persistence remain in sync; locate
the occurrences around applyNodeDimensions/getNodeDimension (and the similar
blocks at lines noted) and replace direct node.data changes with calls to
updateNodeData while preserving the width/height dimension logic.
Nodes with `position: relative` on inner wrappers (e.g. image wrapper needing it for its remove button) caused left-side handles to render behind the wrapper due to CSS painting order. Adding z-index: 5 to all handles ensures they always paint above node content. Co-Authored-By: Claude Opus 4.6 <[email protected]>
…der clipping The left handle was rendered before the image wrapper div in DOM order. Since the image wrapper has position: relative (needed for its remove button), it painted over the handle. Moving both handles to render after visual content ensures they paint last (on top). Co-Authored-By: Claude Opus 4.6 <[email protected]>
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@src/components/nodes/ImageInputNode.tsx`:
- Around line 142-149: The target Handle metadata uses generic "reference"
values; update the Handle in ImageInputNode so its id and data-handletype follow
image conventions (change id="reference" to id="image" and
data-handletype="reference" to data-handletype="image") so the component Handle
(Handle, Position.Left) correctly identifies Base64 image payloads for node
connections.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: d70de02e-c9ec-490a-b08a-12d38938a164
📒 Files selected for processing (5)
src/app/globals.csssrc/components/nodes/AnnotationNode.tsxsrc/components/nodes/GLBViewerNode.tsxsrc/components/nodes/ImageInputNode.tsxsrc/components/nodes/VideoTrimNode.tsx
✅ Files skipped from review due to trivial changes (1)
- src/components/nodes/GLBViewerNode.tsx
| {/* Handles rendered after visual content so they paint on top */} | ||
| <Handle | ||
| type="target" | ||
| position={Position.Left} | ||
| id="reference" | ||
| data-handletype="reference" | ||
| className="!bg-gray-500" | ||
| /> |
There was a problem hiding this comment.
Normalize target handle metadata to image conventions.
At Line 146-147, id="reference" and data-handletype="reference" deviate from the node handle conventions for image payloads. Please use image-aligned handle metadata.
Proposed fix
<Handle
type="target"
position={Position.Left}
- id="reference"
- data-handletype="reference"
+ id="image"
+ data-handletype="image"
className="!bg-gray-500"
/>As per coding guidelines: "Use descriptive handle IDs matching the data type: id="image" for image data and id="text" for text data" and "Use image handle type for Base64 data URLs, text for strings, and audio for Base64 data URLs in node connections".
📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| {/* Handles rendered after visual content so they paint on top */} | |
| <Handle | |
| type="target" | |
| position={Position.Left} | |
| id="reference" | |
| data-handletype="reference" | |
| className="!bg-gray-500" | |
| /> | |
| {/* Handles rendered after visual content so they paint on top */} | |
| <Handle | |
| type="target" | |
| position={Position.Left} | |
| id="image" | |
| data-handletype="image" | |
| className="!bg-gray-500" | |
| /> |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@src/components/nodes/ImageInputNode.tsx` around lines 142 - 149, The target
Handle metadata uses generic "reference" values; update the Handle in
ImageInputNode so its id and data-handletype follow image conventions (change
id="reference" to id="image" and data-handletype="reference" to
data-handletype="image") so the component Handle (Handle, Position.Left)
correctly identifies Base64 image payloads for node connections.
… nodes BaseNode: the settings expand branch now clamps the computed height to minHeight, matching the collapse and ResizeObserver branches. connectedInputs: resolveTextSourcesThroughRouters now recurses through switch nodes (same as routers) so upstream text sources are not missed. Co-Authored-By: Claude Opus 4.6 <[email protected]>
Co-Authored-By: Claude Opus 4.6 <[email protected]>
1 participant
What's New in v1.1.3
Bug Fixes
Prompt variables now work through Router nodes — PromptConstructor nodes connected through a Router will correctly resolve their
{variables}, fixing workflows that use routing to fan out prompts.Node handles no longer get clipped — Connection handles at the edges of nodes are now fully visible and clickable, fixing a layout issue where overflow was hidden on certain node types.
Nodes no longer grow taller every time you reopen a workflow — Fixed a bug where nodes with inline parameters (like model settings panels) would accumulate extra height each time the workflow was loaded.
Panel height is now corrected at render time — Moved the height correction logic from workflow load into the BaseNode component itself, making it more reliable and eliminating a class of dimension bugs caused by React Flow reconciliation.
ArrayNode auto-route icon updated — The auto-route toggle on Array nodes now uses a proper split icon from Lucide instead of a placeholder, making its purpose clearer.
6 commits, 7 files changed
🤖 Generated with Claude Code
Summary by CodeRabbit
Bug Fixes
UI / Visual
New Features