From c46b40ac1799bbbfae159b1d57205dc4903eff1b Mon Sep 17 00:00:00 2001
From: "kiloconnect[bot]" <240665456+kiloconnect[bot]@users.noreply.github.com>
Date: Tue, 5 May 2026 09:07:59 +0000
Subject: [PATCH 1/7] fix(vscode): align autocomplete model selector

---
 .changeset/autocomplete-model-picker.md       |  5 ++
 packages/kilo-vscode/src/KiloProvider.ts      |  3 +
 .../autocomplete/__tests__/settings.spec.ts   | 31 +++-------
 .../src/services/autocomplete/settings.ts     | 31 ++--------
 .../unit/autocomplete-model-selector.test.ts  | 20 +++++++
 .../components/settings/AutocompleteTab.tsx   | 40 ++++---------
 .../src/components/settings/ModelsTab.tsx     | 44 +++++---------
 .../settings/autocomplete-model-selector.ts   | 12 ++++
 .../src/components/shared/ModelSelector.tsx   | 15 ++++-
 .../webview-ui/src/context/config.tsx         | 60 ++++++++++++++++---
 .../webview-ui/src/stories/StoryProviders.tsx | 14 ++++-
 .../src/stories/settings.stories.tsx          | 26 ++++++++
 .../src/types/messages/webview-messages.ts    |  7 ---
 13 files changed, 184 insertions(+), 124 deletions(-)
 create mode 100644 .changeset/autocomplete-model-picker.md
 create mode 100644 packages/kilo-vscode/tests/unit/autocomplete-model-selector.test.ts
 create mode 100644 packages/kilo-vscode/webview-ui/src/components/settings/autocomplete-model-selector.ts

diff --git a/.changeset/autocomplete-model-picker.md b/.changeset/autocomplete-model-picker.md
new file mode 100644
index 00000000000..a24ba091f4d
--- /dev/null
+++ b/.changeset/autocomplete-model-picker.md
@@ -0,0 +1,5 @@
+---
+"kilo-code": patch
+---
+
+Show the autocomplete model selector with the same picker layout as other model selectors and save changes from the settings save bar.
diff --git a/packages/kilo-vscode/src/KiloProvider.ts b/packages/kilo-vscode/src/KiloProvider.ts
index f4ad6dd913b..a85dbd0b978 100644
--- a/packages/kilo-vscode/src/KiloProvider.ts
+++ b/packages/kilo-vscode/src/KiloProvider.ts
@@ -61,6 +61,7 @@ import { abortSession } from "./kilo-provider/abort"
 import {
   buildAutocompleteSettingsMessage,
   routeAutocompleteMessage,
+  validAutocompleteSetting,
   watchAutocompleteConfig,
 } from "./services/autocomplete/settings"
 import * as ModelState from "./kilo-provider/model-state"
