diff options
Diffstat (limited to 'src/components/copy-button.tsx')
| -rw-r--r-- | src/components/copy-button.tsx | 34 |
1 files changed, 34 insertions, 0 deletions
diff --git a/src/components/copy-button.tsx b/src/components/copy-button.tsx new file mode 100644 index 0000000..4220353 --- /dev/null +++ b/src/components/copy-button.tsx @@ -0,0 +1,34 @@ +'use client' +import { Button } from '@/components/ui/button' +import { Check, Copy } from 'lucide-react' +import { useEffect, useState } from 'react' + +type Props = { text: string } + +export function CopyButton({ text }: Props) { + const [copied, setCopied] = useState(false) + + useEffect(() => { + if (copied) { + let timeout = setTimeout(() => setCopied(false), 1000) + return () => { + setCopied(false) + clearTimeout(timeout) + } + } + }, [copied]) + + return ( + <Button + size="icon" + variant="secondary" + type="button" + onClick={() => { + navigator.clipboard.writeText(text) + setCopied(true) + }} + > + {copied ? <Check className="w-4 h-4" /> : <Copy className="w-4 h-4" />} + </Button> + ) +} |
