Skip to content

Commit 0407d8b

Browse files
HazATclaude
HazAT
and
claude
committed
feat(agent-skills): redesign agent skills callout with copy-prompt UX
Introduce a new AgentSkillsCallout component that replaces the generic Expandable for the Next.js getting-started page. The new design features: - A prominent "Agent-Assisted Setup" card with a "Recommended" badge - A one-line prompt users can copy directly into their coding agent (points to skills.sentry.gg short URL) - Collapsed by default with an expandable section for full skills package installation (dotagents + npx skills) - Purple color scheme matching the Sentry brand palette with proper light/dark mode support This is a POC applied only to the Next.js platform include (javascript.nextjs.mdx). Other platforms still use the old Expandable component and will be migrated separately. Also updates repo references from sentry-agent-skills to sentry-for-ai. Co-Authored-By: Claude <noreply@anthropic.com>
1 parent 5f69efe commit 0407d8b

File tree

27 files changed

+425
-392
lines changed

27 files changed

+425
-392
lines changed

‎.yarn/install-state.gz‎

1.27 MB
Binary file not shown.

‎docs/platforms/dotnet/common/logs/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -12,23 +12,7 @@ notSupported:
1212
- dotnet.xamarin
1313
---
1414

15-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
16-
17-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up logging in your .NET application.
18-
19-
### Install Skills
20-
21-
```bash {tabTitle: dotagents}
22-
npx @sentry/dotagents add getsentry/sentry-for-ai --name sentry-dotnet-sdk
23-
```
24-
25-
```bash {tabTitle: npx skills}
26-
npx skills add getsentry/sentry-for-ai --skill sentry-dotnet-sdk
27-
```
28-
29-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
30-
31-
</Expandable>
15+
<AgentSkillsCallout skill="sentry-dotnet-sdk" platformName=".NET" />
3216

3317
With Sentry Structured Logs, you can send text-based log information from your applications to Sentry. Once in Sentry, these logs can be viewed alongside relevant errors, searched by text-string, or searched using their individual attributes.
3418

‎docs/platforms/dotnet/common/metrics/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -7,23 +7,7 @@ sidebar_section: features
77
beta: true
88
---
99

10-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
11-
12-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up metrics in your .NET application.
13-
14-
### Install Skills
15-
16-
```bash {tabTitle: dotagents}
17-
npx @sentry/dotagents add getsentry/sentry-for-ai --name sentry-dotnet-sdk
18-
```
19-
20-
```bash {tabTitle: npx skills}
21-
npx skills add getsentry/sentry-for-ai --skill sentry-dotnet-sdk
22-
```
23-
24-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
25-
26-
</Expandable>
10+
<AgentSkillsCallout skill="sentry-dotnet-sdk" platformName=".NET" />
2711

2812
<Alert>
2913
This feature is currently in open beta. Please reach out on

‎docs/platforms/dotnet/common/tracing/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,7 @@ sidebar_order: 3
66
sidebar_section: features
77
---
88

