[dyad] Added preview image and copy buttons - wrote 4 file(s)

src/components/copy-button.tsx

@@ -0,0 +1,41 @@
+"use client";
+
+import { useState } from "react";
+import { Button } from "@/components/ui/button";
+import { Check, Copy } from "lucide-react";
+import { toast } from "sonner";
+
+interface CopyButtonProps {
+  textToCopy: string;
+}
+
+export function CopyButton({ textToCopy }: CopyButtonProps) {
+  const [isCopied, setIsCopied] = useState(false);
+
+  const handleCopy = () => {
+    if (!textToCopy || textToCopy === "Not found") return;
+    navigator.clipboard.writeText(textToCopy).then(() => {
+      setIsCopied(true);
+      toast.success("Copied to clipboard!");
+      setTimeout(() => {
+        setIsCopied(false);
+      }, 2000);
+    });
+  };
+
+  return (
+    <Button
+      variant="ghost"
+      size="icon"
+      onClick={handleCopy}
+      className="h-8 w-8"
+    >
+      {isCopied ? (
+        <Check className="h-4 w-4 text-green-500" />
+      ) : (
+        <Copy className="h-4 w-4" />
+      )}
+      <span className="sr-only">Copy</span>
+    </Button>
+  );
+}