Skip to content

Commit 49319ca

Browse files
cristipufuclaude
cristipufu
and
claude
committed
fix: correct ELK node height estimates to prevent edge overlap
ModelNode and ToolNode always render a type label above the main label (~13px) that was unaccounted for in computeNodeHeight, causing ELK to place edge endpoints inside the visible node boundaries. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
1 parent c652501 commit 49319ca

3 files changed

Lines changed: 33 additions & 25 deletions

File tree

‎src/uipath/dev/server/frontend/src/components/graph/GraphPanel.tsx‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -38,16 +38,24 @@ const edgeTypes = { elk: ElkEdge };
3838

3939
// ─── Node size helpers ───────────────────────────────────────────────
4040
const MIN_NODE_WIDTH = 80;
41-
const BASE_NODE_HEIGHT = 36;
41+
const BASE_NODE_HEIGHT = 32; // 2(border) + 6(py) + 16(text-xs) + 6(py) + 2(border)
42+
const TYPE_LABEL_HEIGHT = 13; // fontSize 9 (~11px line) + marginBottom 1
4243

4344
function computeNodeWidth(data: Record<string, unknown>): number {
4445
const label = (data?.label as string) ?? "";
4546
// No hard cap — let ELK handle spacing; nodes must fit their labels
4647
return Math.max(MIN_NODE_WIDTH, label.length * 8 + 32);
4748
}
4849

49-
function computeNodeHeight(data: Record<string, unknown>): number {
50+
function computeNodeHeight(
51+
data: Record<string, unknown>,
52+
type?: string,
53+
): number {
5054
let h = BASE_NODE_HEIGHT;
55+
// ModelNode and ToolNode always render a type label above the main label
56+
if (type === "modelNode" || type === "toolNode") {
57+
h += TYPE_LABEL_HEIGHT;
58+
}
5159
const toolNames = data?.tool_names as string[] | undefined;
5260
if (toolNames && toolNames.length > 0) {
5361
h +=
@@ -90,7 +98,7 @@ function buildElkGraph(graphData: GraphData): ElkNode {
9098
const elkNode: ElkNode = {
9199
id: node.id,
92100
width: computeNodeWidth(data),
93-
height: computeNodeHeight(data),
101+
height: computeNodeHeight(data, node.type),
94102
};
95103

96104
// Compound node with subgraph children
@@ -106,7 +114,7 @@ function buildElkGraph(graphData: GraphData): ElkNode {
106114
elkNode.children = sub.nodes.map((cn) => ({
107115
id: `${node.id}/${cn.id}`,
108116
width: computeNodeWidth(cn.data as Record<string, unknown>),
109-
height: computeNodeHeight(cn.data as Record<string, unknown>),
117+
height: computeNodeHeight(cn.data as Record<string, unknown>, cn.type),
110118
}));
111119
elkNode.edges = sub.edges.map((e) => ({
112120
id: `${node.id}/${e.id}`,

0 commit comments

Comments
 (0)