Skip to content

feat: Add inline 'Copy Prompt' button to platform links on getting-started pages#18336

Closed
sfanahata wants to merge 1 commit into
getsentry:masterfrom
sfanahata:sf/interstitial-agent-setup-prompt
Closed

feat: Add inline 'Copy Prompt' button to platform links on getting-started pages#18336
sfanahata wants to merge 1 commit into
getsentry:masterfrom
sfanahata:sf/interstitial-agent-setup-prompt

Conversation

@sfanahata

Copy link
Copy Markdown
Contributor

DESCRIBE YOUR PR

Add an inline "Copy Prompt" button next to platform links on interstitial getting-started pages (starting with Logs). Platforms that have an associated agent-assisted setup skill now show a small purple button that copies the agent setup prompt to the clipboard, giving users immediate access to the AI agent prompt without needing to click through to the platform page first.

What changed

  • src/components/agentSkillsCallout/shared.ts (new): Extracted shared prompt-building utilities (buildPrompt, buildPromptUrl, buildDotagentsCommand, buildNpxSkillsCommand, constants) so both AgentSkillsCallout and the new CopyPromptButton reuse the same logic.

  • src/components/copyPromptButton/ (new): Client component that renders an inline "Copy Prompt" button with:

    • Clipboard copy of the agent setup prompt (e.g., Use curl to download, read and follow: https://skills.sentry.dev/{skill}/SKILL.md)
    • Radix tooltip ("Copy setup prompt for AI agents") matching the onboarding tooltip style
    • Plausible analytics + Sentry metrics tracking (reuses existing Copy AI Prompt event)
    • Light/dark mode support via next-themes
    • Hidden on mobile (< 768px)
  • src/components/linkWithPlatformIcon.tsx: Added optional skill prop. When present, renders a CopyPromptButton inline after the platform link.

  • src/components/agentSkillsCallout/index.tsx: Refactored to import from shared.ts instead of defining utilities locally. No behavioral change.

  • docs/product/explore/logs/getting-started/index.mdx: Added skill="..." to 20 platform links that have corresponding agent skills (Browser JS, Cloudflare, Nest.js, Node.js, Next.js, React, React Router, Svelte, SvelteKit, TanStack Start, Android, Apple, Flutter, React Native, PHP, Python, Ruby, Go, .NET).

How it looks

Platforms with a skill:

[React icon] React  |  [clipboard] Copy Prompt    ← hover shows tooltip

Platforms without a skill (unchanged):

[Angular icon] Angular

Future work

  • Apply same pattern to metrics and profiling getting-started pages
  • Consider adding skills for more frameworks (Angular, Astro, Express, etc.)

IS YOUR CHANGE URGENT?

  • None: Not urgent, can wait up to 1 week+

PRE-MERGE CHECKLIST

  • Checked Vercel preview for correctness, including links
  • PR was reviewed and approved by any necessary SMEs (subject matter experts)
  • PR was reviewed and approved by a member of the Sentry docs team

…arted pages

Add an optional `skill` prop to `LinkWithPlatformIcon` that renders an
inline copy-prompt button next to platform links that have agent-assisted
setup skills. Clicking the button copies the agent setup prompt to the
clipboard (e.g., `Use curl to download, read and follow: https://skills.sentry.dev/{skill}/SKILL.md`).

Changes:
- Extract shared prompt-building utilities into `agentSkillsCallout/shared.ts`
- Create `CopyPromptButton` client component with Radix tooltip, Plausible
  analytics, and Sentry metrics tracking
- Update `LinkWithPlatformIcon` to accept optional `skill` prop
- Add `skill` props to 20 platform links on the logs getting-started page
@vercel

vercel Bot commented Jun 9, 2026

Copy link
Copy Markdown

Someone is attempting to deploy a commit to the Sentry Team on Vercel.

A member of the Team first needs to authorize it.

@sfanahata sfanahata closed this Jun 9, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant