From 15541adeb744002833b3a8b8533bc84c89cec881 Mon Sep 17 00:00:00 2001
From: NianJiuZst <3235467914@qq.com>
Date: Tue, 11 Aug 2026 22:23:01 +0800
Subject: [PATCH] Fix MCP OAuth Connect permission gating

---
 .../admin/capabilities/MarketplaceTab.tsx     |  3 ++
 .../src/pages/admin/capabilities/index.tsx    |  1 +
 .../mcp-directory/MCPDirectory.tsx            |  7 ++-
 .../mcp-directory/MCPDirectoryCard.tsx        |  7 +--
 .../mcp-directory/MCPDirectoryDetail.tsx      |  6 ++-
 tests/e2e/mcp-directory.spec.ts               | 43 ++++++++++++++++++-
 6 files changed, 59 insertions(+), 8 deletions(-)

diff --git a/apps/web/src/pages/admin/capabilities/MarketplaceTab.tsx b/apps/web/src/pages/admin/capabilities/MarketplaceTab.tsx
index 9fdfc5e..9a2606c 100644
--- a/apps/web/src/pages/admin/capabilities/MarketplaceTab.tsx
+++ b/apps/web/src/pages/admin/capabilities/MarketplaceTab.tsx
@@ -19,6 +19,7 @@ interface MarketplaceTabProps {
   query: string
   typeFilter: "mcp" | "skill"
   canImport: boolean
+  canConnect: boolean
   canManage: boolean
   onSelectItem: (id: string | null) => void
   onInstall: (capability: MarketplaceCapability) => void
@@ -33,6 +34,7 @@ export function MarketplaceTab(props: MarketplaceTabProps) {
       itemID={mcpItemID}
       query={props.query}
       canImport={props.canImport}
+      canConnect={props.canConnect}
       onSelectItem={(id) => props.onSelectItem(id ? `mcp:${id}` : null)}
       onSelectMarketplaceItem={props.onSelectItem}
       onInstallMarketplace={props.onInstall}
@@ -54,6 +56,7 @@ export function MarketplaceTab(props: MarketplaceTabProps) {
     itemID={null}
     query={props.query}
     canImport={props.canImport}
+    canConnect={props.canConnect}
     onSelectItem={(id) => props.onSelectItem(id ? `mcp:${id}` : null)}
     onSelectMarketplaceItem={props.onSelectItem}
     onInstallMarketplace={props.onInstall}
diff --git a/apps/web/src/pages/admin/capabilities/index.tsx b/apps/web/src/pages/admin/capabilities/index.tsx
index 07884cc..fd8b506 100644
--- a/apps/web/src/pages/admin/capabilities/index.tsx
+++ b/apps/web/src/pages/admin/capabilities/index.tsx
@@ -281,6 +281,7 @@ export function CapabilitiesPage() {
           query={query}
           typeFilter={typeFilter}
           canImport={canImportDirectory}
+          canConnect={isAdmin}
           canManage={isAdmin}
           onSelectItem={(item) => navigate("capabilities", { tab: "marketplace", item })}
           onInstall={goToAgentsForCapability}
diff --git a/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectory.tsx b/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectory.tsx
index 49179a6..dd8fcb9 100644
--- a/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectory.tsx
+++ b/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectory.tsx
@@ -25,6 +25,7 @@ interface MCPDirectoryProps {
   itemID: string | null
   query: string
   canImport: boolean
+  canConnect: boolean
   onSelectItem: (id: string | null) => void
   onSelectMarketplaceItem: (id: string | null) => void
   onInstallMarketplace: (capability: MarketplaceCapability) => void
@@ -37,6 +38,7 @@ export function MCPDirectory({
   itemID,
   query,
   canImport,
+  canConnect,
   onSelectItem,
   onSelectMarketplaceItem,
   onInstallMarketplace,
@@ -106,7 +108,7 @@ export function MCPDirectory({
 	}, [detailQ, directoryQ])
 
 	const connectOAuth = (id: string) => {
-		if (!workspaceID) return
+		if (!workspaceID || !canConnect) return
 		setOAuthError(false)
 		const width = 620
 		const height = 760
@@ -172,6 +174,7 @@ export function MCPDirectory({
           loading={detailQ.isLoading}
           error={detailQ.error}
           canImport={canImport}
+          canConnect={canConnect}
           onBack={() => onSelectItem(null)}
           onRetry={() => void detailQ.refetch()}
           onImport={() => requestImport(itemID)}
@@ -228,7 +231,7 @@ export function MCPDirectory({
       ) : cards.length > 0 ? (
         <div className="grid gap-3 md:grid-cols-2 xl:grid-cols-3" data-testid="mcp-marketplace-grid">
           {cards.map((card) => card.kind === "directory" ? (
-            <DirectoryCard key={`directory:${card.item.id}`} item={card.item} canImport={canImport} onOpen={() => onSelectItem(card.item.id)} onImport={() => requestImport(card.item.id)} onConnect={() => connectOAuth(card.item.id)} onViewCapability={onViewCapability} />
+            <DirectoryCard key={`directory:${card.item.id}`} item={card.item} canImport={canImport} canConnect={canConnect} onOpen={() => onSelectItem(card.item.id)} onImport={() => requestImport(card.item.id)} onConnect={() => connectOAuth(card.item.id)} onViewCapability={onViewCapability} />
           ) : (
             <MarketplaceMCPCard key={`marketplace:${card.item.id}`} capability={card.item} canManage={canManageMarketplace} onOpen={() => onSelectMarketplaceItem(card.item.id)} onInstall={() => onInstallMarketplace(card.item)} onDelete={() => onDeleteMarketplace(card.item)} onViewCapability={() => onViewCapability(card.item.id)} />
           ))}
diff --git a/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryCard.tsx b/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryCard.tsx
index 70bdba3..f4151c2 100644
--- a/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryCard.tsx
+++ b/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryCard.tsx
@@ -6,9 +6,10 @@ import { Button } from "../../../../components/ui/button"
 import { marketplaceSourceName, type MCPDirectoryItem, type MarketplaceCapability } from "../../../../lib/api-marketplace"
 import { ConnectorIcon, VerifiedBadge } from "./shared"
 
-export function DirectoryCard({ item, canImport, onOpen, onImport, onConnect, onViewCapability }: {
+export function DirectoryCard({ item, canImport, canConnect, onOpen, onImport, onConnect, onViewCapability }: {
   item: MCPDirectoryItem
   canImport: boolean
+  canConnect: boolean
   onOpen: () => void
   onImport: () => void
 	onConnect: () => void
@@ -43,8 +44,8 @@ export function DirectoryCard({ item, canImport, onOpen, onImport, onConnect, on
             <Check className="h-3.5 w-3.5" /> {t("capabilities.mcpDirectory.actions.installed")}
           </Button>
         ) : item.authentication === "oauth2" && !item.connected ? (
-		  <Button className="w-full" size="sm" onClick={onConnect}>
-			{t("capabilities.mcpDirectory.oauth.connect")}
+		  <Button className="w-full" size="sm" disabled={!canConnect} title={!canConnect ? t("capabilities.permission.adminOnly") : undefined} onClick={onConnect}>
+			{canConnect ? t("capabilities.mcpDirectory.oauth.connect") : t("capabilities.permission.adminOnly")}
 		  </Button>
 		) : (
           <Button className="w-full" size="sm" disabled={!canImport} title={!canImport ? t("capabilities.permission.adminOnly") : undefined} onClick={onImport}>
diff --git a/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryDetail.tsx b/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryDetail.tsx
index ad6a61c..1a08061 100644
--- a/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryDetail.tsx
+++ b/apps/web/src/pages/admin/capabilities/mcp-directory/MCPDirectoryDetail.tsx
@@ -14,6 +14,7 @@ export function DirectoryDetail({
   loading,
   error,
   canImport,
+  canConnect,
   onBack,
   onRetry,
   onImport,
@@ -24,6 +25,7 @@ export function DirectoryDetail({
   loading: boolean
   error: unknown
   canImport: boolean
+  canConnect: boolean
   onBack: () => void
   onRetry: () => void
   onImport: () => void
@@ -136,8 +138,8 @@ export function DirectoryDetail({
         </div>
         <div className="mt-5 flex flex-wrap justify-end gap-2 border-t border-line pt-4">
 		  {item.authentication === "oauth2" && !item.connected ? (
-			<Button size="sm" onClick={onConnect}>
-			  {t("capabilities.mcpDirectory.oauth.connect")}
+			<Button size="sm" disabled={!canConnect} title={!canConnect ? t("capabilities.permission.adminOnly") : undefined} onClick={onConnect}>
+			  {canConnect ? t("capabilities.mcpDirectory.oauth.connect") : t("capabilities.permission.adminOnly")}
 			</Button>
 		  ) : item.installed && item.installed_capability_id ? (
             <Button
diff --git a/tests/e2e/mcp-directory.spec.ts b/tests/e2e/mcp-directory.spec.ts
index d734884..a55d665 100644
--- a/tests/e2e/mcp-directory.spec.ts
+++ b/tests/e2e/mcp-directory.spec.ts
@@ -2,6 +2,7 @@ import { expect, test, type Page, type Route } from "@playwright/test";
 
 const WORKSPACE_ID = "00000000-0000-0000-0000-000000000011";
 const CAPABILITY_ID = "00000000-0000-0000-0000-000000000033";
+type WorkspaceRole = "owner" | "admin" | "member" | "viewer";
 
 const directoryItems = [
   connector("context7", "Context7", "Documentation", 1),
@@ -69,6 +70,43 @@ test("retries a failed connector directory request", async ({ page }) => {
   await expect(page.getByTestId("mcp-directory-card")).toHaveCount(3);
 });
 
+test("allows workspace admins to start MCP OAuth", async ({ page }) => {
+  await mockApp(page, oauthDirectory, "admin");
+  await page.goto(`/?admin=capabilities&tab=marketplace&ws=${WORKSPACE_ID}`);
+
+  const card = page.locator('[data-catalog-id="notion"]');
+  await expect(card.getByRole("button", { name: "Connect", exact: true })).toBeEnabled();
+  await card.getByRole("heading", { name: "Notion" }).click();
+  await expect(page.getByTestId("mcp-directory-detail").getByRole("button", { name: "Connect", exact: true })).toBeEnabled();
+});
+
+for (const role of ["member", "viewer"] as const) {
+  test(`prevents ${role} users from starting MCP OAuth`, async ({ page }) => {
+    await mockApp(page, oauthDirectory, role);
+    await page.goto(`/?admin=capabilities&tab=marketplace&ws=${WORKSPACE_ID}`);
+
+    const card = page.locator('[data-catalog-id="notion"]');
+    await expect(card.getByRole("button", { name: "Owner / admin only", exact: true })).toBeDisabled();
+    await expect(card.getByRole("button", { name: "Connect", exact: true })).toHaveCount(0);
+    await card.getByRole("heading", { name: "Notion" }).click();
+
+    const detail = page.getByTestId("mcp-directory-detail");
+    await expect(detail.getByRole("button", { name: "Owner / admin only", exact: true })).toBeDisabled();
+    await expect(detail.getByRole("button", { name: "Connect", exact: true })).toHaveCount(0);
+  });
+}
+
+const oauthDirectoryItem = {
+  ...connector("notion", "Notion", "Productivity", 1),
+  authentication: "oauth2",
+  connected: false,
+};
+
+async function oauthDirectory(route: Route) {
+  await json(route, { items: [oauthDirectoryItem] });
+  return true;
+}
+
 function connector(id: string, name: string, category: string, featuredRank: number) {
   return {
     id,
@@ -89,6 +127,7 @@ function connector(id: string, name: string, category: string, featuredRank: num
 async function mockApp(
   page: Page,
   directoryOverride?: (route: Route) => Promise<boolean>,
+  role: WorkspaceRole = "owner",
 ) {
   await page.route("**/api/v1/**", async (route) => {
     const request = route.request();
@@ -109,7 +148,7 @@ async function mockApp(
           name: "Directory Test",
           slug: "directory-test",
           visibility: "private",
-          role: "owner",
+          role,
           created_at: "2026-07-23T00:00:00Z",
           updated_at: "2026-07-23T00:00:00Z",
         }],
@@ -159,6 +198,8 @@ async function mockApp(
     }
     if (path === `/api/v1/workspaces/${WORKSPACE_ID}/mcp-directory/context7`)
       return json(route, { ...directoryItems[0], url: "https://mcp.context7.com/mcp" });
+    if (path === `/api/v1/workspaces/${WORKSPACE_ID}/mcp-directory/notion`)
+      return json(route, { ...oauthDirectoryItem, url: "https://mcp.notion.com/mcp" });
     if (path === `/api/v1/workspaces/${WORKSPACE_ID}/mcp-directory/context7/import`)
       return json(route, { installed: true, capability_id: CAPABILITY_ID }, 201);
     return json(route, {});