diff --git a/webview-ui/src/components/mcp/McpView.tsx b/webview-ui/src/components/mcp/McpView.tsx
index 318cbab..1f1c602 100644
--- a/webview-ui/src/components/mcp/McpView.tsx
+++ b/webview-ui/src/components/mcp/McpView.tsx
@@ -1,5 +1,6 @@
import {
VSCodeButton,
+ VSCodeCheckbox,
VSCodeLink,
VSCodePanels,
VSCodePanelTab,
@@ -17,7 +18,7 @@ type McpViewProps = {
}
const McpView = ({ onDone }: McpViewProps) => {
- const { mcpServers: servers, alwaysAllowMcp } = useExtensionState()
+ const { mcpServers: servers, alwaysAllowMcp, mcpEnabled, setMcpEnabled } = useExtensionState()
// const [servers, setServers] = useState([
// // Add some mock servers for testing
// {
@@ -106,7 +107,7 @@ const McpView = ({ onDone }: McpViewProps) => {
style={{
color: "var(--vscode-foreground)",
fontSize: "13px",
- marginBottom: "20px",
+ marginBottom: "10px",
marginTop: "5px",
}}>
The{" "}
@@ -122,28 +123,50 @@ const McpView = ({ onDone }: McpViewProps) => {
npm docs").
- {/* Server List */}
- {servers.length > 0 && (
-
- {servers.map((server) => (
-
- ))}
-
- )}
-
- {/* Edit Settings Button */}
-
-
{
- vscode.postMessage({ type: "openMcpSettings" })
+
+
{
+ setMcpEnabled(e.target.checked)
+ vscode.postMessage({ type: "mcpEnabled", bool: e.target.checked })
}}>
-
- Edit MCP Settings
-
+ Enable MCP Servers
+
+
+ When enabled, Cline will be able to interact with MCP servers for advanced functionality. If you're not using MCP, you can disable this to reduce Cline's token usage.
+
+ {mcpEnabled && (
+ <>
+ {/* Server List */}
+ {servers.length > 0 && (
+
+ {servers.map((server) => (
+
+ ))}
+
+ )}
+
+ {/* Edit Settings Button */}
+
+ {
+ vscode.postMessage({ type: "openMcpSettings" })
+ }}>
+
+ Edit MCP Settings
+
+
+ >
+ )}
+
{/* Bottom padding */}
diff --git a/webview-ui/src/components/settings/SettingsView.tsx b/webview-ui/src/components/settings/SettingsView.tsx
index fb27dc4..7ac1563 100644
--- a/webview-ui/src/components/settings/SettingsView.tsx
+++ b/webview-ui/src/components/settings/SettingsView.tsx
@@ -48,8 +48,6 @@ const SettingsView = ({ onDone }: SettingsViewProps) => {
setScreenshotQuality,
terminalOutputLineLimit,
setTerminalOutputLineLimit,
- mcpEnabled,
- setMcpEnabled,
} = useExtensionState()
const [apiErrorMessage, setApiErrorMessage] = useState(undefined)
const [modelIdErrorMessage, setModelIdErrorMessage] = useState(undefined)
@@ -81,7 +79,6 @@ const SettingsView = ({ onDone }: SettingsViewProps) => {
vscode.postMessage({ type: "writeDelayMs", value: writeDelayMs })
vscode.postMessage({ type: "screenshotQuality", value: screenshotQuality ?? 75 })
vscode.postMessage({ type: "terminalOutputLineLimit", value: terminalOutputLineLimit ?? 500 })
- vscode.postMessage({ type: "mcpEnabled", bool: mcpEnabled })
onDone()
}
}
@@ -214,21 +211,6 @@ const SettingsView = ({ onDone }: SettingsViewProps) => {
}}>
These instructions are added to the end of the system prompt sent with every request. Custom instructions set in .clinerules and .cursorrules in the working directory are also included.
-
-
-
setMcpEnabled(e.target.checked)}>
- Enable MCP Servers
-
-
- When enabled, Cline will be able to interact with MCP servers for advanced functionality.
-
-
@@ -576,7 +558,6 @@ const SettingsView = ({ onDone }: SettingsViewProps) => {
-
{IS_DEV && (
<>
Debug