File size: 1,202 Bytes
f59fbe2 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 | import { useState } from "react";
import { IconCopy, IconCheck } from "@tabler/icons-react";
import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";
interface CopyButtonProps {
content: string;
className?: string;
}
export function CopyButton({ content, className }: CopyButtonProps) {
const [isCopied, setIsCopied] = useState(false);
const handleCopy = async () => {
if (!content) return;
try {
await navigator.clipboard.writeText(content);
setIsCopied(true);
setTimeout(() => setIsCopied(false), 2000);
} catch (err) {
console.error("Failed to copy:", err);
}
};
if (!content) return null;
return (
<Button
variant="ghost"
size="icon-xs"
className={cn(
"h-5 w-5 text-muted-foreground hover:text-foreground transition-all border-0! hover:bg-zinc-200 dark:hover:bg-zinc-800 cursor-pointer",
isCopied && "text-emerald-500 hover:text-emerald-600",
className,
)}
onClick={() => {
void handleCopy();
}}
title="Copy message"
>
{isCopied ? <IconCheck className="size-3.5" /> : <IconCopy className="size-3.5" />}
</Button>
);
}
|