Add copy button to copy the full assistant message in Studio Code

[sejas]

Related issues

• Related to STU-1838

How AI was used in this PR

Proposed Changes

• Assistant responses in the Studio Code chat can now be copied in full with one click, in both the classic desktop UI and the new agentic UI. Previously only fenced code blocks offered a copy button, so grabbing a whole answer meant manual text selection.
• The button appears on hover (or keyboard focus) below each assistant message and copies the original markdown source. When a response is split by tool calls into several text segments, the copy still yields the complete message, not just the last fragment.
• Copying announces "Copied" to screen readers and gives visual check-icon feedback. The code-block and message copy buttons now share one component, which also fixes a subtle timer bug where clicking copy twice in quick succession cut the "Copied" state short.

Testing Instructions

1. Start a Studio Code session and ask something that produces a response with tool calls between paragraphs (e.g. "list my plugins, then summarize").
2. Hover an assistant message → a copy icon appears bottom-left, aligned with the text edge; click it and paste somewhere: the full message should paste, including text from before the tool call.
3. Ask for a response containing a code block → the existing code-block copy button still works.
4. Repeat in the agentic UI. Verify both light and dark mode.

copy-message.mp4

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors?

[wpmobilebot]

📊 Performance Test Results

Comparing e0be115 vs trunk

app-size

Metric	trunk	e0be115	Diff	Change
App Size (Mac)	1419.28 MB	1419.29 MB	+0.00 MB	⚪ 0.0%

site-editor

Metric	trunk	e0be115	Diff	Change
load	1072 ms	1093 ms	+21 ms	⚪ 0.0%

site-startup

Metric	trunk	e0be115	Diff	Change
siteCreation	7011 ms	7003 ms	8 ms	⚪ 0.0%
siteStartup	2363 ms	2369 ms	+6 ms	⚪ 0.0%

---

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change (<50ms diff)

[katinthehatsite]

I am not sure this comment is needed, but it can be kept if you find it useful

[katinthehatsite]

I think we can avoid using as unknown as in tests by doing something like:

index.test.tsx
index faace818e..01674c1ed 100644
--- a/apps/studio/src/components/studio-code-session/conversation/index.test.tsx
+++ b/apps/studio/src/components/studio-code-session/conversation/index.test.tsx
@@ -25,15 +25,17 @@ vi.mock( '@wordpress/ui', () => ( {
        Icon: () => null,
 } ) );
 
-function customEntry( customType: string, data: unknown ): SessionEntry {
+function mockEntry( partial: Record< string, unknown > ): SessionEntry {
        return {
-               type: 'custom',
                id: Math.random().toString( 36 ).slice( 2 ),
                parentId: null,
                timestamp: '2026-06-19T00:00:00.000Z',
-               customType,
-               data,
-       } as unknown as SessionEntry;
+               ...partial,
+       } as SessionEntry;
+}
+
+function customEntry( customType: string, data: unknown ): SessionEntry {
+       return mockEntry( { type: 'custom', customType, data } );
 }
 
 function question( q: string, options: string[] ): SessionEntry {
@@ -48,11 +50,9 @@ function answer( text: string ): SessionEntry {
 }
 
 function assistantToolCallEntry( name: string ): SessionEntry {
-       return {
+       return mockEntry( {
                type: 'message',
                id: `assistant-${ name }`,
-               parentId: null,
-               timestamp: '2026-06-19T00:00:00.000Z',
                message: {
                        role: 'assistant',
                        content: [
@@ -64,21 +64,20 @@ function assistantToolCallEntry( name: string ): SessionEntry {
                                },
                        ],
                },
-       } as unknown as SessionEntry;
+       } );
 }
 
 function toolResultEntry( text: string ): SessionEntry {
-       return {
+       return mockEntry( {
                type: 'message',
                id: 'tool-result',
-               parentId: null,
                timestamp: '2026-06-19T00:00:01.000Z',
                message: {
                        role: 'toolResult',
                        toolCallId: 'tool-call-1',
                        content: [ { type: 'text', text } ],
                },
-       } as unknown as SessionEntry;
+       } );
 }
 
 describe( 'entriesToRenderItems – persisted picked answers', () => {
@@ -279,24 +278,20 @@ describe( 'Conversation – assistant message copy button', () => {
        } );
 
        function assistantTextEntry( text: string ): SessionEntry {
-               return {
+               return mockEntry( {
                        type: 'message',
                        id: `assistant-text-${ text }`,
-                       parentId: null,
-                       timestamp: '2026-06-19T00:00:00.000Z',
                        message: {
                                role: 'assistant',
                                content: [ { type: 'text', text } ],
                        },
-               } as unknown as SessionEntry;
+               } );
        }
 
        function assistantMultiBlockEntry(): SessionEntry {
-               return {
+               return mockEntry( {
                        type: 'message',
                        id: 'assistant-multi-block',
-                       parentId: null,
-                       timestamp: '2026-06-19T00:00:00.000Z',
                        message: {
                                role: 'assistant',

[katinthehatsite]

In terms of the functionality, I think it works well. I left some comments regarding code improvements