import { CheckIcon, CopyIcon } from 'lucide-react';
import React, { useState } from 'react';

interface CopyTextProps {
  text: string;
}

const CopyText: React.FC<CopyTextProps> = ({ text }) => {
  const [copied, setCopied] = useState(false);

  const handleCopy = () => {
    navigator.clipboard.writeText(text).then(() => {
      setCopied(true);
      setTimeout(() => setCopied(false), 2000);
    });
  };

  return (
    <div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
      <button
        onClick={handleCopy}
      >
        {copied ? <CheckIcon className='h-4 w-4'/> :  <CopyIcon className='h-4 w-4'/>}
        </button>
    </div>
  );
};

export default CopyText;