From 322de540ec7a54fecca4d9a3513eaef6f0ed1227 Mon Sep 17 00:00:00 2001
From: iliya <iliyazelenkog@gmail.com>
Date: Sat, 28 Mar 2026 12:50:10 +0200
Subject: [PATCH] fix(graph): merge name+role into single line, increase kanban
 zone offset
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Name and role combined: "jack · developer" (was two separate lines)
- Removes overlap between role text and column headers
- Kanban zone offsetY 60→70 for extra clearance
- Removed unused drawSublabel function
---
 .../agent-graph/src/canvas/draw-agents.ts     | 29 ++++---------------
 .../src/constants/canvas-constants.ts         |  2 +-
 2 files changed, 7 insertions(+), 24 deletions(-)

diff --git a/packages/agent-graph/src/canvas/draw-agents.ts b/packages/agent-graph/src/canvas/draw-agents.ts
index 2d701336..8239532f 100644
--- a/packages/agent-graph/src/canvas/draw-agents.ts
+++ b/packages/agent-graph/src/canvas/draw-agents.ts
@@ -50,13 +50,9 @@ export function drawAgents(
     // Breathing animation + spawn/waiting effects
     drawBreathing(ctx, x, y, r, node.state, time, node.spawnStatus);
 
-    // Name label
-    drawLabel(ctx, x, y, r, node.label, color);
-
-    // Role subtitle
-    if (node.role) {
-      drawSublabel(ctx, x, y, r, node.role);
-    }
+    // Name + role label (single line: "jack · developer")
+    const labelText = node.role ? `${node.label} · ${node.role}` : node.label;
+    drawLabel(ctx, x, y, r, labelText, color);
 
     // Context ring for lead
     if (node.kind === 'lead' && node.contextUsage != null) {
@@ -279,25 +275,12 @@ function drawLabel(
   label: string,
   color: string,
 ): void {
-  ctx.font = `bold 10px monospace`;
+  const labelY = y + r + AGENT_DRAW.labelYOffset;
+  ctx.font = '9px monospace';
   ctx.textAlign = 'center';
   ctx.textBaseline = 'top';
   ctx.fillStyle = color;
-  ctx.fillText(label, x, y + r + AGENT_DRAW.labelYOffset);
-}
-
-function drawSublabel(
-  ctx: CanvasRenderingContext2D,
-  x: number,
-  y: number,
-  r: number,
-  sublabel: string,
-): void {
-  ctx.font = '7px sans-serif';
-  ctx.textAlign = 'center';
-  ctx.textBaseline = 'top';
-  ctx.fillStyle = COLORS.textDim;
-  ctx.fillText(sublabel, x, y + r + AGENT_DRAW.labelYOffset + 13);
+  ctx.fillText(label, x, labelY);
 }
 
 /**
diff --git a/packages/agent-graph/src/constants/canvas-constants.ts b/packages/agent-graph/src/constants/canvas-constants.ts
index 259ce4f8..0dc10cab 100644
--- a/packages/agent-graph/src/constants/canvas-constants.ts
+++ b/packages/agent-graph/src/constants/canvas-constants.ts
@@ -239,7 +239,7 @@ export const KANBAN_ZONE = {
   /** Row height: pill (36) + gap (10) */
   rowHeight: 46,
   /** Zone starts this far below member node center */
-  offsetY: 60,
+  offsetY: 70,
   /** Column order: todo → wip → done → review → approved */
   columns: ['todo', 'wip', 'done', 'review', 'approved'] as const,
   /** Max tasks shown per column (overflow hidden) */