fix(dashboard): feedback edges connect from node sides via left/right handles (#247)

What: Feedback (back) edges now connect from the left/right side of nodes
instead of top/bottom, making the routing visually clearer.

Changes:
- role-node.tsx: add Left/Right handles for feedback edge connections
- use-layout.ts: set sourceHandle/targetHandle for feedback edges
- condition-edge.tsx + use-layout.ts: increase FEEDBACK_OFFSET_X to 140

Ref: #247
This commit is contained in:
2026-05-14 15:52:24 +08:00
parent a450a88b16
commit 5e783e7a24
2 changed files with 6 additions and 0 deletions
@@ -46,6 +46,10 @@ export function RoleNode(props: NodeProps) {
title={data.description} title={data.description}
> >
<Handle type="target" position={Position.Top} style={handleStyle} isConnectable={false} /> <Handle type="target" position={Position.Top} style={handleStyle} isConnectable={false} />
<Handle type="target" position={Position.Left} id="left-in" style={handleStyle} isConnectable={false} />
<Handle type="target" position={Position.Right} id="right-in" style={handleStyle} isConnectable={false} />
<Handle type="source" position={Position.Left} id="left-out" style={handleStyle} isConnectable={false} />
<Handle type="source" position={Position.Right} id="right-out" style={handleStyle} isConnectable={false} />
<div className="flex items-center gap-1.5 font-mono"> <div className="flex items-center gap-1.5 font-mono">
{icon !== null && ( {icon !== null && (
<span <span
@@ -216,6 +216,8 @@ function computeLayout(input: LayoutInput): LayoutResult {
id: edgeKey(e), id: edgeKey(e),
source: e.from, source: e.from,
target: e.to, target: e.to,
sourceHandle: isFeedback ? (feedbackSide === "left" ? "left-out" : "right-out") : undefined,
targetHandle: isFeedback ? (feedbackSide === "left" ? "left-in" : "right-in") : undefined,
type: "condition", type: "condition",
data: { data: {
condition: e.condition, condition: e.condition,