From 57f88f6f6aa24591cbdcce9939bc031bf600d2fc Mon Sep 17 00:00:00 2001
From: Forgotten <forgottenrunes@protonmail.com>
Date: Sat, 21 Feb 2026 08:19:38 -0600
Subject: [PATCH] feat: make comment identity headers clickable links to agent
 pages

Wraps the Identity component in comment headers with a Link to
/agents/{agentId} so users can click through to view agent details.
Applied to both CommentThread and ApprovalDetail comment sections.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 ui/src/components/CommentThread.tsx | 18 ++++++++++--------
 ui/src/pages/ApprovalDetail.tsx     | 18 ++++++++++--------
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/ui/src/components/CommentThread.tsx b/ui/src/components/CommentThread.tsx
index 4c5f3900..fe463b7d 100644
--- a/ui/src/components/CommentThread.tsx
+++ b/ui/src/components/CommentThread.tsx
@@ -70,14 +70,16 @@ export function CommentThread({ comments, onAdd, issueStatus, agentMap }: Commen
         {sorted.map((comment) => (
           <div key={comment.id} className="border border-border p-3">
             <div className="flex items-center justify-between mb-1">
-              <Identity
-                name={
-                  comment.authorAgentId
-                    ? agentMap?.get(comment.authorAgentId)?.name ?? comment.authorAgentId.slice(0, 8)
-                    : "You"
-                }
-                size="sm"
-              />
+              {comment.authorAgentId ? (
+                <Link to={`/agents/${comment.authorAgentId}`} className="hover:underline">
+                  <Identity
+                    name={agentMap?.get(comment.authorAgentId)?.name ?? comment.authorAgentId.slice(0, 8)}
+                    size="sm"
+                  />
+                </Link>
+              ) : (
+                <Identity name="You" size="sm" />
+              )}
               <span className="text-xs text-muted-foreground">
                 {formatDateTime(comment.createdAt)}
               </span>
diff --git a/ui/src/pages/ApprovalDetail.tsx b/ui/src/pages/ApprovalDetail.tsx
index c6149429..b9304add 100644
--- a/ui/src/pages/ApprovalDetail.tsx
+++ b/ui/src/pages/ApprovalDetail.tsx
@@ -315,14 +315,16 @@ export function ApprovalDetail() {
           {(comments ?? []).map((comment: ApprovalComment) => (
             <div key={comment.id} className="border border-border/60 rounded-md p-3">
               <div className="flex items-center justify-between mb-1">
-                <Identity
-                  name={
-                    comment.authorAgentId
-                      ? agentNameById.get(comment.authorAgentId) ?? comment.authorAgentId.slice(0, 8)
-                      : "Board"
-                  }
-                  size="sm"
-                />
+                {comment.authorAgentId ? (
+                  <Link to={`/agents/${comment.authorAgentId}`} className="hover:underline">
+                    <Identity
+                      name={agentNameById.get(comment.authorAgentId) ?? comment.authorAgentId.slice(0, 8)}
+                      size="sm"
+                    />
+                  </Link>
+                ) : (
+                  <Identity name="Board" size="sm" />
+                )}
                 <span className="text-xs text-muted-foreground">
                   {new Date(comment.createdAt).toLocaleString()}
                 </span>