From e09dfb1a2cbea39b8eaff8b78b0993a58f0a80bc Mon Sep 17 00:00:00 2001
From: dotta <dotta@example.com>
Date: Mon, 6 Apr 2026 20:34:15 -0500
Subject: [PATCH] Reorder action bar icons and add relative date formatting

Action bar for agent messages is now: [copy] [thumbs up] [thumbs down] [date] [three dots].
Date shows relative time (e.g. "2h ago") if < 1 week old, otherwise short date (e.g. "Apr 6").
Hovering the date shows full timestamp tooltip. Date links to the comment anchor.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
---
 ui/src/components/IssueChatThread.tsx | 30 ++++++++++++++++++++-------
 1 file changed, 23 insertions(+), 7 deletions(-)

diff --git a/ui/src/components/IssueChatThread.tsx b/ui/src/components/IssueChatThread.tsx
index bfb86e4b..38a6104b 100644
--- a/ui/src/components/IssueChatThread.tsx
+++ b/ui/src/components/IssueChatThread.tsx
@@ -177,6 +177,15 @@ function parseReassignment(target: string): PaperclipIssueRuntimeReassignment |
   return null;
 }
 
+const WEEK_MS = 7 * 24 * 60 * 60 * 1000;
+
+function commentDateLabel(date: Date | string | undefined): string {
+  if (!date) return "";
+  const then = new Date(date).getTime();
+  if (Date.now() - then < WEEK_MS) return timeAgo(date);
+  return formatShortDate(date);
+}
+
 function IssueChatTextPart({ text }: { text: string }) {
   return <MarkdownBody className="text-sm leading-6">{text}</MarkdownBody>;
 }
@@ -471,7 +480,7 @@ function IssueChatUserMessage() {
                   href={anchorId ? `#${anchorId}` : undefined}
                   className="text-[11px] text-muted-foreground hover:text-foreground hover:underline"
                 >
-                  {message.createdAt ? formatShortDate(message.createdAt) : ""}
+                  {message.createdAt ? commentDateLabel(message.createdAt) : ""}
                 </a>
               </TooltipTrigger>
               <TooltipContent side="bottom" className="text-xs">
@@ -595,12 +604,6 @@ function IssueChatAssistantMessage() {
           </div>
 
           <div className="mt-2 flex items-center gap-1">
-            <a
-              href={anchorId ? `#${anchorId}` : undefined}
-              className="mr-1 text-xs text-muted-foreground hover:text-foreground hover:underline"
-            >
-              {message.createdAt ? formatShortDate(message.createdAt) : ""}
-            </a>
             <ActionBarPrimitive.Copy
               copiedDuration={2000}
               className="group inline-flex h-7 w-7 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground data-[copied=true]:text-foreground"
@@ -618,6 +621,19 @@ function IssueChatAssistantMessage() {
                 onVote={handleVote}
               />
             ) : null}
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <a
+                  href={anchorId ? `#${anchorId}` : undefined}
+                  className="text-[11px] text-muted-foreground hover:text-foreground hover:underline"
+                >
+                  {message.createdAt ? commentDateLabel(message.createdAt) : ""}
+                </a>
+              </TooltipTrigger>
+              <TooltipContent side="bottom" className="text-xs">
+                {message.createdAt ? formatDateTime(message.createdAt) : ""}
+              </TooltipContent>
+            </Tooltip>
             <DropdownMenu>
               <DropdownMenuTrigger asChild>
                 <Button