From eb3252548a4b9e229c20b1779bcb06268e4a2ffe Mon Sep 17 00:00:00 2001 From: andrepimenta Date: Fri, 20 Jun 2025 19:00:30 +0100 Subject: [PATCH] Thinking intensity --- package.json | 6 ++++ src/extension.ts | 29 ++++++++++++++-- src/ui-styles.ts | 89 ++++++++++++++++++++++++++++++++++++++++++++++-- src/ui.ts | 58 ++++++++++++++++++++++++++++++- 4 files changed, 176 insertions(+), 6 deletions(-) diff --git a/package.json b/package.json index e7e25c6..e74ee43 100644 --- a/package.json +++ b/package.json @@ -168,6 +168,12 @@ "type": "string", "default": "/usr/local/bin/claude", "description": "Path to Claude executable in the WSL distribution" + }, + "claudeCodeChat.thinking.intensity": { + "type": "string", + "enum": ["think", "think-hard", "think-harder", "ultrathink"], + "default": "think", + "description": "Thinking mode intensity level. Higher levels provide more detailed reasoning but consume more tokens." } } } diff --git a/src/extension.ts b/src/extension.ts index b1c2397..6a1cff5 100644 --- a/src/extension.ts +++ b/src/extension.ts @@ -263,13 +263,35 @@ class ClaudeChatProvider { const workspaceFolder = vscode.workspace.workspaceFolders?.[0]; const cwd = workspaceFolder ? workspaceFolder.uri.fsPath : process.cwd(); + // Get thinking intensity setting + const configThink = vscode.workspace.getConfiguration('claudeCodeChat'); + const thinkingIntensity = configThink.get('thinking.intensity', 'think'); + // Prepend mode instructions if enabled let actualMessage = message; - if (planMode && !message.toLowerCase().includes('plan first')) { + if (planMode) { actualMessage = 'PLAN FIRST BEFORE MAKING ANY CHANGES, SHOW ME IN DETAIL WHAT YOU WILL CHANGE. DONT PROCEED BEFORE I ACCEPT IN A DIFFERENT MESSAGE: \n' + message; } - if (thinkingMode && !actualMessage.toLowerCase().includes('think through')) { - actualMessage = 'THINK THROUGH THIS STEP BY STEP: \n' + actualMessage; + if (thinkingMode) { + let thinkingPrompt = ''; + const thinkingMesssage = ' THROUGH THIS STEP BY STEP: \n' + switch (thinkingIntensity) { + case 'think': + thinkingPrompt = 'THINK'; + break; + case 'think-hard': + thinkingPrompt = 'THINK HARD'; + break; + case 'think-harder': + thinkingPrompt = 'THINK HARDER'; + break; + case 'ultrathink': + thinkingPrompt = 'ULTRATHINK'; + break; + default: + thinkingPrompt = 'THINK'; + } + actualMessage = thinkingPrompt + thinkingMesssage + actualMessage; } // Show original user input in chat and save to conversation (without mode prefixes) @@ -1153,6 +1175,7 @@ class ClaudeChatProvider { private _sendCurrentSettings(): void { const config = vscode.workspace.getConfiguration('claudeCodeChat'); const settings = { + 'thinking.intensity': config.get('thinking.intensity', 'think'), 'wsl.enabled': config.get('wsl.enabled', false), 'wsl.distro': config.get('wsl.distro', 'Ubuntu'), 'wsl.nodePath': config.get('wsl.nodePath', '/usr/bin/node'), diff --git a/src/ui-styles.ts b/src/ui-styles.ts index eac7353..a13f874 100644 --- a/src/ui-styles.ts +++ b/src/ui-styles.ts @@ -873,7 +873,6 @@ const styles = ` align-items: flex-start; gap: 12px; padding: 16px 0; - border-bottom: 1px solid rgba(255, 255, 255, 0.05); cursor: pointer; border-radius: 6px; transition: background-color 0.2s ease; @@ -946,8 +945,94 @@ const styles = ` align-self: flex-start; } + /* Thinking intensity slider */ + .thinking-slider-container { + position: relative; + padding: 0px 16px; + margin: 12px 0; + } + + .thinking-slider { + width: 100%; + height: 4px; + -webkit-appearance: none; + appearance: none; + background: var(--vscode-panel-border); + outline: none !important; + border: none; + cursor: pointer; + border-radius: 2px; + } + + .thinking-slider::-webkit-slider-thumb { + -webkit-appearance: none; + appearance: none; + width: 16px; + height: 16px; + background: var(--vscode-foreground); + cursor: pointer; + border-radius: 50%; + transition: transform 0.2s ease; + } + + .thinking-slider::-webkit-slider-thumb:hover { + transform: scale(1.2); + } + + .thinking-slider::-moz-range-thumb { + width: 16px; + height: 16px; + background: var(--vscode-foreground); + cursor: pointer; + border-radius: 50%; + border: none; + transition: transform 0.2s ease; + } + + .thinking-slider::-moz-range-thumb:hover { + transform: scale(1.2); + } + + .slider-labels { + display: flex; + justify-content: space-between; + margin-top: 12px; + padding: 0 8px; + } + + .slider-label { + font-size: 12px; + color: var(--vscode-descriptionForeground); + opacity: 0.7; + transition: all 0.2s ease; + text-align: center; + width: 100px; + cursor: pointer; + } + + .slider-label:hover { + opacity: 1; + color: var(--vscode-foreground); + } + + .slider-label.active { + opacity: 1; + color: var(--vscode-foreground); + font-weight: 500; + } + + .slider-label:first-child { + margin-left: -50px; + } + + .slider-label:last-child { + margin-right: -50px; + } + .settings-group { - margin-bottom: 20px; + padding-bottom: 20px; + margin-bottom: 40px; + border-bottom: 1px solid rgba(255, 255, 255, 0.05); } .settings-group h3 { diff --git a/src/ui.ts b/src/ui.ts index 1bc4c10..5df6717 100644 --- a/src/ui.ts +++ b/src/ui.ts @@ -195,7 +195,25 @@ const html = `
-

WSL Configuration

+

Thinking Mode Configuration

+
+
+

+ Configure the intensity of thinking mode. Higher levels provide more detailed reasoning but consume more tokens. +

+
+
+ +
+
Think
+
Think Hard
+
Think Harder
+
Ultrathink
+
+
+
+ +

WSL Configuration

WSL integration allows you to run Claude Code from within Windows Subsystem for Linux. @@ -1576,7 +1594,34 @@ const html = ` document.getElementById('settingsModal').style.display = 'none'; } + function updateThinkingIntensity(value) { + // Update label highlighting + for (let i = 0; i < 4; i++) { + const label = document.getElementById('label-' + i); + if (i == value) { + label.classList.add('active'); + } else { + label.classList.remove('active'); + } + } + } + + function setThinkingIntensity(value) { + // Set slider value + document.getElementById('thinkingSlider').value = value; + + // Update visual state + updateThinkingIntensity(value); + + // Save settings + updateSettings(); + } + function updateSettings() { + const thinkingSlider = document.getElementById('thinkingSlider'); + const intensityValues = ['think', 'think-hard', 'think-harder', 'ultrathink']; + const thinkingIntensity = intensityValues[thinkingSlider.value] || 'think'; + const wslEnabled = document.getElementById('wsl-enabled').checked; const wslDistro = document.getElementById('wsl-distro').value; const wslNodePath = document.getElementById('wsl-node-path').value; @@ -1589,6 +1634,7 @@ const html = ` vscode.postMessage({ type: 'updateSettings', settings: { + 'thinking.intensity': thinkingIntensity, 'wsl.enabled': wslEnabled, 'wsl.distro': wslDistro || 'Ubuntu', 'wsl.nodePath': wslNodePath || '/usr/bin/node', @@ -1612,6 +1658,16 @@ const html = ` if (message.type === 'settingsData') { // Update UI with current settings + const thinkingIntensity = message.data['thinking.intensity'] || 'think'; + const intensityValues = ['think', 'think-hard', 'think-harder', 'ultrathink']; + const sliderValue = intensityValues.indexOf(thinkingIntensity); + + const thinkingSlider = document.getElementById('thinkingSlider'); + if (thinkingSlider) { + thinkingSlider.value = sliderValue >= 0 ? sliderValue : 0; + updateThinkingIntensity(thinkingSlider.value); + } + document.getElementById('wsl-enabled').checked = message.data['wsl.enabled'] || false; document.getElementById('wsl-distro').value = message.data['wsl.distro'] || 'Ubuntu'; document.getElementById('wsl-node-path').value = message.data['wsl.nodePath'] || '/usr/bin/node';