Copy to clipboard

index.tsx

import { CopyToClipboard } from "react-copy-to-clipboard";
import { useEffect, useState } from "react";

const index = () => {
const [copiedStatus, setCopiedStatus] = useState(false);

  useEffect(() => {
    let timeout: number;

    if (copiedStatus) {
      timeout = window.setTimeout(() => {
        setCopiedStatus(false);
      }, 2000);
    }
    return () => {
      window.clearTimeout(timeout);
    };
  }, [copiedStatus]);

return (
<CopyToClipboard
          text={walletAddress}
          onCopy={() => {
            setCopiedStatus(true);
            toast.success("Address Copied");
          }}>
          <button className="flex w-full items-center justify-center gap-4 rounded-5xl bg-[linear-gradient(265.56deg,_#246CF9_-0.27%,_#1E68F6_-0.26%,_#063FD3_98.59%)] px-2 py-3 text-sm font-bold text-s-blue-2 sm:text-lg">
            <span className="rotate-90">
              <CopyIcon />
            </span>
            <span>{copiedStatus ? "Copied" : "Copy "}</span>
          </button>
        </CopyToClipboard>
)
}