From 97ff4dcadf3be0197f8ffe6f4d6a9f0f138d7bb5 Mon Sep 17 00:00:00 2001
From: Mark IJbema <mark@kilocode.ai>
Date: Wed, 25 Mar 2026 16:46:24 +0100
Subject: [PATCH] fix(vscode): use type field for transport detection and hide
 env for remote servers

Use cfg().type instead of inferring transport from the url field,
preventing invalid state when clearing a remote URL. Hide the
environment variables editor for remote servers since the backend
schema does not support environment on remote configs.
---
 .../src/components/settings/McpEditView.tsx   | 112 +++++++++---------
 1 file changed, 57 insertions(+), 55 deletions(-)

diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/McpEditView.tsx b/packages/kilo-vscode/webview-ui/src/components/settings/McpEditView.tsx
index 7cd30519fa..634794307a 100644
--- a/packages/kilo-vscode/webview-ui/src/components/settings/McpEditView.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/McpEditView.tsx
@@ -32,7 +32,7 @@ const McpEditView: Component<Props> = (props) => {
     })
   }
 
-  const transport = () => (cfg().url ? "remote" : "local")
+  const transport = () => cfg().type ?? (cfg().url ? "remote" : "local")
 
   const cmd = () => {
     const c = cfg().command
@@ -146,66 +146,68 @@ const McpEditView: Component<Props> = (props) => {
         </Card>
       </Show>
 
-      {/* Environment variables */}
-      <Card style={{ "margin-bottom": "12px" }}>
-        <div data-slot="settings-row-label-title" style={{ "margin-bottom": "4px" }}>
-          {language.t("settings.agentBehaviour.editMcp.env")}
-        </div>
-        <div data-slot="settings-row-label-subtitle" style={{ "margin-bottom": "8px" }}>
-          {language.t("settings.agentBehaviour.editMcp.env.help")}
-        </div>
-
-        <div
-          style={{
-            display: "flex",
-            gap: "8px",
-            "align-items": "center",
-            padding: "8px 0",
-            "border-bottom": env().length > 0 ? "1px solid var(--border-weak-base)" : "none",
-          }}
-        >
-          <div style={{ flex: 1 }}>
-            <TextField value={envKey()} placeholder="KEY" onChange={(val) => setEnvKey(val)} />
+      {/* Environment variables (local servers only) */}
+      <Show when={transport() === "local"}>
+        <Card style={{ "margin-bottom": "12px" }}>
+          <div data-slot="settings-row-label-title" style={{ "margin-bottom": "4px" }}>
+            {language.t("settings.agentBehaviour.editMcp.env")}
           </div>
-          <div style={{ flex: 1 }}>
-            <TextField
-              value={envVal()}
-              placeholder="value"
-              onChange={(val) => setEnvVal(val)}
-              onKeyDown={(e: KeyboardEvent) => {
-                if (e.key === "Enter") addEnv()
-              }}
-            />
+          <div data-slot="settings-row-label-subtitle" style={{ "margin-bottom": "8px" }}>
+            {language.t("settings.agentBehaviour.editMcp.env.help")}
           </div>
-          <Button variant="secondary" onClick={addEnv}>
-            {language.t("common.add")}
-          </Button>
-        </div>
 
-        <For each={env()}>
-          {([key, val], index) => (
-            <div
-              style={{
-                display: "flex",
-                "align-items": "center",
-                "justify-content": "space-between",
-                padding: "6px 0",
-                "border-bottom": index() < env().length - 1 ? "1px solid var(--border-weak-base)" : "none",
-              }}
-            >
-              <span
+          <div
+            style={{
+              display: "flex",
+              gap: "8px",
+              "align-items": "center",
+              padding: "8px 0",
+              "border-bottom": env().length > 0 ? "1px solid var(--border-weak-base)" : "none",
+            }}
+          >
+            <div style={{ flex: 1 }}>
+              <TextField value={envKey()} placeholder="KEY" onChange={(val) => setEnvKey(val)} />
+            </div>
+            <div style={{ flex: 1 }}>
+              <TextField
+                value={envVal()}
+                placeholder="value"
+                onChange={(val) => setEnvVal(val)}
+                onKeyDown={(e: KeyboardEvent) => {
+                  if (e.key === "Enter") addEnv()
+                }}
+              />
+            </div>
+            <Button variant="secondary" onClick={addEnv}>
+              {language.t("common.add")}
+            </Button>
+          </div>
+
+          <For each={env()}>
+            {([key, val], index) => (
+              <div
                 style={{
-                  "font-family": "var(--vscode-editor-font-family, monospace)",
-                  "font-size": "12px",
+                  display: "flex",
+                  "align-items": "center",
+                  "justify-content": "space-between",
+                  padding: "6px 0",
+                  "border-bottom": index() < env().length - 1 ? "1px solid var(--border-weak-base)" : "none",
                 }}
               >
-                {key}={val}
-              </span>
-              <IconButton size="small" variant="ghost" icon="close" onClick={() => removeEnv(key)} />
-            </div>
-          )}
-        </For>
-      </Card>
+                <span
+                  style={{
+                    "font-family": "var(--vscode-editor-font-family, monospace)",
+                    "font-size": "12px",
+                  }}
+                >
+                  {key}={val}
+                </span>
+                <IconButton size="small" variant="ghost" icon="close" onClick={() => removeEnv(key)} />
+              </div>
+            )}
+          </For>
+        </Card>
+      </Show>
 
       <div style={{ display: "flex", "justify-content": "flex-end" }}>
         <Button variant="ghost" onClick={props.onBack}>