@@ -2860,8 +2861,10 @@ export class KiloProvider implements vscode.WebviewViewProvider, TelemetryProper
    */
   private async handleUpdateSetting(key: string, value: unknown): Promise<void> {
     const { section, leaf } = buildSettingPath(key)
+    if (section === "autocomplete" && !validAutocompleteSetting(leaf, value)) return
     const config = vscode.workspace.getConfiguration(`kilo-code.new${section ? `.${section}` : ""}`)
     await config.update(leaf, value, vscode.ConfigurationTarget.Global)
+    if (section === "autocomplete") this.postMessage(buildAutocompleteSettingsMessage())
   }
 
   /**
diff --git a/packages/kilo-vscode/src/services/autocomplete/__tests__/settings.spec.ts b/packages/kilo-vscode/src/services/autocomplete/__tests__/settings.spec.ts
index 9ee596bc23b..4cc2eb0a535 100644
--- a/packages/kilo-vscode/src/services/autocomplete/__tests__/settings.spec.ts
+++ b/packages/kilo-vscode/src/services/autocomplete/__tests__/settings.spec.ts
@@ -1,7 +1,7 @@
 import { beforeEach, describe, expect, it, vi } from "vitest"
 
 const state = new Map<string, unknown>()
-const update = vi.fn(async (key: string, value: unknown) => {
+const update = vi.fn((key: string, value: unknown) => {
   state.set(key, value)
 })
 
@@ -44,36 +44,21 @@ describe("autocomplete settings", () => {
     expect(buildAutocompleteSettingsMessage().settings.model).toBe("mistralai/codestral-2508")
   })
 
-  it("persists supported model updates", async () => {
-    const post = vi.fn()
-    const { routeAutocompleteMessage } = await import("../settings")
+  it("validates supported model updates", async () => {
+    const { validAutocompleteSetting } = await import("../settings")
 
-    await routeAutocompleteMessage(
-      { type: "updateAutocompleteSetting", key: "model", value: "inception/mercury-edit" },
-      post,
-    )
-
-    expect(update).toHaveBeenCalledWith("model", "inception/mercury-edit", 1)
-    expect(post).toHaveBeenCalledWith(expect.objectContaining({ type: "autocompleteSettingsLoaded" }))
+    expect(validAutocompleteSetting("model", "inception/mercury-edit")).toBe(true)
   })
 
   it("rejects unsupported model updates", async () => {
-    const post = vi.fn()
-    const { routeAutocompleteMessage } = await import("../settings")
-
-    await routeAutocompleteMessage({ type: "updateAutocompleteSetting", key: "model", value: "other/model" }, post)
+    const { validAutocompleteSetting } = await import("../settings")
 
-    expect(update).not.toHaveBeenCalled()
-    expect(post).not.toHaveBeenCalled()
+    expect(validAutocompleteSetting("model", "other/model")).toBe(false)
   })
 
   it("rejects non-boolean toggle updates", async () => {
-    const post = vi.fn()
-    const { routeAutocompleteMessage } = await import("../settings")
-
-    await routeAutocompleteMessage({ type: "updateAutocompleteSetting", key: "enableAutoTrigger", value: "true" }, post)
+    const { validAutocompleteSetting } = await import("../settings")
 
-    expect(update).not.toHaveBeenCalled()
-    expect(post).not.toHaveBeenCalled()
+    expect(validAutocompleteSetting("enableAutoTrigger", "true")).toBe(false)
   })
 })
diff --git a/packages/kilo-vscode/src/services/autocomplete/settings.ts b/packages/kilo-vscode/src/services/autocomplete/settings.ts
index 029d4921291..9ec341406dc 100644
--- a/packages/kilo-vscode/src/services/autocomplete/settings.ts
+++ b/packages/kilo-vscode/src/services/autocomplete/settings.ts
@@ -1,12 +1,8 @@
 import * as vscode from "vscode"
 import { AUTOCOMPLETE_MODELS, getAutocompleteModel } from "../../shared/autocomplete-models"
 
-const keys = new Set(["enableAutoTrigger", "enableSmartInlineTaskKeybinding", "enableChatAutocomplete", "model"])
-
 type Message = {
   type: string
-  key?: unknown
-  value?: unknown
 }
 
 type Post = (msg: unknown) => void
@@ -17,13 +13,6 @@ export async function routeAutocompleteMessage(message: Message, post: Post): Pr
     return true
   }
 
-  if (message.type === "updateAutocompleteSetting") {
-    if (await update(message.key, message.value)) {
-      post(buildAutocompleteSettingsMessage())
-    }
-    return true
-  }
-
   return false
 }
 
@@ -49,23 +38,15 @@ export function watchAutocompleteConfig(post: Post): vscode.Disposable {
   })
 }
 
-async function update(key: unknown, value: unknown) {
-  if (typeof key !== "string") return false
-  if (!keys.has(key)) return false
-  if (!valid(key, value)) return false
-
-  await vscode.workspace
-    .getConfiguration("kilo-code.new.autocomplete")
-    .update(key, value, vscode.ConfigurationTarget.Global)
-
-  return true
-}
-
-function valid(key: string, value: unknown) {
+export function validAutocompleteSetting(key: string, value: unknown) {
   if (key === "model") {
     if (typeof value !== "string") return false
     return AUTOCOMPLETE_MODELS.some((m) => m.id === value)
   }
 
-  return typeof value === "boolean"
+  if (key === "enableAutoTrigger") return typeof value === "boolean"
+  if (key === "enableSmartInlineTaskKeybinding") return typeof value === "boolean"
+  if (key === "enableChatAutocomplete") return typeof value === "boolean"
+
+  return false
 }
diff --git a/packages/kilo-vscode/tests/unit/autocomplete-model-selector.test.ts b/packages/kilo-vscode/tests/unit/autocomplete-model-selector.test.ts
new file mode 100644
index 00000000000..1996041e917
--- /dev/null
+++ b/packages/kilo-vscode/tests/unit/autocomplete-model-selector.test.ts
@@ -0,0 +1,20 @@
+import { describe, expect, it } from "vitest"
+import {
+  AUTOCOMPLETE_PROVIDER_ID,
+  AUTOCOMPLETE_PROVIDER_NAME,
+  AUTOCOMPLETE_SELECTOR_MODELS,
+} from "../../webview-ui/src/components/settings/autocomplete-model-selector"
+import { AUTOCOMPLETE_MODELS } from "../../src/shared/autocomplete-models"
+
+describe("autocomplete model selector", () => {
+  it("shows only Kilo Gateway autocomplete models", () => {
+    expect(AUTOCOMPLETE_SELECTOR_MODELS).toEqual(
+      AUTOCOMPLETE_MODELS.map((m) => ({
+        id: m.id,
+        name: m.label,
+        providerID: AUTOCOMPLETE_PROVIDER_ID,
+        providerName: AUTOCOMPLETE_PROVIDER_NAME,
+      })),
+    )
+  })
+})
diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
index 072c5e0a925..f8cf320fd38 100644
--- a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
@@ -1,37 +1,21 @@
-import { Component, createSignal, onCleanup } from "solid-js"
+import { Component } from "solid-js"
 import { Switch } from "@kilocode/kilo-ui/switch"
 import { Card } from "@kilocode/kilo-ui/card"
-import { useVSCode } from "../../context/vscode"
+import { useConfig } from "../../context/config"
 import { useLanguage } from "../../context/language"
-import type { ExtensionMessage } from "../../types/messages"
 import SettingsRow from "./SettingsRow"
 
 const AutocompleteTab: Component = () => {
-  const vscode = useVSCode()
+  const { settings, updateSetting } = useConfig()
   const language = useLanguage()
 
-  const [enableAutoTrigger, setEnableAutoTrigger] = createSignal(true)
-  const [enableSmartInlineTaskKeybinding, setEnableSmartInlineTaskKeybinding] = createSignal(false)
-  const [enableChatAutocomplete, setEnableChatAutocomplete] = createSignal(false)
+  const enabled = (key: string, fallback: boolean) => Boolean(settings()[key] ?? fallback)
 
-  const unsubscribe = vscode.onMessage((message: ExtensionMessage) => {
-    if (message.type !== "autocompleteSettingsLoaded") {
-      return
-    }
-    setEnableAutoTrigger(message.settings.enableAutoTrigger)
-    setEnableSmartInlineTaskKeybinding(message.settings.enableSmartInlineTaskKeybinding)
-    setEnableChatAutocomplete(message.settings.enableChatAutocomplete)
-  })
-
-  onCleanup(unsubscribe)
-
-  vscode.postMessage({ type: "requestAutocompleteSettings" })
-
-  const updateSetting = (
+  const save = (
     key: "enableAutoTrigger" | "enableSmartInlineTaskKeybinding" | "enableChatAutocomplete",
     value: boolean,
   ) => {
-    vscode.postMessage({ type: "updateAutocompleteSetting", key, value })
+    updateSetting(`autocomplete.${key}`, value)
   }
 
   return (
@@ -42,8 +26,8 @@ const AutocompleteTab: Component = () => {
           description={language.t("settings.autocomplete.autoTrigger.description")}
         >
           <Switch
-            checked={enableAutoTrigger()}
-            onChange={(checked) => updateSetting("enableAutoTrigger", checked)}
+            checked={enabled("autocomplete.enableAutoTrigger", true)}
+            onChange={(checked) => save("enableAutoTrigger", checked)}
             hideLabel
           >
             {language.t("settings.autocomplete.autoTrigger.title")}
@@ -55,8 +39,8 @@ const AutocompleteTab: Component = () => {
           description={language.t("settings.autocomplete.smartKeybinding.description")}
         >
           <Switch
-            checked={enableSmartInlineTaskKeybinding()}
-            onChange={(checked) => updateSetting("enableSmartInlineTaskKeybinding", checked)}
+            checked={enabled("autocomplete.enableSmartInlineTaskKeybinding", false)}
+            onChange={(checked) => save("enableSmartInlineTaskKeybinding", checked)}
             hideLabel
           >
             {language.t("settings.autocomplete.smartKeybinding.title")}
@@ -69,8 +53,8 @@ const AutocompleteTab: Component = () => {
           last
         >
           <Switch
-            checked={enableChatAutocomplete()}
-            onChange={(checked) => updateSetting("enableChatAutocomplete", checked)}
+            checked={enabled("autocomplete.enableChatAutocomplete", false)}
+            onChange={(checked) => save("enableChatAutocomplete", checked)}
             hideLabel
           >
             {language.t("settings.autocomplete.chatAutocomplete.title")}
diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/ModelsTab.tsx b/packages/kilo-vscode/webview-ui/src/components/settings/ModelsTab.tsx
index 745e533ddf1..c961e2d943b 100644
--- a/packages/kilo-vscode/webview-ui/src/components/settings/ModelsTab.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/ModelsTab.tsx
@@ -1,31 +1,20 @@
-import { Component, For, createMemo, createSignal, onCleanup } from "solid-js"
+import { Component, For, createMemo } from "solid-js"
 import { Card } from "@kilocode/kilo-ui/card"
-import { Select } from "@kilocode/kilo-ui/select"
 import { useConfig } from "../../context/config"
 import { useLanguage } from "../../context/language"
 import { useSession } from "../../context/session"
-import { useVSCode } from "../../context/vscode"
 import { parseModelString } from "../../../../src/shared/provider-model"
-import { AUTOCOMPLETE_MODELS, DEFAULT_AUTOCOMPLETE_MODEL } from "../../../../src/shared/autocomplete-models"
+import { DEFAULT_AUTOCOMPLETE_MODEL } from "../../../../src/shared/autocomplete-models"
 import { ModelSelectorBase } from "../shared/ModelSelector"
 import SettingsRow from "./SettingsRow"
-import type { ExtensionMessage } from "../../types/messages"
+import { AUTOCOMPLETE_PROVIDER_ID, AUTOCOMPLETE_SELECTOR_MODELS } from "./autocomplete-model-selector"
 
 const ModelsTab: Component = () => {
-  const { config, updateConfig } = useConfig()
+  const { config, settings, updateConfig, updateSetting } = useConfig()
   const language = useLanguage()
   const session = useSession()
-  const vscode = useVSCode()
 
-  const [autocompleteModel, setAutocompleteModel] = createSignal<string>(DEFAULT_AUTOCOMPLETE_MODEL.id)
-
-  const unsubscribe = vscode.onMessage((message: ExtensionMessage) => {
-    if (message.type === "autocompleteSettingsLoaded") {
-      setAutocompleteModel(message.settings.model)
-    }
-  })
-  onCleanup(unsubscribe)
-  vscode.postMessage({ type: "requestAutocompleteSettings" })
+  const autocompleteModel = () => String(settings()["autocomplete.model"] ?? DEFAULT_AUTOCOMPLETE_MODEL.id)
 
   function handleModelSelect(configKey: "model" | "small_model") {
     return (providerID: string, modelID: string) => {
@@ -49,6 +38,11 @@ const ModelsTab: Component = () => {
     }
   }
 
+  function handleAutocompleteModelSelect(providerID: string, modelID: string) {
+    if (providerID !== AUTOCOMPLETE_PROVIDER_ID || !modelID) return
+    updateSetting("autocomplete.model", modelID)
+  }
+
   return (
     <div>
       <Card>
@@ -82,18 +76,12 @@ const ModelsTab: Component = () => {
           description={language.t("settings.autocomplete.model.description")}
           last
         >
-          <Select
-            options={AUTOCOMPLETE_MODELS.map((m) => m.id)}
-            current={autocompleteModel()}
-            label={(opt: string) => AUTOCOMPLETE_MODELS.find((m) => m.id === opt)?.label ?? opt}
-            value={(opt: string) => opt}
-            onSelect={(opt) => {
-              if (opt !== undefined) {
-                setAutocompleteModel(opt)
-                vscode.postMessage({ type: "updateAutocompleteSetting", key: "model", value: opt })
-              }
-            }}
-            triggerVariant="settings"
+          <ModelSelectorBase
+            value={{ providerID: AUTOCOMPLETE_PROVIDER_ID, modelID: autocompleteModel() }}
+            onSelect={handleAutocompleteModelSelect}
+            placement="bottom-start"
+            models={AUTOCOMPLETE_SELECTOR_MODELS}
+            favorites={false}
           />
         </SettingsRow>
       </Card>
diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/autocomplete-model-selector.ts b/packages/kilo-vscode/webview-ui/src/components/settings/autocomplete-model-selector.ts
new file mode 100644
index 00000000000..9dd6e87996b
--- /dev/null
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/autocomplete-model-selector.ts
@@ -0,0 +1,12 @@
+import { AUTOCOMPLETE_MODELS } from "../../../../src/shared/autocomplete-models"
+import type { EnrichedModel } from "../../context/provider"
+
+export const AUTOCOMPLETE_PROVIDER_ID = "kilo"
+export const AUTOCOMPLETE_PROVIDER_NAME = "Kilo Gateway"
+
+export const AUTOCOMPLETE_SELECTOR_MODELS: EnrichedModel[] = AUTOCOMPLETE_MODELS.map((m) => ({
+  id: m.id,
+  name: m.label,
+  providerID: AUTOCOMPLETE_PROVIDER_ID,
+  providerName: AUTOCOMPLETE_PROVIDER_NAME,
+}))
diff --git a/packages/kilo-vscode/webview-ui/src/components/shared/ModelSelector.tsx b/packages/kilo-vscode/webview-ui/src/components/shared/ModelSelector.tsx
index 8d902d37a5d..6fc3f3c7022 100644
--- a/packages/kilo-vscode/webview-ui/src/components/shared/ModelSelector.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/shared/ModelSelector.tsx
@@ -90,6 +90,10 @@ export interface ModelSelectorBaseProps {
   clearLabel?: string
   /** Include the kilo-auto/small model in the list — defaults to false */
   includeAutoSmall?: boolean
