Feat/claude agent setup

docs/organization/integrations/coding-agents/claude/index.mdx

@@ -0,0 +1,44 @@
+---
+title: Claude Agent
+sidebar_order: 0
+description: "Set up the Claude Agent integration to send Sentry issues directly to Claude for automated root cause analysis and fix generation."
+keywords:
+  - Claude
+  - Claude Agent
+  - agent skills
+  - AI coding assistant
+  - integration
+---
+
+You can trigger Claude agents from your [Seer Autofix](/product/ai-in-sentry/seer/autofix/) tab. The agent is provided with Seer's root cause analysis output and issue context, so it can understand the problem and generate a fix — including opening a branch with the changes.
+
+## Install and Configure
+
+<Alert>
+
+Sentry Owner, Manager, or Admin permissions are required to install this integration. You must also have an existing Claude workspace and environment set up before connecting to Sentry.
+
+</Alert>
+
+1. Go to [platform.claude.com/dashboard](https://platform.claude.com/dashboard) and create an API key for your workspace.
+
+2. In Sentry, navigate to **Settings > Integrations** and search for **Claude Agent**.
+
+3. Enter your API key. If your workspace isn't "default" or you want to use a specific environment, update those fields here, then save.
+<br />
+
+    <Arcade src="https://demo.arcade.software/GmQwOB82wAeELf3lr43h?embed&show_copy_link=true" width="75%" />
+
+## Using the Integration
+
+Once installed, you can send any Seer root cause analysis to a Claude agent.
+
+1. Go to a Sentry issue and click **Start Root Cause Analysis**.
+
+2. Once root cause analysis completes, open the dropdown and select **Send to Claude Agent**.
+
+    <Arcade src="https://demo.arcade.software/ozuv7mNBShFX0HtrbaWB?embed&show_copy_link=true" width="75%" />
+
+3. A card will appear in the drawer for the active session. While the session is running, you can follow along in the Claude Console. Once complete, a button linking to the created branch will appear in the card.
+
+![Claude Agent card in the drawer =800x](./img/claude-agent-install-1.png)

docs/organization/integrations/coding-agents/index.mdx

@@ -0,0 +1,9 @@
+---
+title: Coding Agents
+sidebar_order: 6
+description: "Connect AI coding agents to Sentry to automatically debug and fix issues using Seer's root cause analysis."
+---
+
+Connect an AI coding agent to Sentry so that Seer's root cause analysis can be sent directly to the agent for automated fix generation and pull request creation.
+
+<PageGrid />

docs/organization/integrations/index.mdx

@@ -113,7 +113,7 @@ For more details, see the [full Integration Platform documentation](/organizatio
 
 | Integration                                         | Seer Integration |
 | --------------------------------------------------- | ---------------- |
-| [Cursor Cloud Agent](/organization/integrations/cursor/) | X                |
+| [Cursor Cloud Agent](/organization/integrations/coding-agents/cursor/) | X                |
 
 ## Debugging
 

docs/product/ai-in-sentry/seer/index.mdx

@@ -57,7 +57,7 @@ You can prompt Seer to generate PRs to fix your issue, and push it to GitHub. Yo
 
 ### Coding Agents
 
-You can delegate Seer's Autofix to an external coding agent, such as [Cursor](/organization/integrations/cursor/), for further debugging and fixes.
+You can delegate Seer's Autofix to an external coding agent, such as [Cursor](/organization/integrations/coding-agents/cursor/), for further debugging and fixes.
 
 ### Code Review
 

redirects.js

@@ -573,7 +573,11 @@ const developerDocsRedirects = [
 const userDocsRedirects = [
   {
     source: '/integrations/cursor/',
-    destination: '/organization/integrations/cursor/',
+    destination: '/organization/integrations/coding-agents/cursor/',
+  },
+  {
+    source: '/organization/integrations/cursor/',
+    destination: '/organization/integrations/coding-agents/cursor/',
   },
   {
     source: '/concepts/data-management/advanced-datascrubbing/',

src/components/arcade.tsx

@@ -1,30 +1,42 @@
 type ArcadeProps = {
   src: string;
+  /** Constrains the embed width (for example `640px` or `55%`). Defaults to full width of the content column. */
+  width?: string;
 };
-export function Arcade({src}: ArcadeProps) {
+
+export function Arcade({src, width}: ArcadeProps) {
   return (
     <div
       style={{
-        height: '0px',
-        paddingBottom: 'calc(56.8359% + 41px)',
-        position: 'relative',
-        width: '100%',
+        maxWidth: '100%',
+        width: width ?? '100%',
       }}
     >
-      <iframe
-        src={src}
-        loading="lazy"
-        allowFullScreen
-        allow="fullscreen;"
+      {/* Inner wrapper: % padding is relative to outer width so aspect ratio matches narrow embeds. */}
+      <div
         style={{
-          colorScheme: 'light',
-          height: '100%',
-          left: '0px',
-          position: 'absolute',
-          top: '0px',
+          height: '0px',
+          paddingBottom: 'calc(56.8359% + 41px)',
+          position: 'relative',
           width: '100%',
         }}
-      />
+      >
+        <iframe
+          src={src}
+          loading="lazy"
+          allowFullScreen
+          allow="fullscreen;"
+          style={{
+            border: 'none',
+            colorScheme: 'light',
+            height: '100%',
+            left: '0px',
+            position: 'absolute',
+            top: '0px',
+            width: '100%',
+          }}
+        />
+      </div>
     </div>
   );
 }