9-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
10-
11-
Install Sentry’s [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up tracing in your .NET application.
12-
13-
### Install Skills
14-
15-
```bash {tabTitle: dotagents}
16-
npx @sentry/dotagents add getsentry/sentry-for-ai --name sentry-dotnet-sdk
17-
```
18-
19-
```bash {tabTitle: npx skills}
20-
npx skills add getsentry/sentry-for-ai --skill sentry-dotnet-sdk
21-
```
22-
23-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
24-
25-
</Expandable>
9+
<AgentSkillsCallout skill="sentry-dotnet-sdk" platformName=".NET" />
2610

2711
With [tracing](/product/insights/overview/), Sentry tracks your software performance, measuring metrics like throughput and latency, and displaying the impact of errors across multiple systems. Sentry captures distributed traces consisting of transactions and spans, which measure individual services and individual operations within those services. Learn more about our model in [Distributed Tracing](/product/sentry-basics/tracing/distributed-tracing/).
2812

‎docs/platforms/javascript/common/ai-agent-monitoring/index.mdx‎

Lines changed: 2 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -31,23 +31,7 @@ supported:
3131

3232
With <Link to="/ai/monitoring/agents/dashboard/">Sentry AI Agent Monitoring</Link>, you can monitor and debug your AI systems with full-stack context. You'll be able to track key insights like token usage, latency, tool usage, and error rates. AI Agent Monitoring data will be fully connected to your other Sentry data like logs, errors, and traces.
3333

34-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
35-
36-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up AI Agent Monitoring in your application.
37-
38-
### Install Skills
39-
40-
```bash {tabTitle: dotagents}
41-
npx @sentry/dotagents add getsentry/sentry-for-ai --name sentry-setup-ai-monitoring
42-
```
43-
44-
```bash {tabTitle: npx skills}
45-
npx skills add getsentry/sentry-for-ai --skill sentry-setup-ai-monitoring
46-
```
47-
48-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
49-
50-
</Expandable>
34+
<AgentSkillsCallout skill="sentry-setup-ai-monitoring" />
5135

5236
## Prerequisites
5337

@@ -171,7 +155,7 @@ await openai.chat.completions.create({
171155
// Both calls will have gen_ai.conversation.id: "conv_abc123"
172156

173157
// To unset it
174-
Sentry.setConversationId(null);
158+
Sentry.setConversationId(null);
175159
```
176160

177161
</SplitSectionCode>

‎docs/platforms/javascript/common/metrics/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -10,23 +10,7 @@ notSupported:
1010
- javascript.capacitor
1111
---
1212

13-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
14-
15-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up metrics in your application.
16-
17-
### Install Skills
18-
19-
```bash {tabTitle: dotagents}
20-
npx @sentry/dotagents add getsentry/sentry-for-ai --all
21-
```
22-
23-
```bash {tabTitle: npx skills}
24-
npx skills add getsentry/sentry-for-ai
25-
```
26-
27-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
28-
29-
</Expandable>
13+
<AgentSkillsCallout />
3014

3115
With [Sentry Metrics](/product/explore/metrics/), you can send counters, gauges, and distributions from your applications to Sentry. Once in Sentry, these metrics can be viewed alongside relevant errors, and searched using their individual attributes.
3216

‎docs/platforms/javascript/common/tracing/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,7 @@ sidebar_order: 6
66
sidebar_section: features
77
---
88

9-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
10-
11-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up tracing in your application.
12-
13-
### Install Skills
14-
15-
```bash {tabTitle: dotagents}
16-
npx @sentry/dotagents add getsentry/sentry-for-ai --all
17-
```
18-
19-
```bash {tabTitle: npx skills}
20-
npx skills add getsentry/sentry-for-ai
21-
```
22-
23-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
24-
25-
</Expandable>
9+
<AgentSkillsCallout />
2610

2711
With [tracing](/product/insights/overview/), Sentry automatically tracks your software performance across your application services, measuring metrics like throughput and latency, and displaying the impact of errors across multiple systems.
2812

‎docs/platforms/javascript/guides/nextjs/logs/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -7,23 +7,7 @@ sidebar_section: features
77
new: true
88
---
99

10-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
11-
12-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up logging in your Next.js application.
13-
14-
### Install Skills
15-
16-
```bash {tabTitle: dotagents}
17-
npx @sentry/dotagents add getsentry/sentry-for-ai --name sentry-nextjs-sdk
18-
```
19-
20-
```bash {tabTitle: npx skills}
21-
npx skills add getsentry/sentry-for-ai --skill sentry-nextjs-sdk
22-
```
23-
24-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
25-
26-
</Expandable>
10+
<AgentSkillsCallout skill="sentry-nextjs-sdk" platformName="Next.js" />
2711

2812
Sentry Logs let you send structured log data from your Next.js application. Unlike traditional string-based logging, structured logs include queryable attributes that help you debug issues faster by filtering on specific users, orders, or any business context you include.
2913

‎docs/platforms/javascript/guides/nextjs/tracing/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -6,23 +6,7 @@ sidebar_order: 5
66
sidebar_section: features
77
---
88

9-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
10-
11-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up tracing in your Next.js application.
12-
13-
### Install Skills
14-
15-
```bash {tabTitle: dotagents}
16-
npx @sentry/dotagents add getsentry/sentry-for-ai --name sentry-nextjs-sdk
17-
```
18-
19-
```bash {tabTitle: npx skills}
20-
npx skills add getsentry/sentry-for-ai --skill sentry-nextjs-sdk
21-
```
22-
23-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
24-
25-
</Expandable>
9+
<AgentSkillsCallout skill="sentry-nextjs-sdk" platformName="Next.js" />
2610

2711
Tracing captures the timing and flow of requests through your Next.js application. Learn more about [tracing](/concepts/key-terms/tracing/) and how Sentry uses traces to track performance across services.
2812

‎docs/platforms/python/integrations/openai-agents/index.mdx‎

Lines changed: 1 addition & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -12,23 +12,7 @@ The support for **OpenAI Agents SDK** is in its beta phase. Please test locally
1212
This integration connects Sentry with the [OpenAI Python SDK](https://openai.github.io/openai-agents-python/).
1313
The integration has been confirmed to work with OpenAI Agents version 0.0.19.
1414

15-
<Expandable title="Sentry Agent Skills" copy="Copy Install Command" hideFromMd={true}>
16-
17-
Install Sentry's [agent skills](/ai/agent-skills/) to teach your AI coding assistant how to set up AI Agent Monitoring in your Python application.
18-
19-
### Install Skills
20-
21-
```bash {tabTitle: dotagents}
22-
npx @sentry/dotagents add getsentry/sentry-for-ai --name sentry-setup-ai-monitoring
23-
```
24-
25-
```bash {tabTitle: npx skills}
26-
npx skills add getsentry/sentry-for-ai --skill sentry-setup-ai-monitoring
27-
```
28-
29-
See the [full list of available skills](https://skills.sh/getsentry/sentry-for-ai) and [installation docs](/ai/agent-skills/) for more details.
30-
31-
</Expandable>
15+
<AgentSkillsCallout skill="sentry-setup-ai-monitoring" platformName="Python" />
3216

3317
Once you've installed this SDK, you can use [Sentry AI Agents Insights](https://sentry.io/orgredirect/organizations/:orgslug/insights/ai/agents/), a Sentry dashboard that helps you understand what's going on with your AI agents.
3418

0 commit comments

Comments
 (0)