This repository has no description
semble
/
src
/
webapp
/
features
/
collections
/
components
/
CollectionShareHeaderButton
/
CollectionShareHeaderButton.tsx
1.2 kB
46 lines
1'use client';
2
3import { ActionIcon, CopyButton, Tooltip } from '@mantine/core';
4import { notifications } from '@mantine/notifications';
5import { MdIosShare } from 'react-icons/md';
6
7interface Props {
8 handle: string;
9 rkey: string;
10}
11
12export default function CollectionShareHeaderButton(props: Props) {
13 const shareLink = `${process.env.NEXT_PUBLIC_APP_URL}/profile/${props.handle}/collections/${props.rkey}`;
14
15 return (
16 <CopyButton value={shareLink}>
17 {({ copied, copy }) => (
18 <Tooltip
19 label={copied ? 'Link copied!' : 'Share'}
20 withArrow
21 position="top"
22 >
23 <ActionIcon
24 variant="light"
25 color="gray"
26 size={36}
27 radius={'xl'}
28 onClick={(e) => {
29 e.stopPropagation();
30 copy();
31
32 if (copied) return;
33 notifications.show({
34 message: 'Link copied!',
35 position: 'top-center',
36 id: `${props.handle}/${props.rkey}`,
37 });
38 }}
39 >
40 <MdIosShare />
41 </ActionIcon>
42 </Tooltip>
43 )}
44 </CopyButton>
45 );
46}