1import { ClipboardIcon } from '@expo/styleguide';
2import { useState } from 'react';
3
4import { SnippetAction, SnippetActionProps } from '../SnippetAction';
5
6type CopyActionProps = SnippetActionProps & {
7  text: string;
8};
9
10export const CopyAction = ({ text, ...rest }: CopyActionProps) => {
11  const [copyDone, setCopyDone] = useState(false);
12  const onCopyClick = () => {
13    navigator.clipboard?.writeText(text);
14    setCopyDone(true);
15    setTimeout(() => setCopyDone(false), 1500);
16  };
17
18  return (
19    <SnippetAction icon={<ClipboardIcon />} onClick={onCopyClick} disabled={copyDone} {...rest}>
20      {copyDone ? 'Copied!' : 'Copy'}
21    </SnippetAction>
22  );
23};
24