feat: add mcp-clients docs

apps/web/src/lib/developer-config.ts

@@ -215,7 +215,9 @@ export function getCodeForMCPClientConfig({
       }
 
     case 'cursor': {
-      const config = Buffer.from(JSON.stringify(mcpConfig)).toString('base64')
+      const config = Buffer.from(JSON.stringify({ url: mcpUrl })).toString(
+        'base64'
+      )
       const href = `cursor://anysphere.cursor-deeplink/mcp/install?name=${identifier}&config=${config}`
 
       return {

docs/docs.json

@@ -57,6 +57,20 @@
               "marketplace/ts-sdks/genkit",
               "marketplace/ts-sdks/mastra"
             ]
+          },
+          {
+            "group": "MCP Clients",
+            "pages": [
+              "marketplace/mcp-clients/claude-code",
+              "marketplace/mcp-clients/claude-desktop",
+              "marketplace/mcp-clients/cline",
+              "marketplace/mcp-clients/cursor",
+              "marketplace/mcp-clients/raycast",
+              "marketplace/mcp-clients/trae",
+              "marketplace/mcp-clients/vscode",
+              "marketplace/mcp-clients/warp",
+              "marketplace/mcp-clients/windsurf"
+            ]
           }
         ]
       },

docs/marketplace/index.mdx

@@ -184,7 +184,80 @@ description: A quick start on how to use tools from Agentic's marketplace.
 
 ## MCP Clients
 
-_MCP client docs are coming soon..._
+<Columns cols={2}>
+  <Card
+    title='Cursor'
+    href='/marketplace/mcp-clients/cursor'
+    icon='https://agentic.so/assets/mcp-clients/cursor-icon-light.svg'
+  >
+    How to use Agentic tools with Cursor.
+  </Card>
+
+<Card
+  title='Claude Code'
+  href='/marketplace/mcp-clients/claude-code'
+  icon='https://agentic.so/assets/mcp-clients/anthropic-icon-light.svg'
+>
+  How to use Agentic tools with Claude Code.
+</Card>
+
+<Card
+  title='Claude Desktop'
+  href='/marketplace/mcp-clients/claude-desktop'
+  icon='https://agentic.so/assets/mcp-clients/anthropic-icon-light.svg'
+>
+  How to use Agentic tools with Claude Desktop.
+</Card>
+
+<Card
+  title='Cline'
+  href='/marketplace/mcp-clients/cline'
+  icon='https://agentic.so/assets/mcp-clients/cline-icon-light.png'
+>
+  How to use Agentic tools with Cline.
+</Card>
+
+<Card
+  title='Raycast'
+  href='/marketplace/mcp-clients/raycast'
+  icon='https://agentic.so/assets/mcp-clients/raycast-icon-light.svg'
+>
+  How to use Agentic tools with Raycast.
+</Card>
+
+<Card
+  title='Trae'
+  href='/marketplace/mcp-clients/trae'
+  icon='https://agentic.so/assets/mcp-clients/trae-icon-light.svg'
+>
+  How to use Agentic tools with Trae.
+</Card>
+
+<Card
+  title='VS Code'
+  href='/marketplace/mcp-clients/vscode'
+  icon='https://agentic.so/assets/mcp-clients/vscode-icon-light.svg'
+>
+  How to use Agentic tools with VS Code.
+</Card>
+
+<Card
+  title='Warp'
+  href='/marketplace/mcp-clients/warp'
+  icon='https://agentic.so/assets/mcp-clients/warp-icon-light.png'
+>
+  How to use Agentic tools with Warp.
+</Card>
+
+<Card
+  title='Windsurf'
+  href='/marketplace/mcp-clients/windsurf'
+  icon='https://agentic.so/assets/mcp-clients/windsurf-icon-light.svg'
+>
+  How to use Agentic tools with Windsurf.
+</Card>
+
+</Columns>
 
 ## Python AI SDKs
 

docs/marketplace/mcp-clients/claude-code.mdx

