use-copy-to-clipboard

typescript
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
import { useCallback, useState } from 'react';

interface Props {
  timeout?: number;
}

export default function useCopyToClipboard(props: Props = { timeout: 2000 }) {
  const [isCopied, setIsCopied] = useState<boolean>(false);

  const copyToClipboard = useCallback(
    (value: string) => {
      if (typeof window === 'undefined' || !navigator.clipboard?.writeText) {
        return;
      }

      if (!value) {
        return;
      }

      navigator.clipboard.writeText(value).then(() => {
        setIsCopied(true);

        setTimeout(() => {
          setIsCopied(false);
        }, props.timeout);
      });
    },
    [props.timeout],
  );

  return { isCopied, copyToClipboard };
}