mirror of
https://github.com/andrepimenta/claude-code-chat.git
synced 2025-12-09 02:09:42 +00:00
Add settings UI with WSL configuration support
- Add settings button to webview UI - Implement settings panel with WSL bridge configuration - Add real-time settings updates via VS Code configuration API - Support for WSL distro, node path, and claude path configuration - Improve user experience by eliminating manual config file editing
This commit is contained in:
55
TEST_SETTINGS.md
Normal file
55
TEST_SETTINGS.md
Normal file
@@ -0,0 +1,55 @@
|
||||
# Settings Interface Test Plan
|
||||
|
||||
## Overview
|
||||
Added a settings interface to the Claude Code Chat webview that allows users to configure WSL settings.
|
||||
|
||||
## Changes Made
|
||||
|
||||
### 1. UI Changes (ui.ts)
|
||||
- Added a settings button (⚙️) in the header that's always visible
|
||||
- Created a settings modal with WSL configuration options:
|
||||
- Enable WSL Integration checkbox
|
||||
- WSL Distribution input field
|
||||
- Node.js Path in WSL input field
|
||||
- Claude Path in WSL input field
|
||||
- Added JavaScript functions:
|
||||
- `toggleSettings()` - Shows/hides the settings modal
|
||||
- `hideSettingsModal()` - Hides the settings modal
|
||||
- `updateSettings()` - Sends settings changes to VS Code
|
||||
- Event listeners for modal interaction
|
||||
|
||||
### 2. Extension Changes (extension.ts)
|
||||
- Added message handlers:
|
||||
- `getSettings` - Retrieves current settings from VS Code configuration
|
||||
- `updateSettings` - Updates VS Code configuration with new settings
|
||||
- Added methods:
|
||||
- `_sendCurrentSettings()` - Sends current settings to webview
|
||||
- `_updateSettings()` - Updates VS Code configuration
|
||||
|
||||
### 3. Configuration (package.json)
|
||||
- Already has WSL configuration properties defined:
|
||||
- `claudeCodeChat.wsl.enabled`
|
||||
- `claudeCodeChat.wsl.distro`
|
||||
- `claudeCodeChat.wsl.nodePath`
|
||||
- `claudeCodeChat.wsl.claudePath`
|
||||
|
||||
## Testing Steps
|
||||
|
||||
1. Open VS Code with the extension
|
||||
2. Open Claude Code Chat (Ctrl+Shift+C)
|
||||
3. Click the settings button (⚙️) in the header
|
||||
4. Verify the settings modal appears
|
||||
5. Check that current WSL settings are loaded
|
||||
6. Toggle "Enable WSL Integration" and verify:
|
||||
- WSL options show/hide accordingly
|
||||
- Settings are saved when changed
|
||||
7. Modify WSL settings and verify they persist
|
||||
8. Close and reopen the settings to confirm values are saved
|
||||
|
||||
## Features
|
||||
|
||||
- Settings button is always visible in the header
|
||||
- Modal design matches the existing tools modal
|
||||
- Real-time show/hide of WSL options based on enabled state
|
||||
- Settings persist across sessions
|
||||
- Success/error notifications when saving settings
|
||||
Reference in New Issue
Block a user