From 993a3262f6aa3a051aed39d524d004cc5e053944 Mon Sep 17 00:00:00 2001
From: dotta <dotta@example.com>
Date: Fri, 3 Apr 2026 07:43:23 -0500
Subject: [PATCH] fix(ui): place run link in same row as feedback buttons,
 right-aligned

When a comment has both helpful/needswork feedback buttons and a run link,
the run link now appears right-aligned in the same row instead of a separate
section below. Comments with only a run link (no feedback buttons) still
show the run link in its own bordered row.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
---
 ui/src/components/CommentThread.tsx         | 18 ++++++++++++++++--
 ui/src/components/OutputFeedbackButtons.tsx |  3 +++
 2 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/ui/src/components/CommentThread.tsx b/ui/src/components/CommentThread.tsx
index 88b01fcd..b0b5c618 100644
--- a/ui/src/components/CommentThread.tsx
+++ b/ui/src/components/CommentThread.tsx
@@ -336,10 +336,24 @@ function CommentCard({
           sharingPreference={feedbackDataSharingPreference}
           termsUrl={feedbackTermsUrl}
           onVote={onVote}
+          rightSlot={comment.runId && !isPending ? (
+            comment.runAgentId ? (
+              <Link
+                to={`/agents/${comment.runAgentId}/runs/${comment.runId}`}
+                className="inline-flex items-center rounded-md border border-border bg-accent/30 px-2 py-1 text-[10px] font-mono text-muted-foreground hover:text-foreground hover:bg-accent/50 transition-colors"
+              >
+                run {comment.runId.slice(0, 8)}
+              </Link>
+            ) : (
+              <span className="inline-flex items-center rounded-md border border-border bg-accent/30 px-2 py-1 text-[10px] font-mono text-muted-foreground">
+                run {comment.runId.slice(0, 8)}
+              </span>
+            )
+          ) : undefined}
         />
       ) : null}
-      {comment.runId && !isPending ? (
-        <div className="mt-2 pt-2 border-t border-border/60">
+      {comment.runId && !isPending && !(comment.authorAgentId && onVote && !isQueued) ? (
+        <div className="mt-3 pt-3 border-t border-border/60">
           {comment.runAgentId ? (
             <Link
               to={`/agents/${comment.runAgentId}/runs/${comment.runId}`}
diff --git a/ui/src/components/OutputFeedbackButtons.tsx b/ui/src/components/OutputFeedbackButtons.tsx
index bafa9bcc..efcf62eb 100644
--- a/ui/src/components/OutputFeedbackButtons.tsx
+++ b/ui/src/components/OutputFeedbackButtons.tsx
@@ -19,12 +19,14 @@ export function OutputFeedbackButtons({
   sharingPreference = "prompt",
   termsUrl = null,
   onVote,
+  rightSlot,
 }: {
   activeVote?: FeedbackVoteValue | null;
   disabled?: boolean;
   sharingPreference?: FeedbackDataSharingPreference;
   termsUrl?: string | null;
   onVote: (vote: FeedbackVoteValue, options?: { allowSharing?: boolean; reason?: string }) => Promise<void>;
+  rightSlot?: React.ReactNode;
 }) {
   const [pendingVote, setPendingVote] = useState<{
     vote: FeedbackVoteValue;
@@ -130,6 +132,7 @@ export function OutputFeedbackButtons({
           <ThumbsDown className="mr-1.5 h-3.5 w-3.5" />
           Needs work
         </Button>
+        {rightSlot ? <div className="ml-auto">{rightSlot}</div> : null}
       </div>
       {collectingDownvoteReason ? (
         <div className="mt-2 rounded-md border border-border/60 bg-accent/20 p-3">