git.iko.soy/bridge
on f3545aa help sign in
bridge/src/views/Activate/MasterKeyCopy.tsx
35 lines 1.0 kB history raw
1import { Box, Icon, Text } from '@tlon/indigo-react';
2import useCopiable from '../../lib/useCopiable';
3import withFadeable from './withFadeable';
5interface MasterKeyCopyProps {
6 text: string;
7}
9const MasterKeyCopy = ({ text }: MasterKeyCopyProps) => {
10 const [doCopy, didCopy] = useCopiable(text);
11 const { color, label, icon } = didCopy
12 ? { color: 'rgb(70,156,106)', label: 'Copied', icon: 'Checkmark' }
13 : { color: 'rgb(89,167,248)', label: 'Copy', icon: 'Copy' };
15 return (
16 <Box onClick={() => doCopy()}>
17 <Box
18 display={'flex'}
19 flexDirection={'row'}
20 flexWrap={'nowrap'}
21 alignItems={'center'}
22 cursor={'pointer'}
23 padding={'10px 15px'}>
24 <Icon color={color} icon={icon} size="18px" mx="2px" />
25 <Text color={color} fontSize={'18px'} mx="2px" fontFamily={'Inter'}>
26 {label}
27 </Text>
28 </Box>
29 </Box>
30 );
31};
33export default MasterKeyCopy;
35export const FadeableMasterKeyCopy = withFadeable(MasterKeyCopy);