fix: prevent copy code and copy message buttons from overlapping

[Imane-Idrissi]

Problem

The copy button on a code block and the copy button on the surrounding message sit in overlapping hit areas. Clicking the code block's copy button can land on the message-level copy button, copying the entire message instead of just the code.

Closes #2155

Changes

• Moved the message-level copy button from an absolute top-right overlay into the document flow below the content, so it no longer overlaps with the per-code-block copy button
• Made both copy buttons always visible for better discoverability

How did you test this?

• Tested messages with text only, code block only, and text + code block combinations
• Verified both copy buttons work independently and copy the correct content
• Confirmed no visual overlap in any scenario

Publish to changelog?

no

[greptile-apps]

Comments Outside Diff (1)

1. apps/code/src/renderer/features/sessions/components/session-update/AgentMessage.tsx, line 161-166 (link)

   The IconButton for copying the message has no aria-label. The CodeBlock copy button has aria-label="Copy code", but this button relies solely on the Tooltip for labelling, which isn't surfaced to screen readers as an accessible name on the button itself. Now that the button is always visible (not just on hover), the gap is more noticeable.

   Prompt To Fix With AI

   This is a comment left during a code review.
   Path: apps/code/src/renderer/features/sessions/components/session-update/AgentMessage.tsx
   Line: 161-166
   
   Comment:
   The `IconButton` for copying the message has no `aria-label`. The `CodeBlock` copy button has `aria-label="Copy code"`, but this button relies solely on the `Tooltip` for labelling, which isn't surfaced to screen readers as an accessible name on the button itself. Now that the button is always visible (not just on hover), the gap is more noticeable.
   
   
   
   How can I resolve this? If you propose a fix, please make it concise.

Prompt To Fix All With AI

Fix the following 1 code review issue. Work through them one at a time, proposing concise fixes.

---

### Issue 1 of 1
apps/code/src/renderer/features/sessions/components/session-update/AgentMessage.tsx:161-166
The `IconButton` for copying the message has no `aria-label`. The `CodeBlock` copy button has `aria-label="Copy code"`, but this button relies solely on the `Tooltip` for labelling, which isn't surfaced to screen readers as an accessible name on the button itself. Now that the button is always visible (not just on hover), the gap is more noticeable.

```suggestion
          <IconButton
            size="1"
            variant="ghost"
            color={copied ? "green" : "gray"}
            onClick={handleCopy}
            aria-label={copied ? "Copied!" : "Copy message"}
          >
```

_{Reviews (1): Last reviewed commit: "fix: prevent copy code and copy message ..." | Re-trigger Greptile}