reverting UI changes

byjlw · Jan 23, 2025 · 542c246 · 542c246
1 parent 4ba3cc8
commit 542c246
Show file tree

Hide file tree

Showing 5 changed files with 57 additions and 110 deletions.
diff --git a/src/core/prompts/system.ts.checks b/src/core/prompts/system.ts.checks
diff --git a/src/core/webview/ClineProvider.ts b/src/core/webview/ClineProvider.ts
@@ -648,6 +648,14 @@ export class ClineProvider implements vscode.WebviewViewProvider {
 						}
 						break
 					}
+					case "toggleMcpServer": {
+						try {
+							await this.mcpHub?.toggleServerDisabled(message.serverName!, message.disabled!)
+						} catch (error) {
+							console.error(`Failed to toggle MCP server ${message.serverName}:`, error)
+						}
+						break
+					}
 					case "toggleToolAutoApprove": {
 						try {
 							await this.mcpHub?.toggleToolAutoApprove(message.serverName!, message.toolName!, message.autoApprove!)
@@ -668,18 +676,6 @@ export class ClineProvider implements vscode.WebviewViewProvider {
 						await vscode.commands.executeCommand("workbench.action.openSettings", "@ext:saoudrizwan.claude-dev")
 						break
 					}
-					case "getMcpEnabled": {
-						const enabled = this.mcpHub?.isMcpEnabled() ?? true
-						await this.postMessageToWebview({
-							type: "mcpEnabled",
-							enabled,
-						})
-						break
-					}
-					case "toggleMcp": {
-						await vscode.workspace.getConfiguration("cline.mcp").update("enabled", message.enabled, true)
-						break
-					}
 					// Add more switch case statements here as more webview message commands
 					// are created within the webview context (i.e. inside media/main.js)
 				}

diff --git a/src/services/mcp/McpHub.ts b/src/services/mcp/McpHub.ts
@@ -15,7 +15,15 @@ import * as path from "path"
 import * as vscode from "vscode"
 import { z } from "zod"
 import { ClineProvider, GlobalFileNames } from "../../core/webview/ClineProvider"
-import { McpMode, McpResource, McpResourceResponse, McpResourceTemplate, McpServer, McpTool, McpToolCallResponse } from "../../shared/mcp"
+import {
+	McpMode,
+	McpResource,
+	McpResourceResponse,
+	McpResourceTemplate,
+	McpServer,
+	McpTool,
+	McpToolCallResponse,
+} from "../../shared/mcp"
 import { fileExistsAtPath } from "../../utils/fs"
 import { arePathsEqual } from "../../utils/path"
 

diff --git a/src/shared/WebviewMessage.ts b/src/shared/WebviewMessage.ts
@@ -34,8 +34,12 @@ export interface WebviewMessage {
 		| "checkpointRestore"
 		| "taskCompletionViewChanges"
 		| "openExtensionSettings"
-		| "getMcpEnabled"
-		| "toggleMcp"
+		| "requestVsCodeLmModels"
+		| "toggleToolAutoApprove"
+		| "toggleMcpServer"
+		| "getLatestState"
+		| "accountLoginClicked"
+		| "accountLogoutClicked"
 	// | "relaunchChromeDebugMode"
 	text?: string
 	disabled?: boolean
@@ -46,7 +50,12 @@ export interface WebviewMessage {
 	number?: number
 	autoApprovalSettings?: AutoApprovalSettings
 	browserSettings?: BrowserSettings
-	enabled?: boolean // For toggleMcp message
+	chatSettings?: ChatSettings
+
+	// For toggleToolAutoApprove
+	serverName?: string
+	toolName?: string
+	autoApprove?: boolean
 }
 
 export type ClineAskResponse = "yesButtonClicked" | "noButtonClicked" | "messageResponse"

diff --git a/webview-ui/src/components/mcp/McpView.tsx b/webview-ui/src/components/mcp/McpView.tsx
@@ -2,7 +2,7 @@ import { VSCodeButton, VSCodeLink, VSCodePanels, VSCodePanelTab, VSCodePanelView
 import { useState } from "react"
 import { vscode } from "../../utils/vscode"
 import { useExtensionState } from "../../context/ExtensionStateContext"
-import { McpMode, McpServer } from "../../../../src/shared/mcp"
+import { McpServer } from "../../../../src/shared/mcp"
 import McpToolRow from "./McpToolRow"
 import McpResourceRow from "./McpResourceRow"
 
@@ -12,31 +12,7 @@ type McpViewProps = {
 
 const McpView = ({ onDone }: McpViewProps) => {
 	const { mcpServers: servers } = useExtensionState()
-	const [isMcpEnabled, setIsMcpEnabled] = useState(true)
 
-	useEffect(() => {
-		// Get initial MCP enabled state
-		vscode.postMessage({ type: "getMcpEnabled" })
-	}, [])
-
-	useEffect(() => {
-		const handler = (event: MessageEvent) => {
-			const message = event.data
-			if (message.type === "mcpEnabled") {
-				setIsMcpEnabled(message.enabled)
-			}
-		}
-		window.addEventListener("message", handler)
-		return () => window.removeEventListener("message", handler)
-	}, [])
-
-	const toggleMcp = () => {
-		vscode.postMessage({
-			type: "toggleMcp",
-			enabled: !isMcpEnabled,
-		})
-		setIsMcpEnabled(!isMcpEnabled)
-	}
 	// const [servers, setServers] = useState<McpServer[]>([
 	// 	// Add some mock servers for testing
 	// 	{
@@ -143,58 +119,7 @@ const McpView = ({ onDone }: McpViewProps) => {
 					</VSCodeLink>
 				</div>
 
-				{/* MCP Toggle Section */}
-				<div
-					style={{
-						marginBottom: "16px",
-						paddingBottom: "16px",
-						borderBottom: "1px solid var(--vscode-textSeparator-foreground)",
-					}}>
-					<div>
-						<VSCodeCheckbox
-							checked={isMcpEnabled}
-							onChange={toggleMcp}
-							style={{
-								display: "flex",
-								alignItems: "center",
-								gap: "8px",
-								padding: "4px 0",
-								cursor: "pointer",
-								fontSize: "13px",
-							}}>
-							Enable MCP
-						</VSCodeCheckbox>
-						{isMcpEnabled && (
-							<div
-								style={{
-									marginTop: "4px",
-									marginLeft: "24px",
-									color: "var(--vscode-descriptionForeground)",
-									fontSize: "12px",
-								}}>
-								Disabling MCP will save on tokens passed in the context.
-							</div>
-						)}
-						{!isMcpEnabled && (
-							<div
-								style={{
-									padding: "8px 12px",
-									marginTop: "8px",
-									background: "var(--vscode-textBlockQuote-background)",
-									border: "1px solid var(--vscode-textBlockQuote-border)",
-									borderRadius: "4px",
-									color: "var(--vscode-descriptionForeground)",
-									fontSize: "12px",
-									lineHeight: "1.4",
-								}}>
-								MCP is currently disabled. Enable MCP to use MCP servers and tools. Enabling MCP will use
-								additional tokens.
-							</div>
-						)}
-					</div>
-				</div>
-
-				{servers.length > 0 && isMcpEnabled && (
+				{servers.length > 0 && (
 					<div
 						style={{
 							display: "flex",
@@ -208,19 +133,32 @@ const McpView = ({ onDone }: McpViewProps) => {
 				)}
 
 				{/* Server Configuration Button */}
-				{isMcpEnabled && (
-					<div style={{ marginTop: "10px", width: "100%" }}>
-						<VSCodeButton
-							appearance="secondary"
-							style={{ width: "100%" }}
-							onClick={() => {
-								vscode.postMessage({ type: "openMcpSettings" })
-							}}>
-							<span className="codicon codicon-server" style={{ marginRight: "6px" }}></span>
-							Configure MCP Servers
-						</VSCodeButton>
-					</div>
-				)}
+
+				<div style={{ marginTop: "10px", width: "100%" }}>
+					<VSCodeButton
+						appearance="secondary"
+						style={{ width: "100%" }}
+						onClick={() => {
+							vscode.postMessage({ type: "openMcpSettings" })
+						}}>
+						<span className="codicon codicon-server" style={{ marginRight: "6px" }}></span>
+						Configure MCP Servers
+					</VSCodeButton>
+				</div>
+
+				{/* Advanced Settings Link */}
+				<div style={{ textAlign: "center", marginTop: "5px" }}>
+					<VSCodeLink
+						onClick={() => {
+							vscode.postMessage({
+								type: "openExtensionSettings",
+								text: "cline.mcp",
+							})
+						}}
+						style={{ fontSize: "12px" }}>
+						Advanced MCP Settings
+					</VSCodeLink>
+				</div>
 
 				{/* Bottom padding */}
 				<div style={{ height: "20px" }} />