Adding a button for copying error messages (#1882)

close #1870 





<!-- This is an auto-generated description by cubic. -->
---
## Summary by cubic
Adds a “Copy” button to error banners and chat error output so users can
quickly copy error messages with clear feedback. Addresses Linear #1870.

- **New Features**
- Introduced CopyErrorMessage component that writes to clipboard and
shows “Copied” for 2s.
- Added the copy button to the Preview error banner and DyadOutput;
actions grouped at the bottom beside “Fix with AI”.
- Added Playwright e2e test and helpers to verify copy behavior and
clipboard content.

<sup>Written for commit 12e9bf1437ded36dc022e1d795025580d2ffd111.
Summary will update automatically on new commits.</sup>

<!-- End of auto-generated description by cubic. -->
This commit is contained in:
Mohamed Aziz Mejri
2025-12-09 03:54:59 +01:00
committed by GitHub
parent 4b17870049
commit c174778d5f
6 changed files with 111 additions and 25 deletions

View File

@@ -25,6 +25,7 @@ import {
Smartphone,
} from "lucide-react";
import { selectedChatIdAtom } from "@/atoms/chatAtoms";
import { CopyErrorMessage } from "@/components/CopyErrorMessage";
import { IpcClient } from "@/ipc/ipc_client";
import { useParseRouter } from "@/hooks/useParseRouter";
@@ -136,13 +137,14 @@ const ErrorBanner = ({ error, onDismiss, onAIFix }: ErrorBannerProps) => {
</div>
</div>
{/* AI Fix button at the bottom */}
{/* Action buttons at the bottom */}
{!isDockerError && error.source === "preview-app" && (
<div className="mt-2 flex justify-end">
<div className="mt-3 px-6 flex justify-end gap-2">
<CopyErrorMessage errorMessage={error.message} />
<button
disabled={isStreaming}
onClick={onAIFix}
className="cursor-pointer flex items-center space-x-1 px-2 py-0.5 bg-red-500 dark:bg-red-600 text-white rounded text-sm hover:bg-red-600 dark:hover:bg-red-700 disabled:opacity-50 disabled:cursor-not-allowed"
className="cursor-pointer flex items-center space-x-1 px-2 py-1 bg-red-500 dark:bg-red-600 text-white rounded text-sm hover:bg-red-600 dark:hover:bg-red-700 disabled:opacity-50 disabled:cursor-not-allowed"
>
<Sparkles size={14} />
<span>Fix error with AI</span>