From ce482fc0fcefaef54cb6cd39d30bb6f220654442 Mon Sep 17 00:00:00 2001
From: core-devops <ceo-assistant@moleculesai.app>
Date: Mon, 8 Jun 2026 08:57:56 -0700
Subject: [PATCH] fix(canvas/concierge): truncate agent role to one line, full
 text on hover
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The concierge agent tree rendered each agent's `role` with no truncation, so a
long descriptor (e.g. "Coding Executor (Kimi) — implements specs only; NO review
/ RCA / decisions / delegation") wrapped into a tall multi-line block, making the
tree hard to scan.

Render the role compact: `.wsRole` now clamps to a single line with ellipsis
(and `.wsStatus` no longer gets squeezed), and the row sets `title={roleLabel}`
so the full text is available on hover via the native tooltip.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 canvas/src/components/concierge/Concierge.module.css | 6 +++---
 canvas/src/components/concierge/ConciergeShell.tsx   | 6 +++++-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/canvas/src/components/concierge/Concierge.module.css b/canvas/src/components/concierge/Concierge.module.css
index 3bb343f62..59c377541 100644
--- a/canvas/src/components/concierge/Concierge.module.css
+++ b/canvas/src/components/concierge/Concierge.module.css
@@ -134,9 +134,9 @@
 .ws.active .wsAv .dot { border-color: var(--card); }
 .wsMeta { min-width: 0; flex: 1; }
 .wsName { font-weight: 600; font-size: 13.5px; letter-spacing: -.01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.wsSub { display: flex; align-items: center; gap: 6px; margin-top: 1px; }
-.wsRole { font-family: var(--mono); font-size: 10.5px; color: var(--tx-3); }
-.wsStatus { font-size: 10.5px; font-weight: 500; display: flex; align-items: center; gap: 4px; }
+.wsSub { display: flex; align-items: center; gap: 6px; margin-top: 1px; min-width: 0; }
+.wsRole { font-family: var(--mono); font-size: 10.5px; color: var(--tx-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; flex: 0 1 auto; }
+.wsStatus { font-size: 10.5px; font-weight: 500; display: flex; align-items: center; gap: 4px; flex: 0 0 auto; }
 .wsStatus .sdot { width: 6px; height: 6px; border-radius: 50%; }
 .rootTag { margin-left: auto; font-family: var(--mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent-2); background: var(--accent-soft); padding: 3px 6px; border-radius: 6px; border: 1px solid rgba(139,92,246,.28); }
 .wsQ { margin-left: auto; flex: 0 0 auto; font-family: var(--mono); font-size: 10px; font-weight: 700; color: var(--tx-2); background: var(--hair); border: 1px solid var(--hair-2); padding: 2px 7px; border-radius: 20px; display: inline-flex; align-items: center; gap: 4px; }
diff --git a/canvas/src/components/concierge/ConciergeShell.tsx b/canvas/src/components/concierge/ConciergeShell.tsx
index f6ccd6112..f99df373c 100644
--- a/canvas/src/components/concierge/ConciergeShell.tsx
+++ b/canvas/src/components/concierge/ConciergeShell.tsx
@@ -227,6 +227,10 @@ export function ConciergeShell() {
     const isRoot = depth === 0;
     const isPlatform = n.id === platformRoot?.id;
     const q = (n.data.activeTasks as number) ?? 0;
+    // Role can be a long descriptor (e.g. "Coding Executor (Kimi) — …"); render
+    // it compact (single-line, truncated by .wsRole) and surface the full text
+    // on hover via the native tooltip.
+    const roleLabel = isPlatform ? "platform" : n.data.role || "agent";
     const row = (
       <div
         role="button"
@@ -251,7 +255,7 @@ export function ConciergeShell() {
         <div className={s.wsMeta}>
           <div className={s.wsName}>{n.data.name}</div>
           <div className={s.wsSub}>
-            <span className={s.wsRole}>{isPlatform ? "platform" : n.data.role || "agent"}</span>
+            <span className={s.wsRole} title={roleLabel}>{roleLabel}</span>
             <span className={s.wsStatus} style={{ color: st.color }}>
               <span className={s.sdot} style={{ background: st.color }} />
               {st.label}
-- 
2.52.0