@@ -0,0 +1,12 @@
+---
+title: Claude Code
+description: How to use Agentic tools with Claude Code as an MCP client.
+---
+
+See [Claude Code MCP docs](https://docs.anthropic.com/en/docs/claude-code/mcp) for more info.
+
+## Example
+
+```sh
+claude mcp add --transport http "@agentic/search" "https://gateway.agentic.so/@agentic/search/mcp"
+```

docs/marketplace/mcp-clients/claude-desktop.mdx

@@ -0,0 +1,27 @@
+---
+title: Claude Desktop
+description: How to use Agentic tools with Claude Desktop as an MCP client.
+---
+
+Claude Desktop requires you to use [mcp-remote](https://github.com/geelen/mcp-remote) because it currently only supports local `stdio` MCP servers.
+
+## Example
+
+```json
+{
+  "mcpServers": {
+    "@agentic/search": {
+      "command": "npx",
+      "args": [
+        "-y",
+        "mcp-remote",
+        "https://gateway.agentic.so/@agentic/search/mcp"
+      ]
+    }
+  }
+}
+```
+
+## DXT
+
+Agentic tools don't currently support Anthropic's [Desktop Extensions (DXT)](https://www.anthropic.com/engineering/desktop-extensions) format.

docs/marketplace/mcp-clients/cline.mdx

@@ -0,0 +1,19 @@
+---
+title: Cline
+description: How to use Agentic tools with Cline as an MCP client.
+---
+
+## Example
+
+```json
+{
+  "mcpServers": {
+    "@agentic/search": {
+      "url": "https://gateway.agentic.so/@agentic/search/mcp",
+      "disabled": false
+    }
+  }
+}
+```
+
+See the [Cline MCP docs](https://docs.cline.bot/mcp/connecting-to-a-remote-server) for more details.

docs/marketplace/mcp-clients/cursor.mdx

@@ -0,0 +1,20 @@
+---
+title: Cursor
+description: How to use Agentic tools with Cursor as an MCP client.
+---
+
+Go to: `Settings` -> `Cursor Settings` -> `MCP` -> `Add new global MCP server`
+
+Pasting the following configuration into your Cursor `~/.cursor/mcp.json` file is the recommended approach. You may also install in a specific project by creating `.cursor/mcp.json` in your project folder. See [Cursor MCP docs](https://docs.cursor.com/context/model-context-protocol) for more info.
+
+## Example
+
+```json
+{
+  "mcpServers": {
+    "@agentic/search": {
+      "url": "https://gateway.agentic.so/@agentic/search/mcp"
+    }
+  }
+}
+```

docs/marketplace/mcp-clients/raycast.mdx

@@ -0,0 +1,28 @@
+---
+title: Raycast
+description: How to use Agentic tools with Raycast as an MCP client.
+---
+
+## Example
+
+```json
+{
+  "mcpServers": {
+    "@agentic/search": {
+      "url": "https://gateway.agentic.so/@agentic/search/mcp"
+    }
+  }
+}
+```
+
+## Raycast Deep Link
+
+<Frame>
+  <img
+    src='https://agentic.so/assets/mcp-clients/raycast-screenshot.jpg'
+    alt='Raycast Deep Link'
+    className='w-full rounded-lg overflow-hidden'
+  />
+</Frame>
+
+See the [Raycast MCP docs](https://manual.raycast.com/model-context-protocol) for more details.

docs/marketplace/mcp-clients/trae.mdx

@@ -0,0 +1,20 @@
+---
+title: Trae
+description: How to use Agentic tools with Trae as an MCP client.
+---
+
+Use the Add manually feature and fill in the JSON configuration information for that MCP server.
+
+For more details, visit the [Trae documentation](https://docs.trae.ai/ide/model-context-protocol?_lang=en).
+
+## Example
+
+```json
+{
+  "mcpServers": {
+    "@agentic/search": {
+      "url": "https://gateway.agentic.so/@agentic/search/mcp"
+    }
+  }
+}
+```

docs/marketplace/mcp-clients/vscode.mdx

@@ -0,0 +1,19 @@
+---
+title: VS Code
+description: How to use Agentic tools with VS Code as an MCP client.
+---
+
+Add the given JSON to your VS Code MCP config file. See [VS Code MCP docs](https://code.visualstudio.com/docs/copilot/chat/mcp-servers) for more info.
+
+## Example
+
+```json
+"mcp": {
+  "servers": {
+    "@agentic/search": {
+      "type": "http",
+      "url": "https://gateway.agentic.so/@agentic/search/mcp"
+    }
+  }
+}
+```

docs/marketplace/mcp-clients/warp.mdx

@@ -0,0 +1,18 @@
+---
+title: Warp
+description: How to use Agentic tools with Warp as an MCP client.
+---
+
+## Example
+
+```json
+{
+  "mcpServers": {
+    "@agentic/search": {
+      "url": "https://gateway.agentic.so/@agentic/search/mcp"
+    }
+  }
+}
+```
+
+See the [Warp MCP docs](https://docs.warp.dev/knowledge-and-collaboration/mcp#adding-an-mcp-server) for more details.

docs/marketplace/mcp-clients/windsurf.mdx

@@ -0,0 +1,23 @@
+---
+title: Windsurf
+description: How to use Agentic tools with Windsurf as an MCP client.
+---
+
+Windsurf requires you to use [mcp-remote](https://github.com/geelen/mcp-remote) because [they do not support the Streamable HTTP Transport](https://docs.windsurf.com/windsurf/cascade/mcp).
+
+## Example
+
+```json
+{
+  "mcpServers": {
+    "@agentic/search": {
+      "command": "npx",
+      "args": [
+        "-y",
+        "mcp-remote",
+        "https://gateway.agentic.so/@agentic/search/mcp"
+      ]
+    }
+  }
+}
+```

todo.md

@@ -143,3 +143,6 @@
 - fix readme css <img height="..."> not taking effect because of tailwind css preflight which sets `img, video { height: auto }`
   - we still want this for every other scenario; just want to sandbox the github-style readme markdown css...
 - add `--llm` flag to cli (https://x.com/badlogicgames/status/1940370344990441726)
+- support claude Desktop Extensions ([DXT](https://github.com/anthropics/dxt)) ([post](https://www.anthropic.com/engineering/desktop-extensions))
+- add mcp-remote to support stdio-only mcp clients like claude desktop
+- add docs on how to use with [chatgpt's mcp custom connectors](https://platform.openai.com/docs/mcp) ([requires pro account or team/enterprise/edu workspace](https://help.openai.com/en/articles/11487775-connectors-in-chatgpt#h_d2a53d4230))