feat: add copy buttons and improve mobile Enter behavior#647
Open
croll83 wants to merge 3 commits intoThe-Vibe-Company:mainfrom
Open
feat: add copy buttons and improve mobile Enter behavior#647croll83 wants to merge 3 commits intoThe-Vibe-Company:mainfrom
croll83 wants to merge 3 commits intoThe-Vibe-Company:mainfrom
Conversation
- Add CopyButton component with clipboard icon and success feedback - Show copy button on hover for entire AI messages (top-right) - Show copy button in code block headers for copying code only - Code blocks now always display header with language and copy button
- Add mobile device detection via user agent - On mobile: Enter creates newline, send only via button - On desktop: unchanged behavior (Enter sends, Shift+Enter newline) - Fixes mobile keyboard limitations where Shift+Enter unavailable
|
@croll83 is attempting to deploy a commit to the The Vibe Company Team on Vercel. A member of the Team first needs to authorize it. |
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
There was a problem hiding this comment.
1 issue found across 3 files
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="web/src/components/CopyButton.tsx">
<violation number="1" location="web/src/components/CopyButton.tsx:24">
P2: Fallback copy marks success without checking whether `document.execCommand('copy')` actually succeeded, so the UI can show a success checkmark even when nothing was copied.</violation>
</file>
Reply with feedback, questions, or to request a fix. Tag @cubic-dev-ai to re-run a review.
document.execCommand('copy') returns false when the copy fails, but the
fallback path was ignoring the return value and always calling setCopied(true),
causing a false success checkmark to be shown even when nothing was copied.
Fix: capture the return value and return early if the copy did not succeed.
Author
|
hey @StanGirard tagging here to bring a bit of visibility on this PR... it's a very simple small change, but improve usability on mobile by 100x. Please would love to have it live (if i run my fork i can't live update the new versions) |
croll83
added a commit
to croll83/companion
that referenced
this pull request
Apr 28, 2026
Two fixes for PR The-Vibe-Company#647 that didn't fully land: 1. Code-block copy button was invisible on mobile because it relied on hover state (opacity-70 hover:opacity-100) and also used `text-gray-500 hover:bg-gray-100` which had poor contrast on the code-block background. Switch to theme-aware colors (text-cc-muted, hover:bg-cc-fg/[0.06]) and force opacity-100 on mobile, fading to 0.7 only on >=sm breakpoints. 2. Add a message-level copy button under each completed assistant turn. PR The-Vibe-Company#647's description claimed this was implemented but only the code- block button shipped. The new MessageActions row is always visible on mobile (60% opacity → 100% on hover at desktop) and copies the concatenated text from the message's text blocks. Also unrelated test fixes from PR The-Vibe-Company#651: existing dropdown tests used /Opus/ which now matches both Opus 4.7 and Opus 4.6, and the default-model assertion in HomePage was still claude-opus-4-6 instead of the new -4-7. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Features
1. Copy Buttons
document.execCommandfor older browsers2. Mobile Enter Behavior
Screenshots
Copy Buttons in Action
Shows copy buttons appearing on code block headers (BASH) and message hover:
Mobile Enter Behavior
Shows newlines being created in the textarea via Enter key on mobile:
Technical Implementation
web/src/components/CopyButton.tsx) — reusable with clipboard/success statesTesting
Commits
Two clean commits from fresh upstream main:
Code reviewed by: AI (Claude Code) + human testing
Visual testing: Complete on both desktop and mobile simulation