+  /** Override the provider catalog for constrained selectors. */
+  models?: EnrichedModel[]
+  /** Show favorites group and favorite buttons — defaults to true. */
+  favorites?: boolean
 }
 
 export const ModelSelectorBase: Component<ModelSelectorBaseProps> = (props) => {
@@ -98,7 +102,11 @@ export const ModelSelectorBase: Component<ModelSelectorBaseProps> = (props) => {
   // Session context is optional — ModelSelectorBase is also used in Settings
   // where SessionProvider may not be mounted.
   const session = useContext(SessionContext)
-  const activeModel = () => findModel(props.value)
+  const activeModel = () => {
+    const items = props.models
+    if (items) return items.find((m) => m.providerID === props.value?.providerID && m.id === props.value?.modelID)
+    return findModel(props.value)
+  }
 
   const [open, setOpen] = createSignal(false)
   const [expanded, setExpanded] = createSignal(false)
@@ -153,6 +161,7 @@ export const ModelSelectorBase: Component<ModelSelectorBaseProps> = (props) => {
   // Only show models from Kilo Gateway or connected providers.
   // kilo-auto/small is excluded unless includeAutoSmall is explicitly true.
   const visibleModels = createMemo(() => {
+    if (props.models) return props.models
     const c = connected()
     return models().filter((m) => {
       if (!props.includeAutoSmall && isSmall(m)) return false
@@ -184,11 +193,13 @@ export const ModelSelectorBase: Component<ModelSelectorBaseProps> = (props) => {
   // Live set of favorited keys — drives star icon visual state (filled vs outline).
   // Toggling never changes the list structure, so no items jump.
   const favoriteKeys = createMemo(() => {
+    if (props.favorites === false) return new Set<string>()
     if (!session) return new Set<string>()
     return new Set(session.favoriteModels().map((f) => modelKey(f.providerID, f.modelID)))
   })
 
   const favoriteModels = createMemo(() => {
+    if (props.favorites === false) return []
     if (!session || debouncedSearch()) return []
     const map = new Map(visibleModels().map((m) => [modelKey(m.providerID, m.id), m]))
     const list = session
@@ -674,7 +685,7 @@ export const ModelSelectorBase: Component<ModelSelectorBaseProps> = (props) => {
                                 <span class="model-selector-item-provider-tag">{model.providerName}</span>
                               </Show>
                             </div>
-                            <Show when={session}>
+                            <Show when={session && props.favorites !== false}>
                               <button
                                 type="button"
                                 class={`model-selector-star${starred() ? " model-selector-star--active" : ""}`}
diff --git a/packages/kilo-vscode/webview-ui/src/context/config.tsx b/packages/kilo-vscode/webview-ui/src/context/config.tsx
index 29a61b8c708..e7d2d6ea317 100644
--- a/packages/kilo-vscode/webview-ui/src/context/config.tsx
+++ b/packages/kilo-vscode/webview-ui/src/context/config.tsx
@@ -8,7 +8,7 @@
  * changes into a single write (which triggers disposeAll on the CLI).
  */
 
-import { createContext, useContext, createSignal, onCleanup } from "solid-js"
+import { createContext, useContext, createSignal, createMemo, onCleanup } from "solid-js"
 import type { ParentComponent, Accessor } from "solid-js"
 import { useVSCode } from "./vscode"
 import type { Config, ExtensionMessage, FeatureFlags } from "../types/messages"
@@ -29,6 +29,10 @@ function splitByScope(draft: Partial<Config>) {
   return { global: global as Partial<Config>, project: project as Partial<Config> }
 }
 
+function has(value: Record<string, unknown>) {
+  return Object.keys(value).length > 0
+}
+
 export interface SaveError {
   message: string
   details?: string
@@ -36,12 +40,14 @@ export interface SaveError {
 
 interface ConfigContextValue {
   config: Accessor<Config>
+  settings: Accessor<Record<string, unknown>>
   features: Accessor<FeatureFlags>
   loading: Accessor<boolean>
   isDirty: Accessor<boolean>
   saving: Accessor<boolean>
   saveError: Accessor<SaveError | null>
   updateConfig: (partial: Partial<Config>) => void
+  updateSetting: (key: string, value: unknown) => void
   saveConfig: () => void
   discardConfig: () => void
 }
@@ -52,12 +58,15 @@ export const ConfigProvider: ParentComponent = (props) => {
   const vscode = useVSCode()
 
   const [config, setConfig] = createSignal<Config>({})
+  const [settings, setSettings] = createSignal<Record<string, unknown>>({})
   const [features, setFeatures] = createSignal<FeatureFlags>({ indexing: false })
   const [loading, setLoading] = createSignal(true)
   const [draft, setDraft] = createSignal<Partial<Config>>({})
-  const [isDirty, setIsDirty] = createSignal(false)
+  const [settingsDraft, setSettingsDraft] = createSignal<Record<string, unknown>>({})
+  const isDirty = createMemo(() => has(draft() as Record<string, unknown>) || has(settingsDraft()))
   // Last config received from the server — used to revert on discard
   const [saved, setSaved] = createSignal<Config>({})
+  const [savedSettings, setSavedSettings] = createSignal<Record<string, unknown>>({})
   // True while a saveConfig() write is in-flight — used to clear draft on success
   // and to guard against stale configLoaded messages overwriting optimistic state.
   const [saving, setSaving] = createSignal(false)
@@ -68,13 +77,24 @@ export const ConfigProvider: ParentComponent = (props) => {
   // Register handler immediately (not in onMount) so we never miss
   // a configLoaded message that arrives before the DOM mount.
   const unsubscribe = vscode.onMessage((message: ExtensionMessage) => {
+    if (message.type === "autocompleteSettingsLoaded") {
+      const patch = {
+        "autocomplete.enableAutoTrigger": message.settings.enableAutoTrigger,
+        "autocomplete.enableSmartInlineTaskKeybinding": message.settings.enableSmartInlineTaskKeybinding,
+        "autocomplete.enableChatAutocomplete": message.settings.enableChatAutocomplete,
+        "autocomplete.model": message.settings.model,
+      }
+      setSavedSettings((prev) => ({ ...prev, ...patch }))
+      setSettings((prev) => ({ ...prev, ...patch, ...settingsDraft() }))
+      return
+    }
     if (message.type === "configLoaded") {
       // Skip if a save is in-flight — a stale configLoaded must not overwrite
       // the optimistically-updated state while the write is being confirmed.
       if (saving()) return
       // Re-apply the draft on top so pending changes (e.g. a toggled switch the
       // user hasn't saved yet) stay visible instead of snapping back.
-      setConfig(resolveConfig(message.config, draft(), isDirty()))
+      setConfig(resolveConfig(message.config, draft(), has(draft() as Record<string, unknown>)))
       setFeatures(message.features)
       setSaved(message.config)
       setLoading(false)
@@ -86,14 +106,13 @@ export const ConfigProvider: ParentComponent = (props) => {
         // Clear the draft now that the server has confirmed the write.
         setSaving(false)
         setDraft({})
-        setIsDirty(false)
         setSaveError(null)
         setConfig(message.config)
         setFeatures(message.features)
       } else {
         // configUpdated from a different source (e.g. PermissionDock save).
         // Re-apply the draft on top so pending settings changes are preserved.
-        setConfig(resolveConfig(message.config, draft(), isDirty()))
+        setConfig(resolveConfig(message.config, draft(), has(draft() as Record<string, unknown>)))
         setFeatures(message.features)
       }
       setSaved(message.config)
@@ -113,10 +132,12 @@ export const ConfigProvider: ParentComponent = (props) => {
   // Request config immediately; if the extension's httpClient is not yet ready,
   // extensionDataReady will fire once initialization completes and we retry once.
   vscode.postMessage({ type: "requestConfig" })
+  vscode.postMessage({ type: "requestAutocompleteSettings" })
 
   const fallback = setTimeout(() => {
     if (loading()) {
       vscode.postMessage({ type: "requestConfig" })
+      vscode.postMessage({ type: "requestAutocompleteSettings" })
     }
   }, 3000)
 
@@ -126,6 +147,7 @@ export const ConfigProvider: ParentComponent = (props) => {
     clearTimeout(fallback)
     if (loading()) {
       vscode.postMessage({ type: "requestConfig" })
+      vscode.postMessage({ type: "requestAutocompleteSettings" })
     }
   })
 
@@ -139,19 +161,38 @@ export const ConfigProvider: ParentComponent = (props) => {
     setConfig((prev) => stripNulls(deepMerge(prev, partial)))
     // Accumulate in draft — will be sent on saveConfig()
     setDraft((prev) => deepMerge(prev as Config, partial))
-    setIsDirty(true)
     // Clear any stale error from a previous failed save — the user is editing
     // again, so the old error message no longer reflects the current draft.
     setSaveError(null)
   }
 
+  function updateSetting(key: string, value: unknown) {
+    setSettings((prev) => ({ ...prev, [key]: value }))
+    setSettingsDraft((prev) => ({ ...prev, [key]: value }))
+    setSaveError(null)
+  }
+
   function saveConfig() {
     const changes = draft()
-    if (Object.keys(changes).length === 0) return
+    const pending = settingsDraft()
+    const configDirty = has(changes as Record<string, unknown>)
+    const settingsDirty = has(pending)
+    if (!configDirty && !settingsDirty) return
     // Don't clear draft/isDirty yet — wait for configUpdated confirmation.
     // If the write fails, the save bar stays visible so the user can retry.
     setSaving(true)
     setSaveError(null)
+    if (settingsDirty) {
+      for (const [key, value] of Object.entries(pending)) {
+        vscode.postMessage({ type: "updateSetting", key, value })
+      }
+      setSavedSettings((prev) => ({ ...prev, ...pending }))
+      setSettingsDraft({})
+    }
+    if (!configDirty) {
+      setSaving(false)
+      return
+    }
     // Split so per-project settings (e.g. commit_message.prompt) land in the
     // workspace's kilo.json instead of the global one. Send one message so the
     // extension confirms only after both scopes are saved.
@@ -162,18 +203,21 @@ export const ConfigProvider: ParentComponent = (props) => {
   function discardConfig() {
     setConfig(saved())
     setDraft({})
-    setIsDirty(false)
+    setSettings(savedSettings())
+    setSettingsDraft({})
     setSaveError(null)
   }
 
   const value: ConfigContextValue = {
     config,
+    settings,
     features,
     loading,
     isDirty,
     saving,
     saveError,
     updateConfig,
+    updateSetting,
     saveConfig,
     discardConfig,
   }
diff --git a/packages/kilo-vscode/webview-ui/src/stories/StoryProviders.tsx b/packages/kilo-vscode/webview-ui/src/stories/StoryProviders.tsx
index ea309a6a669..4c23ddd195b 100644
--- a/packages/kilo-vscode/webview-ui/src/stories/StoryProviders.tsx
+++ b/packages/kilo-vscode/webview-ui/src/stories/StoryProviders.tsx
@@ -270,6 +270,8 @@ interface StoryProvidersProps {
 const ConfigWrapper: ParentComponent<{ config?: Config; onConfigChange?: (config: Config) => void }> = (props) => {
   if (props.config) {
     const [cfg, setCfg] = createSignal(props.config)
+    const [settings, setSettings] = createSignal<Record<string, unknown>>({})
+    const [dirty, setDirty] = createSignal(false)
     const features = createMemo(() => {
       const config = cfg() as Config & {
         plugin?: readonly PluginSpec[] | null
@@ -282,9 +284,10 @@ const ConfigWrapper: ParentComponent<{ config?: Config; onConfigChange?: (config
 
     const value = {
       config: createMemo(() => cfg()),
+      settings,
       features,
       loading: () => false,
-      isDirty: () => false,
+      isDirty: dirty,
       saving: () => false,
       saveError: () => null,
       updateConfig: (partial: Partial<Config>) => {
@@ -293,9 +296,14 @@ const ConfigWrapper: ParentComponent<{ config?: Config; onConfigChange?: (config
           props.onConfigChange?.(next)
           return next
         })
+        setDirty(true)
       },
-      saveConfig: noop,
-      discardConfig: noop,
+      updateSetting: (key: string, value: unknown) => {
+        setSettings((prev) => ({ ...prev, [key]: value }))
+        setDirty(true)
+      },
+      saveConfig: () => setDirty(false),
+      discardConfig: () => setDirty(false),
     }
     return <ConfigContext.Provider value={value}>{props.children}</ConfigContext.Provider>
   }
diff --git a/packages/kilo-vscode/webview-ui/src/stories/settings.stories.tsx b/packages/kilo-vscode/webview-ui/src/stories/settings.stories.tsx
index 69f397e5fc6..8cceb03571e 100644
--- a/packages/kilo-vscode/webview-ui/src/stories/settings.stories.tsx
+++ b/packages/kilo-vscode/webview-ui/src/stories/settings.stories.tsx
@@ -9,6 +9,7 @@ import { StoryProviders, mockSessionValue } from "./StoryProviders"
 import { SessionContext } from "../context/session"
 import Settings from "../components/settings/Settings"
 import ProvidersTab from "../components/settings/ProvidersTab"
+import ModelsTab from "../components/settings/ModelsTab"
 import AgentBehaviourTab from "../components/settings/AgentBehaviourTab"
 import ModeEditView from "../components/settings/ModeEditView"
 import McpEditView from "../components/settings/McpEditView"
@@ -58,6 +59,31 @@ export const ProvidersConfigure: Story = {
   ),
 }
 
+export const ModelsAutocompleteOpen: Story = {
+  name: "ModelsTab — autocomplete model picker open",
+  render: () => (
+    <StoryProviders config={{} as any}>
+      <OpenModelPicker>
+        <ModelsTab />
+      </OpenModelPicker>
+    </StoryProviders>
+  ),
+}
+
+function OpenModelPicker(props: { children: any }) {
+  let ref: HTMLDivElement | undefined
+  onMount(() => {
+    requestAnimationFrame(() => {
+      ref?.querySelector<HTMLButtonElement>('button[title="mistralai/codestral-2508"]')?.click()
+    })
+  })
+  return (
+    <div ref={ref} style={{ "max-height": "700px", overflow: "auto" }}>
+      {props.children}
+    </div>
+  )
+}
+
 export const AgentBehaviourAgents: Story = {
   name: "AgentBehaviourTab — available agents list",
   render: () => {
diff --git a/packages/kilo-vscode/webview-ui/src/types/messages/webview-messages.ts b/packages/kilo-vscode/webview-ui/src/types/messages/webview-messages.ts
index 9ac9fea4e05..9edc35b2114 100644
--- a/packages/kilo-vscode/webview-ui/src/types/messages/webview-messages.ts
+++ b/packages/kilo-vscode/webview-ui/src/types/messages/webview-messages.ts
@@ -310,12 +310,6 @@ export interface RequestAutocompleteSettingsMessage {
   type: "requestAutocompleteSettings"
 }
 
-export interface UpdateAutocompleteSettingMessage {
-  type: "updateAutocompleteSetting"
-  key: "enableAutoTrigger" | "enableSmartInlineTaskKeybinding" | "enableChatAutocomplete" | "model"
-  value: boolean | string
-}
-
 export interface RequestChatCompletionMessage {
   type: "requestChatCompletion"
   text: string
@@ -1029,7 +1023,6 @@ export type WebviewMessage =
   | DeleteSessionRequest
   | RenameSessionRequest
   | RequestAutocompleteSettingsMessage
-  | UpdateAutocompleteSettingMessage
   | RequestChatCompletionMessage
   | RequestFileSearchMessage
   | RequestTerminalContextMessage

From 04defbcbc98277b693438ab4968e19bd8bca3cbc Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Tue, 5 May 2026 09:11:00 +0000
Subject: [PATCH 2/7] chore: update kilo-vscode visual regression baselines

---
 .../settings/models-autocomplete-open-chromium-linux.png       | 3 +++
 1 file changed, 3 insertions(+)
 create mode 100644 packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png

diff --git a/packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png b/packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png
new file mode 100644
index 00000000000..3418e5c6e07
--- /dev/null
+++ b/packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png
@@ -0,0 +1,3 @@
+version https://git-lfs.github.com/spec/v1
+oid sha256:b6c7324e1b72734456451dd9c33f985e8e737c5f2fa6fd34030047850f6ff7d7
+size 29562

From 35a1aa043ddd395c44392152e949bb7595acef96 Mon Sep 17 00:00:00 2001
From: "kiloconnect[bot]" <240665456+kiloconnect[bot]@users.noreply.github.com>
Date: Tue, 5 May 2026 09:49:37 +0000
Subject: [PATCH 3/7] fix(vscode): keep provider file within line cap

---
 packages/kilo-vscode/src/KiloProvider.ts | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/kilo-vscode/src/KiloProvider.ts b/packages/kilo-vscode/src/KiloProvider.ts
index a85dbd0b978..741e912891c 100644
--- a/packages/kilo-vscode/src/KiloProvider.ts
+++ b/packages/kilo-vscode/src/KiloProvider.ts
@@ -2864,7 +2864,6 @@ export class KiloProvider implements vscode.WebviewViewProvider, TelemetryProper
     if (section === "autocomplete" && !validAutocompleteSetting(leaf, value)) return
     const config = vscode.workspace.getConfiguration(`kilo-code.new${section ? `.${section}` : ""}`)
     await config.update(leaf, value, vscode.ConfigurationTarget.Global)
-    if (section === "autocomplete") this.postMessage(buildAutocompleteSettingsMessage())
   }
 
   /**

From 8e2d0205e0e8772507960643e8eb31f826d91526 Mon Sep 17 00:00:00 2001
From: "github-actions[bot]" <github-actions[bot]@users.noreply.github.com>
Date: Wed, 6 May 2026 08:24:28 +0000
Subject: [PATCH 4/7] chore: update kilo-vscode visual regression baselines

---
 .../settings/models-autocomplete-open-chromium-linux.png      | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png b/packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png
index 3418e5c6e07..e395b8b062d 100644
--- a/packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png
+++ b/packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/settings/models-autocomplete-open-chromium-linux.png
@@ -1,3 +1,3 @@
 version https://git-lfs.github.com/spec/v1
-oid sha256:b6c7324e1b72734456451dd9c33f985e8e737c5f2fa6fd34030047850f6ff7d7
-size 29562
+oid sha256:bdcac95e7969d021ebce19001f37f86b8ab670bd79e39086385c9419617294df
+size 27177

From 52429a2e18b8f3d25c8f477a3fd14710dc9e3a26 Mon Sep 17 00:00:00 2001
From: Mark IJbema <mark@kilocode.ai>
Date: Thu, 7 May 2026 11:10:55 +0200
Subject: [PATCH 5/7] feat(vscode): hint to Models tab in autocomplete settings

Add a clickable hint at the bottom of the autocomplete settings
that navigates to the Models tab so users can find where to choose
the autocomplete model. Bump KiloProvider max-lines to 3430.
---
 packages/kilo-vscode/eslint.config.mjs        |  2 +-
 .../components/settings/AutocompleteTab.tsx   | 20 ++++++++++++++++++-
 .../src/components/settings/Settings.tsx      |  2 +-
 .../kilo-vscode/webview-ui/src/i18n/ar.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/br.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/bs.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/da.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/de.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/en.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/es.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/fr.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/ja.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/ko.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/nl.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/no.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/pl.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/ru.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/th.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/tr.ts     |  2 ++
 .../kilo-vscode/webview-ui/src/i18n/uk.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/zh.ts     |  1 +
 .../kilo-vscode/webview-ui/src/i18n/zht.ts    |  1 +
 22 files changed, 49 insertions(+), 3 deletions(-)

diff --git a/packages/kilo-vscode/eslint.config.mjs b/packages/kilo-vscode/eslint.config.mjs
index b11a766659b..8bba08c3364 100644
--- a/packages/kilo-vscode/eslint.config.mjs
+++ b/packages/kilo-vscode/eslint.config.mjs
@@ -38,7 +38,7 @@ export default [
   // New code must stay ≤ 20. Do not raise these caps; refactor instead.
   {
     files: ["src/KiloProvider.ts"],
-    rules: { complexity: ["error", 150], "max-lines": ["error", 3420] },
+    rules: { complexity: ["error", 150], "max-lines": ["error", 3430] },
   },
   {
     files: ["webview-ui/agent-manager/AgentManagerApp.tsx"],
diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
index f8cf320fd38..f6783905455 100644
--- a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
@@ -5,7 +5,7 @@ import { useConfig } from "../../context/config"
 import { useLanguage } from "../../context/language"
 import SettingsRow from "./SettingsRow"
 
-const AutocompleteTab: Component = () => {
+const AutocompleteTab: Component<{ onNavigateToModels?: () => void }> = (props) => {
   const { settings, updateSetting } = useConfig()
   const language = useLanguage()
 
@@ -61,6 +61,24 @@ const AutocompleteTab: Component = () => {
           </Switch>
         </SettingsRow>
       </Card>
+      <p
+        data-slot="autocomplete-models-hint"
+        style={{
+          "margin-top": "12px",
+          "font-size": "var(--kilo-font-size-12)",
+          color: "var(--text-weak-base, var(--vscode-descriptionForeground))",
+        }}
+      >
+        <a
+          href="#"
+          onClick={(e) => {
+            e.preventDefault()
+            props.onNavigateToModels?.()
+          }}
+        >
+          {language.t("settings.autocomplete.modelsHint")}
+        </a>
+      </p>
     </div>
   )
 }
diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/Settings.tsx b/packages/kilo-vscode/webview-ui/src/components/settings/Settings.tsx
index 023f49e55a0..c693b517ed8 100644
--- a/packages/kilo-vscode/webview-ui/src/components/settings/Settings.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/Settings.tsx
@@ -240,7 +240,7 @@ const Settings: Component<SettingsProps> = (props) => {
         </Tabs.Content>
         <Tabs.Content value="autocomplete">
           <h3>{language.t("settings.autocomplete.title")}</h3>
-          <AutocompleteTab />
+          <AutocompleteTab onNavigateToModels={() => onTabChange("models")} />
         </Tabs.Content>
         <Tabs.Content value="notifications">
           <h3>{language.t("settings.notifications.title")}</h3>
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/ar.ts b/packages/kilo-vscode/webview-ui/src/i18n/ar.ts
index ebecf678204..4c73b268257 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/ar.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/ar.ts
@@ -1151,6 +1151,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "استخدام اختصار ذكي لتشغيل المهام المضمّنة",
   "settings.autocomplete.chatAutocomplete.title": "تمكين الإكمال التلقائي للدردشة",
   "settings.autocomplete.chatAutocomplete.description": "عرض اقتراحات الإكمال التلقائي في مربع الدردشة",
+  "settings.autocomplete.modelsHint": "لاختيار النموذج المستخدم للإكمال التلقائي، راجع إعدادات النماذج.",
   "settings.notifications.agent.title": "إكمال الوكيل",
   "settings.notifications.agent.description": "إظهار إشعار عند إكمال الوكيل لمهمة",
   "settings.notifications.permissions.title": "طلبات الأذونات",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/br.ts b/packages/kilo-vscode/webview-ui/src/i18n/br.ts
index 3bf2e6e760a..ccdf571eed9 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/br.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/br.ts
@@ -1176,6 +1176,8 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Usar um atalho inteligente para acionar tarefas inline",
   "settings.autocomplete.chatAutocomplete.title": "Ativar autocompletar do chat",
   "settings.autocomplete.chatAutocomplete.description": "Mostrar sugestões de autocompletar no campo de chat",
+  "settings.autocomplete.modelsHint":
+    "Para escolher qual modelo é usado para autocompletar, veja as configurações de Modelos.",
   "settings.notifications.agent.title": "Conclusão do agente",
   "settings.notifications.agent.description": "Mostrar notificação quando o agente conclui uma tarefa",
   "settings.notifications.permissions.title": "Solicitações de permissão",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/bs.ts b/packages/kilo-vscode/webview-ui/src/i18n/bs.ts
index 899bf58cd1c..db14df10a84 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/bs.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/bs.ts
@@ -1177,6 +1177,8 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Koristi pametnu prečicu za pokretanje inline zadataka",
   "settings.autocomplete.chatAutocomplete.title": "Omogući automatsko dovršavanje chata",
   "settings.autocomplete.chatAutocomplete.description": "Prikaži prijedloge automatskog dovršavanja u polju chata",
+  "settings.autocomplete.modelsHint":
+    "Da odaberete koji se model koristi za automatsko dovršavanje, pogledajte postavke Modela.",
   "settings.notifications.agent.title": "Završetak agenta",
   "settings.notifications.agent.description": "Prikaži obavijest kada agent završi zadatak",
   "settings.notifications.permissions.title": "Zahtjevi za dozvolu",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/da.ts b/packages/kilo-vscode/webview-ui/src/i18n/da.ts
index 810291f964e..75d142fa37d 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/da.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/da.ts
@@ -1170,6 +1170,8 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Brug en smart tastaturgenvej til at udløse inline-opgaver",
   "settings.autocomplete.chatAutocomplete.title": "Aktiver chat-autofuldførelse",
   "settings.autocomplete.chatAutocomplete.description": "Vis autofuldførelsesforslag i chatfeltet",
+  "settings.autocomplete.modelsHint":
+    "For at vælge hvilken model der bruges til autofuldførelse, se Modelindstillinger.",
   "settings.notifications.agent.title": "Agentafslutning",
   "settings.notifications.agent.description": "Vis notifikation, når agenten fuldfører en opgave",
   "settings.notifications.permissions.title": "Tilladelsesanmodninger",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/de.ts b/packages/kilo-vscode/webview-ui/src/i18n/de.ts
index 51d9e7d6a88..58b55197289 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/de.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/de.ts
@@ -1191,6 +1191,8 @@ export const dict = {
     "Eine intelligente Tastenkombination zum Auslösen von Inline-Aufgaben verwenden",
   "settings.autocomplete.chatAutocomplete.title": "Chat-Textfeld-Autovervollständigung aktivieren",
   "settings.autocomplete.chatAutocomplete.description": "Autovervollständigungsvorschläge im Chat-Textfeld anzeigen",
+  "settings.autocomplete.modelsHint":
+    "Um zu wählen, welches Modell für die Autovervollständigung verwendet wird, siehe Modelleinstellungen.",
   "settings.notifications.agent.title": "Agent-Abschluss",
   "settings.notifications.agent.description": "Benachrichtigung anzeigen, wenn der Agent eine Aufgabe abschließt",
   "settings.notifications.permissions.title": "Berechtigungsanfragen",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/en.ts b/packages/kilo-vscode/webview-ui/src/i18n/en.ts
index 867f164d38b..f7272326935 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/en.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/en.ts
@@ -1162,6 +1162,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Use a smart keybinding for triggering inline tasks",
   "settings.autocomplete.chatAutocomplete.title": "Enable chat textarea autocomplete",
   "settings.autocomplete.chatAutocomplete.description": "Show autocomplete suggestions in the chat textarea",
+  "settings.autocomplete.modelsHint": "To choose which model is used for autocompletions, see the Models settings.",
 
   "settings.notifications.agent.title": "Agent Completion",
   "settings.notifications.agent.description": "Show notification when agent completes a task",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/es.ts b/packages/kilo-vscode/webview-ui/src/i18n/es.ts
index 74afd4f7b15..460c35980d4 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/es.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/es.ts
@@ -1182,6 +1182,8 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Usar un atajo inteligente para activar tareas en línea",
   "settings.autocomplete.chatAutocomplete.title": "Habilitar autocompletado del chat",
   "settings.autocomplete.chatAutocomplete.description": "Mostrar sugerencias de autocompletado en el chat",
+  "settings.autocomplete.modelsHint":
+    "Para elegir qué modelo se usa para el autocompletado, consulta la configuración de Modelos.",
   "settings.notifications.agent.title": "Finalización del agente",
   "settings.notifications.agent.description": "Mostrar notificación cuando el agente completa una tarea",
   "settings.notifications.permissions.title": "Solicitudes de permiso",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/fr.ts b/packages/kilo-vscode/webview-ui/src/i18n/fr.ts
index 2e7e320e9fe..8c5f4ac8064 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/fr.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/fr.ts
@@ -1194,6 +1194,8 @@ export const dict = {
     "Utiliser un raccourci intelligent pour déclencher les tâches en ligne",
   "settings.autocomplete.chatAutocomplete.title": "Activer l'autocomplétion du chat",
   "settings.autocomplete.chatAutocomplete.description": "Afficher les suggestions d'autocomplétion dans le chat",
+  "settings.autocomplete.modelsHint":
+    "Pour choisir le modèle utilisé pour l'autocomplétion, consultez les paramètres des Modèles.",
   "settings.notifications.agent.title": "Achèvement de l'agent",
   "settings.notifications.agent.description": "Afficher une notification lorsque l'agent termine une tâche",
   "settings.notifications.permissions.title": "Demandes d'autorisation",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/ja.ts b/packages/kilo-vscode/webview-ui/src/i18n/ja.ts
index 2e5e86f17b7..eafcacd6983 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/ja.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/ja.ts
@@ -1166,6 +1166,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "インラインタスクをトリガーするスマートキーバインドを使用",
   "settings.autocomplete.chatAutocomplete.title": "チャットの自動補完を有効にする",
   "settings.autocomplete.chatAutocomplete.description": "チャットテキストエリアに自動補完の提案を表示",
+  "settings.autocomplete.modelsHint": "オートコンプリートに使用するモデルを選択するには、モデル設定をご覧ください。",
   "settings.notifications.agent.title": "エージェント完了",
   "settings.notifications.agent.description": "エージェントがタスクを完了したら通知を表示",
   "settings.notifications.permissions.title": "権限リクエスト",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/ko.ts b/packages/kilo-vscode/webview-ui/src/i18n/ko.ts
index 822f7cb29bc..33a85006d50 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/ko.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/ko.ts
@@ -1160,6 +1160,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "인라인 작업을 트리거하는 스마트 키바인딩 사용",
   "settings.autocomplete.chatAutocomplete.title": "채팅 텍스트 영역 자동완성 활성화",
   "settings.autocomplete.chatAutocomplete.description": "채팅 텍스트 영역에서 자동완성 제안 표시",
+  "settings.autocomplete.modelsHint": "자동 완성에 사용되는 모델을 선택하려면 모델 설정을 참조하세요.",
   "settings.notifications.agent.title": "에이전트 완료",
   "settings.notifications.agent.description": "에이전트가 작업을 완료하면 알림 표시",
   "settings.notifications.permissions.title": "권한 요청",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/nl.ts b/packages/kilo-vscode/webview-ui/src/i18n/nl.ts
index 957bb642c95..2fe8bc3337c 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/nl.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/nl.ts
@@ -1177,6 +1177,8 @@ export const dict = {
   "settings.autocomplete.chatAutocomplete.title": "Chat tekstveld automatisch aanvullen inschakelen",
   "settings.autocomplete.chatAutocomplete.description":
     "Toon suggesties voor automatisch aanvullen in het chat tekstveld",
+  "settings.autocomplete.modelsHint":
+    "Om te kiezen welk model wordt gebruikt voor automatisch aanvullen, zie de Modellen-instellingen.",
 
   "settings.notifications.agent.title": "Agent Voltooiing",
   "settings.notifications.agent.description": "Toon melding wanneer agent een taak voltooit",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/no.ts b/packages/kilo-vscode/webview-ui/src/i18n/no.ts
index ab6fa96ac75..4ce3e7401c2 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/no.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/no.ts
@@ -1147,6 +1147,8 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Bruk en smart tastbinding for å utløse innebygde oppgaver",
   "settings.autocomplete.chatAutocomplete.title": "Aktiver chat-autofullføring",
   "settings.autocomplete.chatAutocomplete.description": "Vis autofullføringsforslag i chatfeltet",
+  "settings.autocomplete.modelsHint":
+    "For å velge hvilken modell som brukes til autofullføring, se Modellinnstillinger.",
   "settings.notifications.agent.title": "Agentfullføring",
   "settings.notifications.agent.description": "Vis varsling når agenten fullfører en oppgave",
   "settings.notifications.permissions.title": "Tillatelsesforespørsler",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/pl.ts b/packages/kilo-vscode/webview-ui/src/i18n/pl.ts
index 00a9b634e5a..c22972451f3 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/pl.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/pl.ts
@@ -1147,6 +1147,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Użyj inteligentnego skrótu do wyzwalania zadań inline",
   "settings.autocomplete.chatAutocomplete.title": "Włącz autouzupełnianie czatu",
   "settings.autocomplete.chatAutocomplete.description": "Pokaż sugestie autouzupełniania w polu czatu",
+  "settings.autocomplete.modelsHint": "Aby wybrać model używany do autouzupełniania, zobacz Ustawienia modeli.",
   "settings.notifications.agent.title": "Zakończenie agenta",
   "settings.notifications.agent.description": "Pokaż powiadomienie po zakończeniu zadania przez agenta",
   "settings.notifications.permissions.title": "Żądania uprawnień",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/ru.ts b/packages/kilo-vscode/webview-ui/src/i18n/ru.ts
index 5802ed74146..2fc51a705ac 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/ru.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/ru.ts
@@ -1174,6 +1174,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Использовать умную клавишу для запуска встроенных задач",
   "settings.autocomplete.chatAutocomplete.title": "Включить автодополнение чата",
   "settings.autocomplete.chatAutocomplete.description": "Показывать предложения автодополнения в поле чата",
+  "settings.autocomplete.modelsHint": "Чтобы выбрать модель для автодополнения, см. настройки Моделей.",
   "settings.notifications.agent.title": "Завершение агента",
   "settings.notifications.agent.description": "Показать уведомление при завершении задачи агентом",
   "settings.notifications.permissions.title": "Запросы разрешений",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/th.ts b/packages/kilo-vscode/webview-ui/src/i18n/th.ts
index 9c6c9cfe519..9e8e7daf20d 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/th.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/th.ts
@@ -1158,6 +1158,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "ใช้ปุ่มลัดอัจฉริยะสำหรับงานอินไลน์",
   "settings.autocomplete.chatAutocomplete.title": "เปิดใช้งานเติมอัตโนมัติแชท",
   "settings.autocomplete.chatAutocomplete.description": "แสดงข้อเสนอแนะเติมอัตโนมัติในช่องแชท",
+  "settings.autocomplete.modelsHint": "เลือกโมเดลที่ใช้สำหรับการเติมอัตโนมัติได้ที่การตั้งค่าโมเดล",
   "settings.notifications.agent.title": "เอเจนต์เสร็จสิ้น",
   "settings.notifications.agent.description": "แสดงการแจ้งเตือนเมื่อเอเจนต์ทำงานเสร็จ",
   "settings.notifications.permissions.title": "คำขออนุญาต",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/tr.ts b/packages/kilo-vscode/webview-ui/src/i18n/tr.ts
index 296d4d485c9..18f11e5bb20 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/tr.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/tr.ts
@@ -1170,6 +1170,8 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "Satır içi görevleri tetiklemek için akıllı tuş ataması kullan",
   "settings.autocomplete.chatAutocomplete.title": "Sohbet metin alanı otomatik tamamlamasını etkinleştir",
   "settings.autocomplete.chatAutocomplete.description": "Sohbet metin alanında otomatik tamamlama önerileri göster",
+  "settings.autocomplete.modelsHint":
+    "Otomatik tamamlama için kullanılacak modeli seçmek için Modeller ayarlarına bakın.",
 
   "settings.notifications.agent.title": "Ajan Tamamlanması",
   "settings.notifications.agent.description": "Ajan bir görevi tamamladığında bildirim göster",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/uk.ts b/packages/kilo-vscode/webview-ui/src/i18n/uk.ts
index 8d430152067..4148fd0c011 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/uk.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/uk.ts
@@ -1172,6 +1172,7 @@ export const dict = {
     "Використовувати розумне прив'язування клавіш для активації підказок",
   "settings.autocomplete.chatAutocomplete.title": "Увімкнути автодоповнення в полі чату",
   "settings.autocomplete.chatAutocomplete.description": "Показувати підказки автодоповнення в полі введення чату",
+  "settings.autocomplete.modelsHint": "Щоб вибрати модель для автодоповнення, див. Налаштування моделей.",
 
   "settings.notifications.agent.title": "Завершення агента",
   "settings.notifications.agent.description": "Показувати сповіщення, коли агент завершить завдання",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/zh.ts b/packages/kilo-vscode/webview-ui/src/i18n/zh.ts
index adc645330d0..00f5bb58b0a 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/zh.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/zh.ts
@@ -1143,6 +1143,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "使用智能快捷键触发内联任务",
   "settings.autocomplete.chatAutocomplete.title": "启用聊天文本框自动补全",
   "settings.autocomplete.chatAutocomplete.description": "在聊天文本框中显示自动补全建议",
+  "settings.autocomplete.modelsHint": "若要选择用于自动补全的模型，请参阅模型设置。",
   "settings.notifications.agent.title": "智能体完成",
   "settings.notifications.agent.description": "智能体完成任务时显示通知",
   "settings.notifications.permissions.title": "权限请求",
diff --git a/packages/kilo-vscode/webview-ui/src/i18n/zht.ts b/packages/kilo-vscode/webview-ui/src/i18n/zht.ts
index 025e9390581..b8170a00ea3 100644
--- a/packages/kilo-vscode/webview-ui/src/i18n/zht.ts
+++ b/packages/kilo-vscode/webview-ui/src/i18n/zht.ts
@@ -1120,6 +1120,7 @@ export const dict = {
   "settings.autocomplete.smartKeybinding.description": "使用智慧快捷鍵觸發內嵌任務",
   "settings.autocomplete.chatAutocomplete.title": "啟用聊天文字方塊自動補全",
   "settings.autocomplete.chatAutocomplete.description": "在聊天文字方塊中顯示自動補全建議",
+  "settings.autocomplete.modelsHint": "若要選擇用於自動補全的模型，請參閱模型設定。",
   "settings.notifications.agent.title": "Agent 完成",
   "settings.notifications.agent.description": "Agent 完成任務時顯示通知",
   "settings.notifications.permissions.title": "權限請求",

From acdb177c280c432552cc9428d14d8cd454d90c71 Mon Sep 17 00:00:00 2001
From: Mark IJbema <mark@kilocode.ai>
Date: Thu, 7 May 2026 11:36:25 +0200
Subject: [PATCH 6/7] style(vscode): align autocomplete model hint

---
 .../webview-ui/src/components/settings/AutocompleteTab.tsx     | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
index f6783905455..37044b46feb 100644
--- a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
@@ -64,8 +64,9 @@ const AutocompleteTab: Component<{ onNavigateToModels?: () => void }> = (props)
       <p
         data-slot="autocomplete-models-hint"
         style={{
-          "margin-top": "12px",
+          "margin-top": "20px",
           "font-size": "var(--kilo-font-size-12)",
+          "text-align": "right",
           color: "var(--text-weak-base, var(--vscode-descriptionForeground))",
         }}
       >

From 9285b1a049b8b761d46233e062ee8b68c873b38f Mon Sep 17 00:00:00 2001
From: Mark IJbema <mark@kilocode.ai>
Date: Thu, 7 May 2026 11:38:27 +0200
Subject: [PATCH 7/7] style(vscode): show autocomplete hint as link

---
 .../webview-ui/src/components/settings/AutocompleteTab.tsx   | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
index 37044b46feb..6bc66c1b588 100644
--- a/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
+++ b/packages/kilo-vscode/webview-ui/src/components/settings/AutocompleteTab.tsx
@@ -72,6 +72,11 @@ const AutocompleteTab: Component<{ onNavigateToModels?: () => void }> = (props)
       >
         <a
           href="#"
+          style={{
+            color: "var(--vscode-textLink-foreground)",
+            "text-decoration": "none",
+            cursor: "pointer",
+          }}
           onClick={(e) => {
             e.preventDefault()
             props.onNavigateToModels?.()