This commit is contained in:
Evan 2025-01-23 12:33:31 +08:00
parent c204ad711b
commit 1e04e5c37a
6 changed files with 1 additions and 421 deletions

View file

@ -1,94 +0,0 @@
# MCP Mode Implementation Changes
## Overview
Implemented a tri-state MCP mode setting to replace the existing boolean toggle, allowing users to:
1. Fully enable MCP (including server use and build instructions)
2. Enable server use only (excluding build instructions to save tokens)
3. Disable MCP completely
## Changes Made
### 1. Type Definition
Added McpMode type in `src/shared/mcp.ts`:
```typescript
export type McpMode = "enabled" | "server-use-only" | "disabled"
```
### 2. VSCode Setting
Updated setting definition in `package.json`:
```json
"cline.mcp.enabled": {
"type": "string",
"enum": ["enabled", "server-use-only", "disabled"],
"enumDescriptions": [
"Full MCP functionality including server use and build instructions",
"Enable MCP server use but exclude build instructions from AI prompts to save tokens",
"Disable all MCP functionality"
],
"default": "enabled",
"description": "Control MCP server functionality and its inclusion in AI prompts"
}
```
### 3. McpHub Changes
Modified `src/services/mcp/McpHub.ts`:
- Removed `isMcpEnabled()` method
- Added `getMode(): McpMode` method that returns the current mode from VSCode settings
### 4. Message Types
Updated message types to support the new mode:
In `src/shared/WebviewMessage.ts` and `src/shared/ExtensionMessage.ts`:
- Added `mode?: McpMode` property with comment indicating its use with specific message types
### 5. MCP View Changes
Updated `webview-ui/src/components/mcp/McpView.tsx`:
- Replaced checkbox with dropdown for mode selection
- Updated state management to use McpMode type
- Added mode-specific descriptions:
- Enabled: "Full MCP functionality including server use and build instructions"
- Server Use Only: "MCP server use is enabled, but build instructions are excluded from AI prompts to save tokens"
- Disabled: Warning about MCP being disabled and token implications
- Updated visibility conditions based on mode
### 6. System Prompt Generation
Added comment in `src/core/prompts/system.ts.checks` for implementing mode-specific content:
```typescript
// Mode checks for MCP content:
// - mcpHub.getMode() === "disabled" -> exclude all MCP content
// - mcpHub.getMode() === "server-use-only" -> include server tools/resources but exclude build instructions
// - mcpHub.getMode() === "enabled" -> include all MCP content (tools, resources, and build instructions)
```
The server building content to be conditionally included (only in "enabled" mode) spans the following sections in system.ts:
- Lines 1012-1015: Main section about creating MCP servers
- Lines 1017-1021: OAuth and authentication handling
- Lines 1025-1392: Example weather server implementation
- Lines 1394-1399: Guidelines for modifying existing servers
- Lines 1401-1405: Usage notes about when to create vs use existing tools
## Next Steps
1. Implement the system prompt changes using the mode checks provided in system.ts.checks
2. Test the implementation with all three modes to ensure proper functionality
## Testing Required
1. Verify mode switching in UI works correctly
2. Confirm proper state persistence
3. Test system prompt generation with each mode
4. Verify server connections behave correctly in each mode
5. Check token usage differences between modes

View file

