From 25ba2aa110358f3ca60a5eac8ca101762286c1a7 Mon Sep 17 00:00:00 2001 From: Lazar Nikolov Date: Fri, 7 Nov 2025 10:16:25 -0500 Subject: [PATCH 1/7] feat: Add "Open in ChatGPT/Claude" buttons for each page Besides the existing "Copy Page" and "View as Markdown", I've added two more buttons in the dropdown so users can open that page in ChatGPT or Claude and ask questions about it. --- src/components/copyMarkdownButton.tsx | 41 +++++++++++++++++++++++++++ src/icons/chatgpt.tsx | 17 +++++++++++ src/icons/claude.tsx | 17 +++++++++++ src/icons/external-link.tsx | 23 +++++++++++++++ 4 files changed, 98 insertions(+) create mode 100644 src/icons/chatgpt.tsx create mode 100644 src/icons/claude.tsx create mode 100644 src/icons/external-link.tsx diff --git a/src/components/copyMarkdownButton.tsx b/src/components/copyMarkdownButton.tsx index b4a40817847cd..d69add0d5094e 100644 --- a/src/components/copyMarkdownButton.tsx +++ b/src/components/copyMarkdownButton.tsx @@ -6,7 +6,10 @@ import {Clipboard} from 'react-feather'; import Link from 'next/link'; import {usePlausibleEvent} from 'sentry-docs/hooks/usePlausibleEvent'; +import ChatGPT from 'sentry-docs/icons/chatgpt'; import Chevron from 'sentry-docs/icons/Chevron'; +import Claude from 'sentry-docs/icons/claude'; +import ExternalLink from 'sentry-docs/icons/external-link'; import Markdown from 'sentry-docs/icons/Markdown'; interface CopyMarkdownButtonProps { @@ -204,6 +207,44 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) { + + +
+ +
+
+
+ Open in ChatGPT +
+
+ Ask ChatGPT questions about this page +
+
+ + + +
+ +
+
+
+ Open in Claude +
+
+ Ask Claude questions about this page +
+
+ , document.body diff --git a/src/icons/chatgpt.tsx b/src/icons/chatgpt.tsx new file mode 100644 index 0000000000000..247dfc6a0030f --- /dev/null +++ b/src/icons/chatgpt.tsx @@ -0,0 +1,17 @@ +function ChatGPT({width = 16, height = 16, ...props}: React.SVGAttributes) { + return ( + + + + ); +} +export default ChatGPT; diff --git a/src/icons/claude.tsx b/src/icons/claude.tsx new file mode 100644 index 0000000000000..1b15bf0999063 --- /dev/null +++ b/src/icons/claude.tsx @@ -0,0 +1,17 @@ +function Claude({width = 16, height = 16, ...props}: React.SVGAttributes) { + return ( + + Claude + + + ); +} +export default Claude; diff --git a/src/icons/external-link.tsx b/src/icons/external-link.tsx new file mode 100644 index 0000000000000..cef054845bd1d --- /dev/null +++ b/src/icons/external-link.tsx @@ -0,0 +1,23 @@ +function ExternalLink({ + width = 14, + height = 14, + ...props +}: React.SVGAttributes) { + return ( + + + + + + ); +} +export default ExternalLink; From 85ee66286eccb88581c0a0755de701631f761e31 Mon Sep 17 00:00:00 2001 From: Lazar Nikolov Date: Fri, 7 Nov 2025 11:03:36 -0500 Subject: [PATCH 2/7] fix: proper chatgpt/claude link encoding --- src/components/copyMarkdownButton.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/copyMarkdownButton.tsx b/src/components/copyMarkdownButton.tsx index d69add0d5094e..f90e12c9d8a80 100644 --- a/src/components/copyMarkdownButton.tsx +++ b/src/components/copyMarkdownButton.tsx @@ -209,7 +209,7 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) { Date: Fri, 7 Nov 2025 11:03:52 -0500 Subject: [PATCH 3/7] fix: removing redundant className from chatgpt icon --- src/icons/chatgpt.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/icons/chatgpt.tsx b/src/icons/chatgpt.tsx index 247dfc6a0030f..a63915f5d1711 100644 --- a/src/icons/chatgpt.tsx +++ b/src/icons/chatgpt.tsx @@ -7,7 +7,6 @@ function ChatGPT({width = 16, height = 16, ...props}: React.SVGAttributes From 31c922bf66580da7796ad9ca329748feb74edc4f Mon Sep 17 00:00:00 2001 From: Lazar Nikolov Date: Fri, 7 Nov 2025 12:11:01 -0500 Subject: [PATCH 4/7] fix: using "q" instead of "prompt" for chatgpt link --- src/components/copyMarkdownButton.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/copyMarkdownButton.tsx b/src/components/copyMarkdownButton.tsx index f90e12c9d8a80..f8b9708989c4a 100644 --- a/src/components/copyMarkdownButton.tsx +++ b/src/components/copyMarkdownButton.tsx @@ -209,7 +209,7 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) { Date: Fri, 7 Nov 2025 12:19:43 -0500 Subject: [PATCH 5/7] fix: adding plausible events on 'Open with ChatGPT' and 'Open with Claude' --- src/components/copyMarkdownButton.tsx | 12 ++++++++++++ src/hooks/usePlausibleEvent.tsx | 8 ++++++++ 2 files changed, 20 insertions(+) diff --git a/src/components/copyMarkdownButton.tsx b/src/components/copyMarkdownButton.tsx index f8b9708989c4a..ec10f4efedb9f 100644 --- a/src/components/copyMarkdownButton.tsx +++ b/src/components/copyMarkdownButton.tsx @@ -69,6 +69,16 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) { setIsOpen(false); }; + const handleOpenChatGPTClick = () => { + emit('Open in ChatGPT', {props: {page: pathname, source: 'chatgpt_link'}}); + setIsOpen(false); + }; + + const handleOpenClaudeClick = () => { + emit('Open in Claude', {props: {page: pathname, source: 'claude_link'}}); + setIsOpen(false); + }; + const handleDropdownToggle = () => { setIsOpen(!isOpen); if (!isOpen) { @@ -213,6 +223,7 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) { target="_blank" rel="noopener noreferrer" className={`${dropdownItemClass} no-underline`} + onClick={handleOpenChatGPTClick} >
@@ -232,6 +243,7 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) { target="_blank" rel="noopener noreferrer" className={`${dropdownItemClass} no-underline`} + onClick={handleOpenClaudeClick} >
diff --git a/src/hooks/usePlausibleEvent.tsx b/src/hooks/usePlausibleEvent.tsx index a9491efec6207..a899f5426facb 100644 --- a/src/hooks/usePlausibleEvent.tsx +++ b/src/hooks/usePlausibleEvent.tsx @@ -27,6 +27,14 @@ type PlausibleEventProps = { page: string; title: string; }; + ['Open in ChatGPT']: { + page: string; + source: string; + }; + ['Open in Claude']: { + page: string; + source: string; + }; ['Read Progress']: { page: string; readProgress: ReadProgressMilestone; From 2e30af9d80e417fdbddd880f482ee3963d3d4a61 Mon Sep 17 00:00:00 2001 From: Lazar Nikolov Date: Fri, 7 Nov 2025 12:21:18 -0500 Subject: [PATCH 6/7] fix: adding aria-hidden to external link icon --- src/components/copyMarkdownButton.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/copyMarkdownButton.tsx b/src/components/copyMarkdownButton.tsx index ec10f4efedb9f..a214a8cd62a93 100644 --- a/src/components/copyMarkdownButton.tsx +++ b/src/components/copyMarkdownButton.tsx @@ -230,7 +230,7 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) {
- Open in ChatGPT + Open in ChatGPT
Ask ChatGPT questions about this page @@ -250,7 +250,7 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) {
- Open in Claude + Open in Claude
Ask Claude questions about this page From 2422d8032460a086dd68746f197c2ef3cec9982b Mon Sep 17 00:00:00 2001 From: Lazar Nikolov Date: Mon, 10 Nov 2025 13:00:03 -0500 Subject: [PATCH 7/7] fix: chat gpt link query parameter - hint instead of hints --- src/components/copyMarkdownButton.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/copyMarkdownButton.tsx b/src/components/copyMarkdownButton.tsx index a214a8cd62a93..81444c5c2be42 100644 --- a/src/components/copyMarkdownButton.tsx +++ b/src/components/copyMarkdownButton.tsx @@ -219,7 +219,7 @@ export function CopyMarkdownButton({pathname}: CopyMarkdownButtonProps) {