diff --git a/client/css/styles.css b/client/css/styles.css index 9592052..968d37f 100644 --- a/client/css/styles.css +++ b/client/css/styles.css @@ -140,3 +140,14 @@ textarea { #connectionStatus.connected { background: #d4edda; border-color: #28a745; color: #155724; } #connectionStatus.disconnected { background: #f8d7da; border-color: #dc3545; color: #721c24; } + +/* ---- Connection test status ------------------------------- */ +#connectionTestStatus { + font-size: 13px; + padding: 4px 8px; + border-radius: 4px; +} + +#connectionTestStatus.connection-testing { color: #856404; background: #fff3cd; } +#connectionTestStatus.connection-success { color: #155724; background: #d4edda; } +#connectionTestStatus.connection-error { color: #721c24; background: #f8d7da; } diff --git a/client/index.html b/client/index.html index b60951d..df52399 100644 --- a/client/index.html +++ b/client/index.html @@ -90,13 +90,15 @@

Prompts and outputs


-
+
+ +
diff --git a/client/js/app.js b/client/js/app.js index 57e46d9..1a4907e 100644 --- a/client/js/app.js +++ b/client/js/app.js @@ -106,6 +106,17 @@ document.getElementById('btnImportJson').addEventListener('click', function () { vscode.postMessage({ command: 'importJSON' }); }); +document.getElementById('btnTestConnection').addEventListener('click', function () { + const baseUrl = document.getElementById('baseUrlInput').value || ''; + const model = document.getElementById('modelInput').value || ''; + const statusEl = document.getElementById('connectionTestStatus'); + if (statusEl) { + statusEl.textContent = 'Testing...'; + statusEl.className = 'connection-testing'; + } + vscode.postMessage({ command: 'testConnection', baseUrl: baseUrl, model: model }); +}); + /* ============================================================= 3. General helpers ============================================================= */ @@ -264,6 +275,14 @@ window.addEventListener('message', function (event) { if (modelInput && message.LLMmodel) { modelInput.value = message.LLMmodel; } } + if (message.command === 'connectionTestResult') { + const statusEl = document.getElementById('connectionTestStatus'); + if (statusEl) { + statusEl.textContent = message.message; + statusEl.className = message.success ? 'connection-success' : 'connection-error'; + } + } + if (message.command === 'leafSimilarities') { renderSimilarities(message.node, message.similarities); renderLizardMetrics(message.node); diff --git a/media/webview.html b/media/webview.html index a0b42b5..ddde021 100644 --- a/media/webview.html +++ b/media/webview.html @@ -143,6 +143,17 @@ .swatch.other { background: var(--color-other); } + + /* Connection test status */ + #connectionTestStatus { + font-size: 13px; + padding: 4px 8px; + border-radius: 4px; + } + + #connectionTestStatus.connection-testing { color: #856404; background: #fff3cd; } + #connectionTestStatus.connection-success { color: #155724; background: #d4edda; } + #connectionTestStatus.connection-error { color: #721c24; background: #f8d7da; } @@ -218,13 +229,15 @@

Code metrics

Prompts and outputs


-
+
+ +