@ -1,301 +0,0 @@
# Implementing MCP Mode Setting
## Overview
Currently, the MCP (Model Context Protocol) setting is a binary option (enabled/disabled) that controls whether MCP server functionality is included in AI prompts. We need to extend this to a trinary setting with the following modes:
1. **Enabled**: Full MCP functionality (current enabled state)
2. **Server Use Only**: Enable MCP server use but exclude build instructions from prompts
3. **Disabled**: No MCP functionality (current disabled state)
This change will help users better control token usage while maintaining access to MCP server capabilities when needed.
## Current Implementation
### VSCode Setting
Currently defined in `package.json`:
```json
"cline.mcp.enabled": {
"type": "boolean",
"default": true,
"description": "Include MCP server functionality in AI prompts. When disabled, the AI will not be aware of MCP capabilities. This saves context window tokens."
}
```
### Core Logic
- `system.ts` uses the setting to conditionally include MCP content in prompts
- `ClineProvider.ts` handles setting changes and webview communication
### UI
- `McpView.tsx` displays a checkbox for toggling MCP functionality
- Shows warning message when disabled
## Implementation Steps
### Implementation Order
The changes should be implemented in this order to minimize disruption:
1. Add new type definitions first
2. Update McpHub to handle both old and new setting values
3. Update message types and ClineProvider
4. Update VSCode setting definition
5. Update UI components
6. Update system prompt generation
### Step 1: Update VSCode Setting
In `package.json`, update the setting definition:
```json
"cline.mcp.enabled": {
"type": "string",
"enum": ["enabled", "server-use-only", "disabled"],
"enumDescriptions": [
"Full MCP functionality including server use and build instructions",
"Enable MCP server use but exclude build instructions from AI prompts to save tokens",
"Disable all MCP functionality"
],
"default": "enabled",
"description": "Control MCP server functionality and its inclusion in AI prompts"
}
```
### Step 2: Update Type Definitions
In `src/shared/mcp.ts`, add the MCP mode type:
```typescript
export type McpMode = "enabled" | "server-use-only" | "disabled"
```
### Step 3: Update McpHub
In `src/services/mcp/McpHub.ts`, update the configuration reading:
```typescript
export class McpHub {
public getMode(): McpMode {
const mode = vscode.workspace.getConfiguration("cline.mcp").get<McpMode>("enabled", "enabled")
// Handle legacy boolean values
if (typeof mode === "boolean") {
return mode ? "enabled" : "disabled"
}
return mode
}
}
```
### Step 4: Update Message Types
In `src/shared/ExtensionMessage.ts` and `src/shared/WebviewMessage.ts`, update the message types:
```typescript
// ExtensionMessage.ts
export type ExtensionMessage =
| {
type: "mcpEnabled"
mode: McpMode
}
| {
// ... other message types
}
// WebviewMessage.ts
export type WebviewMessage =
| {
type: "toggleMcp"
mode: McpMode
}
| {
// ... other message types
}
```
### Step 5: Update ClineProvider
In `src/core/webview/ClineProvider.ts`, update the message handling:
```typescript
export class ClineProvider {
// ... existing code ...
private async handleWebviewMessage(message: WebviewMessage) {
switch (message.type) {
case "toggleMcp": {
await vscode.workspace.getConfiguration("cline.mcp").update("enabled", message.mode, true)
break
}
// ... other cases ...
}
}
private async handleConfigurationChange(e: vscode.ConfigurationChangeEvent) {
if (e && e.affectsConfiguration("cline.mcp.enabled")) {
const mode = this.mcpHub?.getMode() ?? "enabled"
await this.postMessageToWebview({
type: "mcpEnabled",
mode,
})
}
}
}
```
### Step 6: Update System Prompt Generation
In `src/core/prompts/system.ts`, modify how MCP content is included:
```typescript
export const SYSTEM_PROMPT = async (
cwd: string,
supportsComputerUse: boolean,
mcpMode: McpMode,
browserSettings: BrowserSettings,
) => {
// Base prompt content...
// Include MCP content for both 'enabled' and 'server-use-only' modes
if (mcpMode !== "disabled") {
let mcpContent = `
====
MCP SERVERS
The Model Context Protocol (MCP) enables communication between the system and locally running MCP servers that provide additional tools and resources to extend your capabilities.
# Connected MCP Servers
When a server is connected, you can use the server's tools via the \`use_mcp_tool\` tool, and access the server's resources via the \`access_mcp_resource\` tool.
`
// Add server listings...
mcpContent += getServerListings()
// Only include build instructions in full mode
if (mcpMode === "enabled") {
mcpContent += `
## Creating an MCP Server
[... build instructions content ...]`
}
return basePrompt + mcpContent
}
return basePrompt
}
```
### Step 5: Update UI
In `webview-ui/src/components/mcp/McpView.tsx`, replace the checkbox with a select:
```typescript
const McpModeSelect: React.FC<{
value: McpMode;
onChange: (value: McpMode) => void;
}> = ({ value, onChange }) => {
return (
<VSCodeDropdown
value={value}
onChange={(e) => onChange((e.target as HTMLSelectElement).value as McpMode)}
>
<option value="enabled">Fully Enabled</option>
<option value="server-use-only">Server Use Only</option>
<option value="disabled">Disabled</option>
</select>
);
};
// Update the main component
const McpView = ({ onDone }: McpViewProps) => {
const [mcpMode, setMcpMode] = useState<McpMode>("enabled");
useEffect(() => {
vscode.postMessage({ type: "getMcpEnabled" });
}, []);
useEffect(() => {
const handler = (event: MessageEvent) => {
const message = event.data;
if (message.type === "mcpEnabled") {
setMcpMode(message.mode);
}
};
window.addEventListener("message", handler);
return () => window.removeEventListener("message", handler);
}, []);
const handleModeChange = (newMode: McpMode) => {
vscode.postMessage({
type: "toggleMcp",
mode: newMode,
});
setMcpMode(newMode);
};
return (
// ... existing wrapper divs ...
<div>
<McpModeSelect value={mcpMode} onChange={handleModeChange} />
{mcpMode === "server-use-only" && (
<div style={{
marginTop: "4px",
marginLeft: "24px",
color: "var(--vscode-descriptionForeground)",
fontSize: "12px",
}}>
MCP server use is enabled, but build instructions are excluded from AI prompts to save tokens.
</div>
)}
{mcpMode === "disabled" && (
<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>
);
};
```
## Testing Plan
1. Functionality Testing
- Test each mode:
- Enabled: Full MCP functionality
- Server Use Only: Verify servers work but build instructions are excluded
- Disabled: No MCP functionality
2. UI Testing
- Verify select component displays correctly
- Check mode-specific messages
- Test mode switching
3. System Prompt Testing
- Verify correct sections are included/excluded based on mode
- Check server listings in each mode
- Validate build instructions presence/absence
## Implementation Notes
- The system prompt directly checks the mode value to determine what content to include
- The UI provides clear feedback about the implications of each mode
- Error handling remains consistent with the existing implementation

View file

@ -1,16 +0,0 @@
# MCP Server Building Sections in system.ts
1. Main section about creating MCP servers: Lines 1012-1015
- Introduces the concept of creating MCP servers for new tools
2. OAuth and authentication handling: Lines 1017-1021
- Details about non-interactive environment and handling credentials
3. Example weather server implementation: Lines 1025-1392
- Complete example showing server creation, implementation, and configuration
4. Editing existing servers: Lines 1394-1399
- Guidelines for modifying existing MCP servers
5. Usage note: Lines 1401-1405
- Context about when to create vs use existing tools

View file

@ -656,14 +656,6 @@ 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!)

View file

@ -5,7 +5,7 @@ import { AutoApprovalSettings } from "./AutoApprovalSettings"
import { BrowserSettings } from "./BrowserSettings"
import { ChatSettings } from "./ChatSettings"
import { HistoryItem } from "./HistoryItem"
import { McpMode, McpServer } from "./mcp"
import { McpServer } from "./mcp"
// webview will hold state
export interface ExtensionMessage {

View file

@ -2,7 +2,6 @@ import { ApiConfiguration } from "./api"
import { AutoApprovalSettings } from "./AutoApprovalSettings"
import { BrowserSettings } from "./BrowserSettings"
import { ChatSettings } from "./ChatSettings"
import { McpMode } from "./mcp"
export interface WebviewMessage {
type: