diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx new file mode 100644 index 00000000..a49d12bf --- /dev/null +++ b/src/webapp/app/bookmarklet/page.tsx @@ -0,0 +1,135 @@ +'use client'; + +import { + Container, + Title, + Text, + Stack, + Button, + Code, + Alert, + Box, + Group, + Anchor, +} from '@mantine/core'; +import { useState } from 'react'; +import { BiInfoCircle } from 'react-icons/bi'; +import { RiDragDropLine } from 'react-icons/ri'; + +export default function BookmarkletPage() { + const [copied, setCopied] = useState(false); + + const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:3000'; + + const bookmarkletCode = `javascript:(function(){ + const currentUrl = encodeURIComponent(window.location.href); + const sembleUrl = '${appUrl}/url?id=' + currentUrl; + window.open(sembleUrl, '_blank'); + })();`; + + const handleCopy = async () => { + try { + await navigator.clipboard.writeText(bookmarkletCode); + setCopied(true); + setTimeout(() => setCopied(false), 2000); + } catch (err) { + console.error('Failed to copy bookmarklet:', err); + } + }; + + return ( + + + + Semble Bookmarklet + + Add this bookmarklet to your browser to quickly open any webpage in Semble + and see what your network has shared about it. + + + + } title="How to install" color="blue"> + + + 1. Copy the bookmarklet code below or drag the button to your bookmarks bar + + + 2. When you're on any webpage, click the bookmarklet to open it in Semble + + + 3. You'll see who in your network has shared that URL and any notes they've added + + + + + + + Method 1: Drag to Bookmarks Bar + + + Drag this button directly to your browser's bookmarks bar: + + + + + Open in Semble + + + + + + + Method 2: Copy Code + + + Copy this code and create a new bookmark with it as the URL: + + + + {bookmarkletCode} + + + + + + } title="Note" color="gray"> + + This bookmarklet will open Semble in a new tab. Make sure you're logged in + to see personalized results from your network. + + + + + ); +} -- 2.51.2 From c7d7223879c770a45defd75c145aa2b7eb8f0d47 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:10:43 -0500 Subject: [PATCH 02/10] update jest runner settings --- .gitignore | 1 - .vscode/settings.json | 3 +++ 2 files changed, 3 insertions(+), 1 deletion(-) create mode 100644 .vscode/settings.json diff --git a/.gitignore b/.gitignore index 849bbd22..b3a533bc 100644 --- a/.gitignore +++ b/.gitignore @@ -9,4 +9,3 @@ dist/ build *storybook.log storybook-static -.vscode/settings.json diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 00000000..1218db22 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,3 @@ +{ + "jest.runMode": "on-demand" +} \ No newline at end of file -- 2.51.2 From 6da1317fb121f1ffd3ea5bf6b9604aec9e313b58 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:19:32 -0500 Subject: [PATCH 03/10] fix: resolve React javascript URL security block for bookmarklet Co-authored-by: aider (anthropic/claude-sonnet-4-20250514) --- src/webapp/app/bookmarklet/page.tsx | 26 ++++++++------------------ 1 file changed, 8 insertions(+), 18 deletions(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index a49d12bf..79f1ab35 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -10,11 +10,9 @@ import { Alert, Box, Group, - Anchor, } from '@mantine/core'; import { useState } from 'react'; import { BiInfoCircle } from 'react-icons/bi'; -import { RiDragDropLine } from 'react-icons/ri'; export default function BookmarkletPage() { const [copied, setCopied] = useState(false); @@ -37,6 +35,13 @@ export default function BookmarkletPage() { } }; + // Create the bookmarklet link using dangerouslySetInnerHTML to bypass React's security check + const createBookmarkletLink = () => { + return { + __html: `Open in Semble` + }; + }; + return ( @@ -70,22 +75,7 @@ export default function BookmarkletPage() { Drag this button directly to your browser's bookmarks bar: - - - Open in Semble - + -- 2.51.2 From 1d874b29c16f03a3ba148d8510f1ecd519ac1ab4 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:20:36 -0500 Subject: [PATCH 04/10] fix: remove URL encoding in bookmarklet code Co-authored-by: aider (anthropic/claude-sonnet-4-20250514) --- src/webapp/app/bookmarklet/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index 79f1ab35..c98c4d0e 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -20,7 +20,7 @@ export default function BookmarkletPage() { const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:3000'; const bookmarkletCode = `javascript:(function(){ - const currentUrl = encodeURIComponent(window.location.href); + const currentUrl = window.location.href; const sembleUrl = '${appUrl}/url?id=' + currentUrl; window.open(sembleUrl, '_blank'); })();`; -- 2.51.2 From 481e5235cdb3c18edb0b3fbc6662e125b73950a7 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:21:53 -0500 Subject: [PATCH 05/10] style: replace lock icon with external link icon in bookmarklet button Co-authored-by: aider (anthropic/claude-sonnet-4-20250514) --- src/webapp/app/bookmarklet/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index c98c4d0e..cd06a26a 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -38,7 +38,7 @@ export default function BookmarkletPage() { // Create the bookmarklet link using dangerouslySetInnerHTML to bypass React's security check const createBookmarkletLink = () => { return { - __html: `Open in Semble` + __html: `Open in Semble` }; }; -- 2.51.2 From 2259db22bffc5fe2908b1cf5bddf47a8fb2b7c7e Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:22:59 -0500 Subject: [PATCH 06/10] style: replace external link icon with bookmark icon Co-authored-by: aider (anthropic/claude-sonnet-4-20250514) --- src/webapp/app/bookmarklet/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index cd06a26a..d55d5000 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -38,7 +38,7 @@ export default function BookmarkletPage() { // Create the bookmarklet link using dangerouslySetInnerHTML to bypass React's security check const createBookmarkletLink = () => { return { - __html: `Open in Semble` + __html: `Open in Semble` }; }; -- 2.51.2 From 91e24f3bf3fbc1cd38c1e9d94c06e11272ea8a45 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:23:57 -0500 Subject: [PATCH 07/10] style: update bookmarklet button color to orange Co-authored-by: aider (anthropic/claude-sonnet-4-20250514) --- src/webapp/app/bookmarklet/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index d55d5000..6129bb7e 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -38,7 +38,7 @@ export default function BookmarkletPage() { // Create the bookmarklet link using dangerouslySetInnerHTML to bypass React's security check const createBookmarkletLink = () => { return { - __html: `Open in Semble` + __html: `Open in Semble` }; }; -- 2.51.2 From 5a01611a5606929493a027e4eb9d5101a186e6e3 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:24:23 -0500 Subject: [PATCH 08/10] style: change "how to install" info box color to light orange Co-authored-by: aider (anthropic/claude-sonnet-4-20250514) --- src/webapp/app/bookmarklet/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index 6129bb7e..622deacd 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -53,7 +53,7 @@ export default function BookmarkletPage() { - } title="How to install" color="blue"> + } title="How to install" color="orange"> 1. Copy the bookmarklet code below or drag the button to your bookmarks bar -- 2.51.2 From 37785baee69c072d77636e56979a7bdb9e806fd0 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:25:50 -0500 Subject: [PATCH 09/10] remove unused sections --- src/webapp/app/bookmarklet/page.tsx | 24 ++++++++---------------- 1 file changed, 8 insertions(+), 16 deletions(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index 622deacd..1f31d78d 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -18,7 +18,7 @@ export default function BookmarkletPage() { const [copied, setCopied] = useState(false); const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:3000'; - + const bookmarkletCode = `javascript:(function(){ const currentUrl = window.location.href; const sembleUrl = '${appUrl}/url?id=' + currentUrl; @@ -38,7 +38,7 @@ export default function BookmarkletPage() { // Create the bookmarklet link using dangerouslySetInnerHTML to bypass React's security check const createBookmarkletLink = () => { return { - __html: `Open in Semble` + __html: `Open in Semble`, }; }; @@ -48,21 +48,20 @@ export default function BookmarkletPage() { Semble Bookmarklet - Add this bookmarklet to your browser to quickly open any webpage in Semble - and see what your network has shared about it. + Add this bookmarklet to your browser to quickly open any webpage in + Semble. } title="How to install" color="orange"> - 1. Copy the bookmarklet code below or drag the button to your bookmarks bar - - - 2. When you're on any webpage, click the bookmarklet to open it in Semble + 1. Copy the bookmarklet code below or drag the button to your + bookmarks bar - 3. You'll see who in your network has shared that URL and any notes they've added + 2. When you're on any webpage, click the bookmarklet to open it in + Semble @@ -112,13 +111,6 @@ export default function BookmarkletPage() { - - } title="Note" color="gray"> - - This bookmarklet will open Semble in a new tab. Make sure you're logged in - to see personalized results from your network. - - ); -- 2.51.2 From ff03e09bfaf3b3baf2f90cdc6562677f0331ff67 Mon Sep 17 00:00:00 2001 From: Wesley Finck Date: Thu, 6 Nov 2025 17:26:32 -0500 Subject: [PATCH 10/10] update default app url --- src/webapp/app/bookmarklet/page.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/webapp/app/bookmarklet/page.tsx b/src/webapp/app/bookmarklet/page.tsx index 1f31d78d..26720d89 100644 --- a/src/webapp/app/bookmarklet/page.tsx +++ b/src/webapp/app/bookmarklet/page.tsx @@ -17,7 +17,7 @@ import { BiInfoCircle } from 'react-icons/bi'; export default function BookmarkletPage() { const [copied, setCopied] = useState(false); - const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://localhost:3000'; + const appUrl = process.env.NEXT_PUBLIC_APP_URL || 'http://127.0.0.1:4000'; const bookmarkletCode = `javascript:(function(){ const currentUrl = window.location.href;