[v5] feat(web): Add MCP settings page (#1231)

Author: brendan-kellam

packages/web/package.json

@@ -175,7 +175,7 @@
     "react-dom": "19.2.4",
     "react-hook-form": "^7.53.0",
     "react-hotkeys-hook": "^4.5.1",
-    "react-icons": "^5.3.0",
+    "react-icons": "^5.6.0",
     "react-markdown": "^10.1.0",
     "react-resizable-panels": "^2.1.1",
     "recharts": "^2.15.3",

packages/web/public/claude_code.svg

@@ -23,9 +23,11 @@ import {
     UserIcon,
     UsersIcon,
 } from "lucide-react";
+import { VscMcp } from "react-icons/vsc";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 import { UpgradeBadge } from "../upgradeBadge";
+import { IconType } from "react-icons/lib";
 
 const iconMap = {
     "link": LinkIcon,
@@ -37,7 +39,8 @@ const iconMap = {
     "scroll-text": ScrollTextIcon,
     "settings": Settings2Icon,
     "user": UserIcon,
-} satisfies Record<string, LucideIcon>;
+    "mcp": VscMcp,
+} satisfies Record<string, LucideIcon | IconType>;
 
 export type NavIconName = keyof typeof iconMap;
 

packages/web/public/codex.svg

@@ -82,6 +82,11 @@ export const getSidebarNavGroups = async () =>
                             icon: "link" as const,
                         }
                     ] : []),
+                    {
+                        title: "MCP Server",
+                        href: `/settings/mcp`,
+                        icon: 'mcp' as const,
+                    }
                 ],
             },
         ];