You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
42 lines
987 B
42 lines
987 B
/**
|
|
* Contain a button with a content that can be copied
|
|
*/
|
|
import React, { useState } from 'react';
|
|
import { faCheck, faCopy } from '@fortawesome/free-solid-svg-icons';
|
|
import { Button } from 'reactstrap';
|
|
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
|
|
|
|
interface ButtonCopyInterface {
|
|
text: string;
|
|
content: any;
|
|
}
|
|
|
|
const ButtonCopy = ({ text, content }: ButtonCopyInterface) => {
|
|
const [check, setCheck] = useState(false);
|
|
|
|
const handleCopy = () => {
|
|
navigator.clipboard.writeText(content);
|
|
setCheck(true);
|
|
|
|
setTimeout(() => {
|
|
setCheck(false);
|
|
}, 3000);
|
|
};
|
|
|
|
const icon = check ? faCheck : faCopy;
|
|
|
|
return (
|
|
<Button
|
|
className="bg-white text-black my-2 shadow-lg border-dark border py-3 px-4 border-3 justify-content-between gx-2 align-items-end"
|
|
onClick={handleCopy}
|
|
>
|
|
<div>{text}</div>
|
|
<div>
|
|
<FontAwesomeIcon icon={icon} />
|
|
</div>
|
|
</Button>
|
|
);
|
|
};
|
|
|
|
export default ButtonCopy;
|