From f090e2e6ae5de5f80544b6572b35689dd6b34815 Mon Sep 17 00:00:00 2001 From: Khaleel Al-Adhami Date: Wed, 29 Apr 2026 18:04:48 -0700 Subject: [PATCH 1/2] update mcp docs --- docs/ai_builder/integrations/ai_onboarding.md | 2 +- .../integrations/mcp_installation.md | 29 +++------ docs/ai_builder/integrations/mcp_overview.md | 2 +- .../docs/mcp_installation.md | 65 ------------------- .../integrations_docs/docs/mcp_overview.md | 21 ------ 5 files changed, 11 insertions(+), 108 deletions(-) delete mode 100644 packages/integrations-docs/src/integrations_docs/docs/mcp_installation.md delete mode 100644 packages/integrations-docs/src/integrations_docs/docs/mcp_overview.md diff --git a/docs/ai_builder/integrations/ai_onboarding.md b/docs/ai_builder/integrations/ai_onboarding.md index 16dc484b96f..009d2a2835a 100644 --- a/docs/ai_builder/integrations/ai_onboarding.md +++ b/docs/ai_builder/integrations/ai_onboarding.md @@ -102,7 +102,7 @@ The index groups docs by section and links to agent-friendly Markdown assets. Use MCP when your editor or agent can call tools for structured documentation and component lookup: ```text -https://mcp.reflex.dev/mcp +https://build.reflex.dev/mcp ``` See the [MCP overview](/docs/ai/integrations/mcp-overview/) and [MCP installation](/docs/ai/integrations/mcp-installation/) guides for details. diff --git a/docs/ai_builder/integrations/mcp_installation.md b/docs/ai_builder/integrations/mcp_installation.md index 41fb1d21639..3abf79dae75 100644 --- a/docs/ai_builder/integrations/mcp_installation.md +++ b/docs/ai_builder/integrations/mcp_installation.md @@ -27,49 +27,38 @@ The Reflex MCP server uses OAuth 2.1 protocol for secure authentication. You'll Add the Reflex MCP server to Claude Code by running: ```bash -claude mcp add --transport http reflex https://mcp.reflex.dev/mcp +claude mcp add --transport http reflex https://build.reflex.dev/mcp ``` Then authenticate by running the `/mcp` command inside Claude Code and following the login steps in your browser. Authentication tokens are stored securely and refreshed automatically. See the [Claude Code MCP documentation](https://code.claude.com/docs/en/mcp) for more details. ### Claude Desktop -Add the Reflex MCP server to your Claude Desktop configuration by editing your configuration file: - -```json -{ - "mcpServers": { - "reflex": { - "command": "npx", - "args": ["-y", "mcp-remote", "https://mcp.reflex.dev/mcp"] - } - } -} -``` +Claude Desktop pulls remote MCP servers from your Claude account's connectors. Go to [claude.ai](https://claude.ai) → **Settings** → **Connectors** → **Add custom connector**, enter `https://build.reflex.dev/mcp` as the URL, and complete the OAuth login. The connector will then be available in Claude Desktop after you sign in. See the [custom connectors guide](https://support.claude.com/en/articles/11175166-get-started-with-custom-connectors-using-remote-mcp) for details and plan availability. ### Windsurf/Cascade -Create a `.vscode/mcp.json` file in your project root: +Edit (or create) `~/.codeium/windsurf/mcp_config.json` and add the Reflex server: ```json { "mcpServers": { "reflex": { - "serverType": "http", - "url": "https://mcp.reflex.dev/mcp" + "serverUrl": "https://build.reflex.dev/mcp" } } } ``` +After saving, open Cascade and click the refresh icon in the MCP toolbar to load the new server. See the [Windsurf MCP documentation](https://docs.windsurf.com/windsurf/cascade/mcp) for more details. + ### Codex -Add this configuration to your `~/.codex/config.toml` file: +Add this to your `~/.codex/config.toml` file: ```toml [mcp_servers.reflex] -command = "npx" -args = ["-y", "mcp-remote", "https://mcp.reflex.dev/mcp"] +url = "https://build.reflex.dev/mcp" ``` -Note: Codex requires MCP servers to communicate over stdio. The `mcp-remote` package bridges the connection to the HTTP-based Reflex MCP server. +See the [Codex MCP documentation](https://developers.openai.com/codex/mcp) for additional options such as `bearer_token_env_var` and `http_headers`. diff --git a/docs/ai_builder/integrations/mcp_overview.md b/docs/ai_builder/integrations/mcp_overview.md index f75b97cf97f..0fa1981660a 100644 --- a/docs/ai_builder/integrations/mcp_overview.md +++ b/docs/ai_builder/integrations/mcp_overview.md @@ -10,7 +10,7 @@ import reflex as rx The Reflex [Model Context Protocol (MCP)](https://modelcontextprotocol.io/) integration provides AI assistants and coding tools with structured access to Reflex framework documentation and component information. This enables intelligent assistance while developing Reflex applications. -The Reflex MCP server is deployed at `https://mcp.reflex.dev/mcp` and provides access to component documentation and Reflex documentation through standardized MCP tools. +The Reflex MCP server is deployed at `https://build.reflex.dev/mcp` and provides access to component documentation and Reflex documentation through standardized MCP tools. ## Available Tools diff --git a/packages/integrations-docs/src/integrations_docs/docs/mcp_installation.md b/packages/integrations-docs/src/integrations_docs/docs/mcp_installation.md deleted file mode 100644 index b5267837069..00000000000 --- a/packages/integrations-docs/src/integrations_docs/docs/mcp_installation.md +++ /dev/null @@ -1,65 +0,0 @@ -# Installation - -```python exec -import reflex as rx -``` - -```md alert warning -# The Reflex MCP integration is currently only available for enterprise customers. Please [book a demo](https://reflex.dev/pricing/) to discuss access. -``` - -To use the Reflex MCP integration, you'll need to configure your AI assistant or coding tool to connect to the Reflex MCP server. No additional Python packages are required on your local machine - the server is hosted and ready to use. - -## Prerequisites - -- An MCP-compatible AI tool (Claude Desktop, Windsurf, Codex, etc.) -- Internet connection to access the hosted MCP server -- Valid Reflex account for OAuth 2.1 authentication - -## Authentication - -The Reflex MCP server uses OAuth 2.1 protocol for secure authentication. You'll need a valid Reflex account, and authentication is handled automatically through your MCP client configuration when you provide your Reflex credentials. - -## IDE and Coding Assistant Integration - -### Claude Desktop - -Add the Reflex MCP server to your Claude Desktop configuration by editing your configuration file: - -```json -{ - "mcpServers": { - "reflex": { - "command": "npx", - "args": ["-y", "mcp-remote", "https://mcp.reflex.dev/mcp"] - } - } -} -``` - -### Windsurf/Cascade - -Create a `.vscode/mcp.json` file in your project root: - -```json -{ - "mcpServers": { - "reflex": { - "serverType": "http", - "url": "https://mcp.reflex.dev/mcp" - } - } -} -``` - -### Codex - -Add this configuration to your `~/.codex/config.toml` file: - -```toml -[mcp_servers.reflex] -command = "npx" -args = ["-y", "mcp-remote", "https://mcp.reflex.dev/mcp"] -``` - -Note: Codex requires MCP servers to communicate over stdio. The `mcp-remote` package bridges the connection to the HTTP-based Reflex MCP server. diff --git a/packages/integrations-docs/src/integrations_docs/docs/mcp_overview.md b/packages/integrations-docs/src/integrations_docs/docs/mcp_overview.md deleted file mode 100644 index f75b97cf97f..00000000000 --- a/packages/integrations-docs/src/integrations_docs/docs/mcp_overview.md +++ /dev/null @@ -1,21 +0,0 @@ -# Overview - -```python exec -import reflex as rx -``` - -```md alert warning -# The Reflex MCP integration is currently only available for enterprise customers. Please [book a demo](https://reflex.dev/pricing/) to discuss access. -``` - -The Reflex [Model Context Protocol (MCP)](https://modelcontextprotocol.io/) integration provides AI assistants and coding tools with structured access to Reflex framework documentation and component information. This enables intelligent assistance while developing Reflex applications. - -The Reflex MCP server is deployed at `https://mcp.reflex.dev/mcp` and provides access to component documentation and Reflex documentation through standardized MCP tools. - -## Available Tools - -The Reflex MCP server provides tools for accessing component documentation and Reflex documentation through standardized MCP capabilities. - -## Enterprise Use - -For enterprise customers requiring on-premises deployment of the Reflex MCP server, please [book a demo](https://reflex.dev/pricing/) to discuss your requirements. From e29153dc9669b1f663d76892176d0955041439a3 Mon Sep 17 00:00:00 2001 From: Khaleel Al-Adhami Date: Thu, 30 Apr 2026 11:06:35 -0700 Subject: [PATCH 2/2] add more agents to doc --- .../integrations/mcp_installation.md | 89 ++++++++++++++++--- 1 file changed, 78 insertions(+), 11 deletions(-) diff --git a/docs/ai_builder/integrations/mcp_installation.md b/docs/ai_builder/integrations/mcp_installation.md index 3abf79dae75..6e9baf1f4c7 100644 --- a/docs/ai_builder/integrations/mcp_installation.md +++ b/docs/ai_builder/integrations/mcp_installation.md @@ -12,7 +12,7 @@ To use the Reflex MCP integration, you'll need to configure your AI assistant or ## Prerequisites -- An MCP-compatible AI tool (Claude Desktop, Windsurf, Codex, etc.) +- An MCP-compatible AI tool (Claude Code, Claude Desktop, Codex, Cursor, Gemini CLI, GitHub Copilot, OpenCode, Windsurf, etc.) - Internet connection to access the hosted MCP server - Valid Reflex account for OAuth 2.1 authentication @@ -36,29 +36,96 @@ Then authenticate by running the `/mcp` command inside Claude Code and following Claude Desktop pulls remote MCP servers from your Claude account's connectors. Go to [claude.ai](https://claude.ai) → **Settings** → **Connectors** → **Add custom connector**, enter `https://build.reflex.dev/mcp` as the URL, and complete the OAuth login. The connector will then be available in Claude Desktop after you sign in. See the [custom connectors guide](https://support.claude.com/en/articles/11175166-get-started-with-custom-connectors-using-remote-mcp) for details and plan availability. -### Windsurf/Cascade +### Codex -Edit (or create) `~/.codeium/windsurf/mcp_config.json` and add the Reflex server: +Add the Reflex MCP server to Codex by running: + +```bash +codex mcp add reflex --url https://build.reflex.dev/mcp +``` + +See the [Codex MCP documentation](https://developers.openai.com/codex/mcp) for more details. + +### Cursor + +[Click here to install the Reflex MCP server in Cursor](cursor://anysphere.cursor-deeplink/mcp/install?name=reflex&config=eyJ1cmwiOiJodHRwczovL2J1aWxkLnJlZmxleC5kZXYvbWNwIn0=), or edit (or create) `~/.cursor/mcp.json` for a global config, or `.cursor/mcp.json` in your project root for a project-specific config: ```json { "mcpServers": { "reflex": { - "serverUrl": "https://build.reflex.dev/mcp" + "url": "https://build.reflex.dev/mcp" } } } ``` -After saving, open Cascade and click the refresh icon in the MCP toolbar to load the new server. See the [Windsurf MCP documentation](https://docs.windsurf.com/windsurf/cascade/mcp) for more details. +Open Cursor settings under **MCP & Integrations** to verify the server is connected and complete OAuth login. See the [Cursor MCP documentation](https://cursor.com/docs/context/mcp) for more details. -### Codex +### Gemini CLI -Add this to your `~/.codex/config.toml` file: +Add the Reflex MCP server to `~/.gemini/settings.json`: -```toml -[mcp_servers.reflex] -url = "https://build.reflex.dev/mcp" +```json +{ + "mcpServers": { + "reflex": { + "httpUrl": "https://build.reflex.dev/mcp" + } + } +} ``` -See the [Codex MCP documentation](https://developers.openai.com/codex/mcp) for additional options such as `bearer_token_env_var` and `http_headers`. +See the [Gemini CLI MCP documentation](https://google-gemini.github.io/gemini-cli/docs/tools/mcp-server.html) for more details. + +### GitHub Copilot + +Create a `.vscode/mcp.json` file in your project root (or open **MCP: Open User Configuration** from the VS Code command palette for a global config): + +```json +{ + "servers": { + "reflex": { + "type": "http", + "url": "https://build.reflex.dev/mcp" + } + } +} +``` + +After saving, start the server from the inline action above the entry in `mcp.json`, then complete the OAuth login when prompted. See the [VS Code MCP documentation](https://code.visualstudio.com/docs/copilot/customization/mcp-servers) for more details. + +### OpenCode + +Add the Reflex MCP server to your `opencode.json` (project) or `~/.config/opencode/opencode.json` (global): + +```json +{ + "$schema": "https://opencode.ai/config.json", + "mcp": { + "reflex": { + "type": "remote", + "url": "https://build.reflex.dev/mcp", + "enabled": true + } + } +} +``` + +See the [OpenCode MCP documentation](https://opencode.ai/docs/mcp-servers/) for more details. + +### Windsurf + +Edit (or create) `~/.codeium/windsurf/mcp_config.json` and add the Reflex server: + +```json +{ + "mcpServers": { + "reflex": { + "serverUrl": "https://build.reflex.dev/mcp" + } + } +} +``` + +After saving, open Cascade and click the refresh icon in the MCP toolbar to load the new server. See the [Windsurf MCP documentation](https://docs.windsurf.com/windsurf/cascade/mcp) for more details.