svrjs-nextjs-website/components/shared/copyButton.tsx

29 lines
752 B
TypeScript

"use client";
import { useState } from "react";
import { Button } from "../ui/button";
import { Check, Copy } from "lucide-react";
export default function CopyButton({ code }: { code: string }) {
const [copied, setCopied] = useState(false);
const copyCode = async () => {
try {
await navigator.clipboard.writeText(code);
setCopied(true);
setTimeout(() => setCopied(false), 2000);
} catch (error) {
console.error("Failed to copy!", error);
}
};
return (
<Button
onClick={copyCode}
className="absolute top-2 right-2 bg-accent hover:bg-muted text-white p-2 rounded"
size={"icon"}
>
{copied ? <Check className="w-5 h-5" /> : <Copy className="w-5 h-5" />}
</Button>
);
}