openreplay/frontend/app/components/shared/CopyText/CopyText.tsx
Shekar Siri a35311f4dc
Various UI improvements (#2337)
* Various UI improvements

* Title updates

* No results icon update

* UI Improvements in DevTools

---------

Co-authored-by: Sudheer Salavadi <connect.uxmaster@gmail.com>
2024-07-03 10:19:13 +02:00

26 lines
682 B
TypeScript

import React, { useState } from 'react';
import { Tooltip } from 'antd';
import copy from 'copy-to-clipboard';
interface Props {
label?: string;
afterLabel?: string;
children: any;
content: string;
}
function CopyText(props: Props) {
const { children, label = 'Click to copy', afterLabel = 'Copied', content = '' } = props;
const [isCopied, setIsCopied] = useState(false);
const onClick = () => {
copy(content);
setIsCopied(true);
setTimeout(() => setIsCopied(false), 5000);
};
return (
<Tooltip title={isCopied ? afterLabel : label} placement='top'>
<span onClick={onClick}>{children}</span>
</Tooltip>
);
}
export default CopyText;