mirror of
https://github.com/andrepimenta/claude-code-chat.git
synced 2025-12-08 17:09:44 +00:00
Show WSL alert for windows users
This commit is contained in:
@@ -228,6 +228,9 @@ class ClaudeChatProvider {
|
||||
case 'executeSlashCommand':
|
||||
this._executeSlashCommand(message.command);
|
||||
return;
|
||||
case 'dismissWSLAlert':
|
||||
this._dismissWSLAlert();
|
||||
return;
|
||||
}
|
||||
},
|
||||
null,
|
||||
@@ -265,6 +268,10 @@ class ClaudeChatProvider {
|
||||
type: 'modelSelected',
|
||||
model: this._selectedModel
|
||||
});
|
||||
|
||||
|
||||
// Send platform information to webview
|
||||
this._sendPlatformInfo();
|
||||
}, 100);
|
||||
}
|
||||
|
||||
@@ -917,6 +924,7 @@ class ClaudeChatProvider {
|
||||
|
||||
private async _saveCurrentConversation(): Promise<void> {
|
||||
if (!this._conversationsPath || this._currentConversation.length === 0) {return;}
|
||||
if(!this._currentSessionId) {return;}
|
||||
|
||||
try {
|
||||
// Create filename from first user message and timestamp
|
||||
@@ -1340,6 +1348,29 @@ class ClaudeChatProvider {
|
||||
});
|
||||
}
|
||||
|
||||
private _sendPlatformInfo() {
|
||||
const platform = process.platform;
|
||||
const dismissed = this._context.globalState.get<boolean>('wslAlertDismissed', false);
|
||||
|
||||
// Get WSL configuration
|
||||
const config = vscode.workspace.getConfiguration('claudeCodeChat');
|
||||
const wslEnabled = config.get<boolean>('wsl.enabled', false);
|
||||
|
||||
this._panel?.webview.postMessage({
|
||||
type: 'platformInfo',
|
||||
data: {
|
||||
platform: platform,
|
||||
isWindows: platform === 'win32',
|
||||
wslAlertDismissed: dismissed,
|
||||
wslEnabled: wslEnabled
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
private _dismissWSLAlert() {
|
||||
this._context.globalState.update('wslAlertDismissed', true);
|
||||
}
|
||||
|
||||
public dispose() {
|
||||
if (this._panel) {
|
||||
this._panel.dispose();
|
||||
|
||||
@@ -83,6 +83,74 @@ const styles = `
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* WSL Alert */
|
||||
.wsl-alert {
|
||||
margin: 8px 12px;
|
||||
background-color: rgba(135, 206, 235, 0.1);
|
||||
border: 2px solid rgba(135, 206, 235, 0.3);
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
|
||||
backdrop-filter: blur(4px);
|
||||
animation: slideUp 0.3s ease;
|
||||
}
|
||||
|
||||
@keyframes slideUp {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(10px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
.wsl-alert-content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 14px 18px;
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.wsl-alert-icon {
|
||||
font-size: 22px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.wsl-alert-text {
|
||||
flex: 1;
|
||||
font-size: 13px;
|
||||
line-height: 1.4;
|
||||
color: var(--vscode-foreground);
|
||||
}
|
||||
|
||||
.wsl-alert-text strong {
|
||||
font-weight: 600;
|
||||
color: var(--vscode-foreground);
|
||||
}
|
||||
|
||||
.wsl-alert-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.wsl-alert-actions .btn {
|
||||
padding: 6px 14px;
|
||||
font-size: 12px;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.wsl-alert-actions .btn:first-child {
|
||||
background-color: rgba(135, 206, 235, 0.2);
|
||||
border-color: rgba(135, 206, 235, 0.4);
|
||||
}
|
||||
|
||||
.wsl-alert-actions .btn:first-child:hover {
|
||||
background-color: rgba(135, 206, 235, 0.3);
|
||||
border-color: rgba(135, 206, 235, 0.6);
|
||||
}
|
||||
|
||||
.chat-container {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
|
||||
53
src/ui.ts
53
src/ui.ts
@@ -37,6 +37,22 @@ const html = `<!DOCTYPE html>
|
||||
|
||||
<div class="chat-container" id="chatContainer">
|
||||
<div class="messages" id="messages"></div>
|
||||
|
||||
<!-- WSL Alert for Windows users -->
|
||||
<div id="wslAlert" class="wsl-alert" style="display: none;">
|
||||
<div class="wsl-alert-content">
|
||||
<div class="wsl-alert-icon">💻</div>
|
||||
<div class="wsl-alert-text">
|
||||
<strong>Looks like you are using Windows!</strong><br/>
|
||||
If you are using WSL to run Claude Code, you should enable WSL integration in the settings.
|
||||
</div>
|
||||
<div class="wsl-alert-actions">
|
||||
<button class="btn" onclick="openWSLSettings()">Enable WSL</button>
|
||||
<button class="btn outlined" onclick="dismissWSLAlert()">Dismiss</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="input-container" id="inputContainer">
|
||||
<div class="input-modes">
|
||||
<div class="mode-toggle">
|
||||
@@ -1132,6 +1148,33 @@ const html = `<!DOCTYPE html>
|
||||
hideThinkingIntensityModal();
|
||||
}
|
||||
|
||||
// WSL Alert functions
|
||||
function showWSLAlert() {
|
||||
const alert = document.getElementById('wslAlert');
|
||||
if (alert) {
|
||||
alert.style.display = 'block';
|
||||
}
|
||||
}
|
||||
|
||||
function dismissWSLAlert() {
|
||||
const alert = document.getElementById('wslAlert');
|
||||
if (alert) {
|
||||
alert.style.display = 'none';
|
||||
}
|
||||
// Send dismiss message to extension to store in globalState
|
||||
vscode.postMessage({
|
||||
type: 'dismissWSLAlert'
|
||||
});
|
||||
}
|
||||
|
||||
function openWSLSettings() {
|
||||
// Dismiss the alert
|
||||
dismissWSLAlert();
|
||||
|
||||
// Open settings modal
|
||||
toggleSettings();
|
||||
}
|
||||
|
||||
function executeSlashCommand(command) {
|
||||
// Hide the modal
|
||||
hideSlashCommandsModal();
|
||||
@@ -1978,6 +2021,16 @@ const html = `<!DOCTYPE html>
|
||||
// Show/hide WSL options
|
||||
document.getElementById('wslOptions').style.display = message.data['wsl.enabled'] ? 'block' : 'none';
|
||||
}
|
||||
|
||||
if (message.type === 'platformInfo') {
|
||||
// Check if user is on Windows and show WSL alert if not dismissed and WSL not already enabled
|
||||
if (message.data.isWindows && !message.data.wslAlertDismissed && !message.data.wslEnabled) {
|
||||
// Small delay to ensure UI is ready
|
||||
setTimeout(() => {
|
||||
showWSLAlert();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user