alpha
Login
or
Join now
nandi.uk
/
semble
Star
0
Fork
0
Atom
Configure Feed
Issues
Pull Requests
Commits
Tags
Feed URL
Select the types of activity you want to include in your feed.
This repository has no description
Star
0
Fork
0
Atom
Configure Feed
Issues
Pull Requests
Commits
Tags
Feed URL
Select the types of activity you want to include in your feed.
Overview
Issues
Pulls
Pipelines
feat: move share button to header
author
pdelfan
date
2 months ago
(May 21, 2026, 3:22 PM -0700)
commit
618a6a90
618a6a9038626ead0d54135344c58e2955a0fdb1
parent
de079efe
de079efea3a12c9e947d3bc2efaa9e760a4b2957
+97
-34
5 changed files
Expand all
Collapse all
Unified
Split
src
webapp
app
(dashboard)
url
layout.tsx
features
collections
components
CollectionShareHeaderButton
CollectionShareHeaderButton.tsx
semble
components
ShareHeaderButton
ShareHeaderButton.tsx
sembleActions
SembleActions.tsx
containers
sembleActionsContainer
Skeleton.SembleActionsContainer.tsx
+4
src/webapp/app/(dashboard)/url/layout.tsx
View file
Reviewed
···
1
1
import BackButton from '@/components/navigation/backButton/BackButton';
2
2
import Header from '@/components/navigation/header/Header';
3
3
import ReaderHeaderButton from '@/features/reader/components/ReaderHeaderButton/ReaderHeaderButton';
4
4
+
import ShareHeaderButton from '@/features/semble/components/ShareHeaderButton/ShareHeaderButton';
4
5
import { Fragment, Suspense } from 'react';
5
6
6
7
interface Props {
···
14
15
<BackButton />
15
16
<Suspense fallback={null}>
16
17
<ReaderHeaderButton />
18
18
+
</Suspense>
19
19
+
<Suspense fallback={null}>
20
20
+
<ShareHeaderButton />
17
21
</Suspense>
18
22
</Header>
19
23
{props.children}
+46
src/webapp/features/collections/components/CollectionShareHeaderButton/CollectionShareHeaderButton.tsx
View file
Reviewed
···
1
1
+
'use client';
2
2
+
3
3
+
import { ActionIcon, CopyButton, Tooltip } from '@mantine/core';
4
4
+
import { notifications } from '@mantine/notifications';
5
5
+
import { MdIosShare } from 'react-icons/md';
6
6
+
7
7
+
interface Props {
8
8
+
handle: string;
9
9
+
rkey: string;
10
10
+
}
11
11
+
12
12
+
export default function CollectionShareHeaderButton(props: Props) {
13
13
+
const shareLink = `${process.env.NEXT_PUBLIC_APP_URL}/profile/${props.handle}/collections/${props.rkey}`;
14
14
+
15
15
+
return (
16
16
+
<CopyButton value={shareLink}>
17
17
+
{({ copied, copy }) => (
18
18
+
<Tooltip
19
19
+
label={copied ? 'Link copied!' : 'Share'}
20
20
+
withArrow
21
21
+
position="top"
22
22
+
>
23
23
+
<ActionIcon
24
24
+
variant="light"
25
25
+
color="gray"
26
26
+
size={36}
27
27
+
radius={'xl'}
28
28
+
onClick={(e) => {
29
29
+
e.stopPropagation();
30
30
+
copy();
31
31
+
32
32
+
if (copied) return;
33
33
+
notifications.show({
34
34
+
message: 'Link copied!',
35
35
+
position: 'top-center',
36
36
+
id: `${props.handle}/${props.rkey}`,
37
37
+
});
38
38
+
}}
39
39
+
>
40
40
+
<MdIosShare />
41
41
+
</ActionIcon>
42
42
+
</Tooltip>
43
43
+
)}
44
44
+
</CopyButton>
45
45
+
);
46
46
+
}
+46
src/webapp/features/semble/components/ShareHeaderButton/ShareHeaderButton.tsx
View file
Reviewed
···
1
1
+
'use client';
2
2
+
3
3
+
import { ActionIcon, CopyButton, Tooltip } from '@mantine/core';
4
4
+
import { notifications } from '@mantine/notifications';
5
5
+
import { useSearchParams } from 'next/navigation';
6
6
+
import { MdIosShare } from 'react-icons/md';
7
7
+
8
8
+
export default function ShareHeaderButton() {
9
9
+
const searchParams = useSearchParams();
10
10
+
const rawId = searchParams.get('id');
11
11
+
12
12
+
if (!rawId) return null;
13
13
+
14
14
+
const shareLink = `${process.env.NEXT_PUBLIC_APP_URL}/url?id=${rawId}`;
15
15
+
16
16
+
return (
17
17
+
<CopyButton value={shareLink}>
18
18
+
{({ copied, copy }) => (
19
19
+
<Tooltip
20
20
+
label={copied ? 'Link copied!' : 'Share'}
21
21
+
withArrow
22
22
+
position="top"
23
23
+
>
24
24
+
<ActionIcon
25
25
+
variant="light"
26
26
+
color="gray"
27
27
+
size={36}
28
28
+
radius={'xl'}
29
29
+
onClick={() => {
30
30
+
copy();
31
31
+
32
32
+
if (copied) return;
33
33
+
notifications.show({
34
34
+
message: 'Link copied!',
35
35
+
position: 'top-center',
36
36
+
id: copied.toString(),
37
37
+
});
38
38
+
}}
39
39
+
>
40
40
+
<MdIosShare />
41
41
+
</ActionIcon>
42
42
+
</Tooltip>
43
43
+
)}
44
44
+
</CopyButton>
45
45
+
);
46
46
+
}
+1
-33
src/webapp/features/semble/components/sembleActions/SembleActions.tsx
View file
Reviewed
···
3
3
import AddCardToModal from '@/features/cards/components/addCardToModal/AddCardToModal';
4
4
import RemoveCardFromLibraryModal from '@/features/cards/components/removeCardFromLibraryModal/RemoveCardFromLibraryModal';
5
5
import useGetCardFromMyLibrary from '@/features/cards/lib/queries/useGetCardFromMyLibrary';
6
6
-
import { ActionIcon, Button, CopyButton, Group, Tooltip } from '@mantine/core';
7
7
-
import { notifications } from '@mantine/notifications';
6
6
+
import { ActionIcon, Button, Group } from '@mantine/core';
8
7
import { Fragment, useState } from 'react';
9
8
import { FiPlus } from 'react-icons/fi';
10
9
import { IoMdCheckmark } from 'react-icons/io';
11
11
-
import { MdIosShare } from 'react-icons/md';
12
10
import useSembleLibraries from '../../lib/queries/useSembleLibraries';
13
11
import { track } from '@vercel/analytics';
14
12
import { CardSaveSource } from '@/features/analytics/types';
···
36
34
37
35
const urlLibraryCount = allLibraries.length ?? 0;
38
36
39
39
-
const shareLink = `${process.env.NEXT_PUBLIC_APP_URL}/url?id=${props.url}`;
40
40
-
41
37
if (cardStatus.error) {
42
38
return null;
43
39
}
···
45
41
return (
46
42
<Fragment>
47
43
<Group gap={'xs'}>
48
48
-
<CopyButton value={shareLink}>
49
49
-
{({ copied, copy }) => (
50
50
-
<Tooltip
51
51
-
label={copied ? 'Link copied!' : 'Share'}
52
52
-
withArrow
53
53
-
position="top"
54
54
-
>
55
55
-
<ActionIcon
56
56
-
variant="light"
57
57
-
color="gray"
58
58
-
size={36}
59
59
-
radius={'xl'}
60
60
-
onClick={() => {
61
61
-
copy();
62
62
-
63
63
-
if (copied) return;
64
64
-
notifications.show({
65
65
-
message: 'Link copied!',
66
66
-
position: 'top-center',
67
67
-
id: copied.toString(),
68
68
-
});
69
69
-
}}
70
70
-
>
71
71
-
<MdIosShare />
72
72
-
</ActionIcon>
73
73
-
</Tooltip>
74
74
-
)}
75
75
-
</CopyButton>
76
44
<Button
77
45
variant="light"
78
46
color="green"
-1
src/webapp/features/semble/containers/sembleActionsContainer/Skeleton.SembleActionsContainer.tsx
View file
Reviewed
···
4
4
return (
5
5
<Stack gap="sm" align="center">
6
6
<Group gap="xs">
7
7
-
<Skeleton w={36} h={36} circle />
8
7
<Skeleton w={114} h={36} radius="xl" />
9
8
<Skeleton w={113} h={36} radius="xl" />
10
9
<Skeleton w={36} h={36} circle />