feat(ui): Add copy button for code blocks in mothership#4033
feat(ui): Add copy button for code blocks in mothership#4033TheodoreSpeaks merged 5 commits intostagingfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
|
@BugBot review |
PR SummaryLow Risk Overview Updates both chat markdown renderers ( Reviewed by Cursor Bugbot for commit 6ed3bcc. Bugbot is set up for automated code reviews on this repo. Configure here. |
There was a problem hiding this comment.
Cursor Bugbot has reviewed your changes and found 2 potential issues.
❌ Bugbot Autofix is OFF. To automatically fix reported issues with cloud agents, enable autofix in the Cursor dashboard.
Reviewed by Cursor Bugbot for commit e079c82. Configure here.
Greptile SummaryThis PR adds a reusable Key findings:
Confidence Score: 4/5Safe to merge after fixing the unhandled clipboard Promise, which causes a misleading success indicator on write failure. One P1 issue: the clipboard write is not awaited, so the copy-success UI fires regardless of whether the write actually succeeded. This is a real, reproducible behaviour defect on the primary user path of the feature. The remaining findings are P2 quality/style items that do not block correctness. apps/sim/components/ui/copy-code-button.tsx — fix async clipboard handling before merging.
|
| Filename | Overview |
|---|---|
| apps/sim/components/ui/copy-code-button.tsx | New shared copy-button component; clipboard write is not awaited causing the success indicator to fire even on failure, and the setTimeout is not cleaned up on unmount. |
| apps/sim/app/chat/components/message/components/markdown-renderer.tsx | Adds CopyCodeButton to chat code blocks and introduces extractTextContent helper, which is now duplicated with the identical function in chat-content.tsx. |
| apps/sim/app/workspace/[workspaceId]/home/components/message-content/components/chat-content/chat-content.tsx | Adds CopyCodeButton to workspace chat code blocks; hover background token matches container background, making hover feedback invisible. |
Sequence Diagram
sequenceDiagram
participant User
participant CopyCodeButton
participant Clipboard as navigator.clipboard
participant Timer as setTimeout
User->>CopyCodeButton: click
CopyCodeButton->>Clipboard: writeText(code) [Promise, not awaited]
CopyCodeButton->>CopyCodeButton: setCopied(true) [fires immediately, regardless of result]
CopyCodeButton->>Timer: setTimeout(setCopied(false), 2000)
Note over Clipboard: Write may succeed or fail silently
Timer-->>CopyCodeButton: setCopied(false) after 2s
Note over CopyCodeButton: If component unmounts before 2s,<br/>timer fires on unmounted component
Reviews (1): Last reviewed commit: "Handle react node case for copy" | Re-trigger Greptile
- Await clipboard write and clear timeout on unmount in CopyCodeButton - Fix hover bg color matching container bg (surface-4 -> surface-5) - Extract extractTextContent to shared util at lib/core/utils/react-node-text.ts Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Summary
Add copy button for any code blocks in mothership. Makes it easier to copy code blocks.
Type of Change
Testing
Tested locally with different code block types.
Checklist
Screenshots/Videos