cosmik.network
A social knowledge tool for researchers built on ATProto
remove unused sections
+8
-16
src/webapp/app/bookmarklet/page.tsx
+8
-16
src/webapp/app/bookmarklet/page.tsx
···
18
const [copied, setCopied] = useState(false);
19
20
const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:3000';
21
-
22
const bookmarkletCode = `javascript:(function(){
23
const currentUrl = window.location.href;
24
const sembleUrl = '${appUrl}/url?id=' + currentUrl;
···
38
// Create the bookmarklet link using dangerouslySetInnerHTML to bypass React's security check
39
const createBookmarkletLink = () => {
40
return {
41
-
__html: `<a href="${bookmarkletCode}" style="text-decoration: none; padding: 8px 16px; background-color: var(--mantine-color-orange-6); color: white; border-radius: 4px; display: inline-flex; align-items: center; gap: 8px;"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z"/></svg>Open in Semble</a>`
42
};
43
};
44
···
48
<Stack gap="md">
49
<Title order={1}>Semble Bookmarklet</Title>
50
<Text size="lg" c="dimmed">
51
-
Add this bookmarklet to your browser to quickly open any webpage in Semble
52
-
and see what your network has shared about it.
53
</Text>
54
</Stack>
55
56
<Alert icon={<BiInfoCircle />} title="How to install" color="orange">
57
<Stack gap="sm">
58
<Text>
59
-
1. Copy the bookmarklet code below or drag the button to your bookmarks bar
60
-
</Text>
61
-
<Text>
62
-
2. When you're on any webpage, click the bookmarklet to open it in Semble
63
</Text>
64
<Text>
65
-
3. You'll see who in your network has shared that URL and any notes they've added
66
</Text>
67
</Stack>
68
</Alert>
···
112
</Button>
113
</Box>
114
</Stack>
115
-
116
-
<Alert icon={<BiInfoCircle />} title="Note" color="gray">
117
-
<Text>
118
-
This bookmarklet will open Semble in a new tab. Make sure you're logged in
119
-
to see personalized results from your network.
120
-
</Text>
121
-
</Alert>
122
</Stack>
123
</Container>
124
);
···
18
const [copied, setCopied] = useState(false);
19
20
const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:3000';
21
+
22
const bookmarkletCode = `javascript:(function(){
23
const currentUrl = window.location.href;
24
const sembleUrl = '${appUrl}/url?id=' + currentUrl;
···
38
// Create the bookmarklet link using dangerouslySetInnerHTML to bypass React's security check
39
const createBookmarkletLink = () => {
40
return {
41
+
__html: `<a href="${bookmarkletCode}" style="text-decoration: none; padding: 8px 16px; background-color: var(--mantine-color-orange-6); color: white; border-radius: 4px; display: inline-flex; align-items: center; gap: 8px;"><svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor"><path d="M17 3H7c-1.1 0-1.99.9-1.99 2L5 21l7-3 7 3V5c0-1.1-.9-2-2-2z"/></svg>Open in Semble</a>`,
42
};
43
};
44
···
48
<Stack gap="md">
49
<Title order={1}>Semble Bookmarklet</Title>
50
<Text size="lg" c="dimmed">
51
+
Add this bookmarklet to your browser to quickly open any webpage in
52
+
Semble.
53
</Text>
54
</Stack>
55
56
<Alert icon={<BiInfoCircle />} title="How to install" color="orange">
57
<Stack gap="sm">
58
<Text>
59
+
1. Copy the bookmarklet code below or drag the button to your
60
+
bookmarks bar
61
</Text>
62
<Text>
63
+
2. When you're on any webpage, click the bookmarklet to open it in
64
+
Semble
65
</Text>
66
</Stack>
67
</Alert>
···
111
</Button>
112
</Box>
113
</Stack>
114
</Stack>
115
</Container>
116
);