From 5aec9eebbd7077a4e0e7537230bad884ee85eeac Mon Sep 17 00:00:00 2001
From: Jah-yee <jah.yee@gmail.com>
Date: Fri, 13 Mar 2026 19:50:54 +0800
Subject: [PATCH] fix: support 'mcp' as command-line argument

- Add 'mcp' to AGENTS array in templates.ts
- Add 'mcp' to AGENT_NAMES
- Simplify AgentIntegration type (mcp is now part of Agent)
- Add MCP handling in add.ts when passed as argument
- Update script template functions to handle 'mcp' specially
- Filter 'mcp' from PROVIDERS (no npm package needed)
- Update success message for non-interactive mode

Fixes: #240
---
 packages/cli/src/commands/add.ts    | 22 ++++++++++++++++++++--
 packages/cli/src/utils/templates.ts | 17 +++++++++--------
 2 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/packages/cli/src/commands/add.ts b/packages/cli/src/commands/add.ts
index bd10a45b9..03c2fd56a 100644
--- a/packages/cli/src/commands/add.ts
+++ b/packages/cli/src/commands/add.ts
@@ -82,8 +82,7 @@ export const add = new Command()
 
       if (availableAgents.length === 0 && isNonInteractive && !agentArg) {
         logger.break();
-        logger.success("All legacy agents are already installed.");
-        logger.log("Run without -y to add MCP.");
+        logger.success("All agents are already installed.");
         logger.break();
         process.exit(0);
       }
@@ -111,6 +110,25 @@ export const add = new Command()
 
         agentIntegration = validAgent;
 
+        // Handle MCP specially - it needs server configuration, not package installation
+        if (validAgent === "mcp") {
+          const mcpSpinner = spinner("Installing MCP server.").start();
+          const didInstall = await promptMcpInstall();
+          if (!didInstall) {
+            mcpSpinner.fail();
+            logger.break();
+            process.exit(1);
+          }
+          mcpSpinner.succeed();
+          logger.break();
+          logger.log(
+            `${highlighter.success("Success!")} MCP server has been configured.`,
+          );
+          logger.log("Restart your agents to activate.");
+          logger.break();
+          projectInfo.installedAgents = [...projectInfo.installedAgents, "mcp"];
+        }
+
         if (projectInfo.installedAgents.length > 0 && !isNonInteractive) {
           const installedNames = formatInstalledAgentNames(
             projectInfo.installedAgents,
diff --git a/packages/cli/src/utils/templates.ts b/packages/cli/src/utils/templates.ts
index 22e55f7e5..6562734cb 100644
--- a/packages/cli/src/utils/templates.ts
+++ b/packages/cli/src/utils/templates.ts
@@ -8,11 +8,12 @@ export const AGENTS = [
   "ami",
   "droid",
   "copilot",
+  "mcp",
 ] as const;
 
 export type Agent = (typeof AGENTS)[number];
 
-export type AgentIntegration = Agent | "mcp" | "none";
+export type AgentIntegration = Agent | "none";
 
 export const AGENT_NAMES: Record<Agent, string> = {
   "claude-code": "Claude Code",
@@ -24,17 +25,17 @@ export const AGENT_NAMES: Record<Agent, string> = {
   ami: "Ami",
   droid: "Droid",
   copilot: "Copilot",
+  mcp: "MCP",
 };
 
 export const getAgentDisplayName = (agent: string): string => {
-  if (agent === "mcp") return "MCP";
   if (agent in AGENT_NAMES) {
     return AGENT_NAMES[agent as Agent];
   }
   return agent;
 };
 
-export const PROVIDERS = AGENTS.filter((agent) => agent !== "ami").map(
+export const PROVIDERS = AGENTS.filter((agent) => agent !== "ami" && agent !== "mcp").map(
   (agent) => `@react-grab/${agent}` as const,
 );
 
@@ -49,7 +50,7 @@ export const NEXT_APP_ROUTER_SCRIPT = `{process.env.NODE_ENV === "development" &
 export const NEXT_APP_ROUTER_SCRIPT_WITH_AGENT = (
   agent: AgentIntegration,
 ): string => {
-  if (agent === "none") return NEXT_APP_ROUTER_SCRIPT;
+  if (agent === "none" || agent === "mcp") return NEXT_APP_ROUTER_SCRIPT;
 
   return `{process.env.NODE_ENV === "development" && (
           <Script
@@ -77,7 +78,7 @@ export const NEXT_PAGES_ROUTER_SCRIPT = `{process.env.NODE_ENV === "development"
 export const NEXT_PAGES_ROUTER_SCRIPT_WITH_AGENT = (
   agent: AgentIntegration,
 ): string => {
-  if (agent === "none") return NEXT_PAGES_ROUTER_SCRIPT;
+  if (agent === "none" || agent === "mcp") return NEXT_PAGES_ROUTER_SCRIPT;
 
   return `{process.env.NODE_ENV === "development" && (
           <Script
@@ -101,7 +102,7 @@ export const VITE_SCRIPT = `<script type="module">
     </script>`;
 
 export const VITE_SCRIPT_WITH_AGENT = (agent: AgentIntegration): string => {
-  if (agent === "none") return VITE_SCRIPT;
+  if (agent === "none" || agent === "mcp") return VITE_SCRIPT;
 
   return `<script type="module">
       if (import.meta.env.DEV) {
@@ -116,7 +117,7 @@ export const WEBPACK_IMPORT = `if (process.env.NODE_ENV === "development") {
 }`;
 
 export const WEBPACK_IMPORT_WITH_AGENT = (agent: AgentIntegration): string => {
-  if (agent === "none") return WEBPACK_IMPORT;
+  if (agent === "none" || agent === "mcp") return WEBPACK_IMPORT;
 
   return `if (process.env.NODE_ENV === "development") {
   import("react-grab");
@@ -131,7 +132,7 @@ export const TANSTACK_EFFECT = `useEffect(() => {
   }, []);`;
 
 export const TANSTACK_EFFECT_WITH_AGENT = (agent: AgentIntegration): string => {
-  if (agent === "none") return TANSTACK_EFFECT;
+  if (agent === "none" || agent === "mcp") return TANSTACK_EFFECT;
 
   return `useEffect(() => {
     if (import.meta.env.DEV) {