feat: implement autocomplete settings tab and remove apiKey setting

This commit is contained in:
Mark IJbema
2026-02-12 14:00:12 +01:00
parent ba864ad208
commit 020f911e5e
4 changed files with 107 additions and 28 deletions
-5
View File
@@ -186,11 +186,6 @@
"type": "boolean",
"default": false,
"description": "Enable chat textarea autocomplete"
},
"kilo-code.new.autocomplete.apiKey": {
"type": "string",
"default": "",
"description": "API key for Kilo Gateway autocomplete"
}
}
}
+32
View File
@@ -208,6 +208,23 @@ export class KiloProvider implements vscode.WebviewViewProvider {
.getConfiguration("kilo-code.new")
.update("language", message.locale || undefined, vscode.ConfigurationTarget.Global)
break
case "requestAutocompleteSettings":
this.sendAutocompleteSettings()
break
case "updateAutocompleteSetting": {
const allowedKeys = new Set([
"enableAutoTrigger",
"enableSmartInlineTaskKeybinding",
"enableChatAutocomplete",
])
if (allowedKeys.has(message.key)) {
await vscode.workspace
.getConfiguration("kilo-code.new.autocomplete")
.update(message.key, message.value, vscode.ConfigurationTarget.Global)
this.sendAutocompleteSettings()
}
break
}
case "deleteSession":
await this.handleDeleteSession(message.sessionID)
break
@@ -925,6 +942,21 @@ export class KiloProvider implements vscode.WebviewViewProvider {
}
}
/**
* Read autocomplete settings from VS Code configuration and push to the webview.
*/
private sendAutocompleteSettings(): void {
const config = vscode.workspace.getConfiguration("kilo-code.new.autocomplete")
this.postMessage({
type: "autocompleteSettingsLoaded",
settings: {
enableAutoTrigger: config.get<boolean>("enableAutoTrigger", true),
enableSmartInlineTaskKeybinding: config.get<boolean>("enableSmartInlineTaskKeybinding", false),
enableChatAutocomplete: config.get<boolean>("enableChatAutocomplete", false),
},
})
}
/**
* Post a message to the webview.
* Public so toolbar button commands can send messages.
@@ -1,30 +1,60 @@
import { Component } from "solid-js"
import { Component, createSignal, onCleanup } from "solid-js"
import { Switch } from "@kilocode/kilo-ui/switch"
import { useVSCode } from "../../context/vscode"
import type { ExtensionMessage } from "../../types/messages"
const AutocompleteTab: Component = () => {
const vscode = useVSCode()
const [enableAutoTrigger, setEnableAutoTrigger] = createSignal(true)
const [enableSmartInlineTaskKeybinding, setEnableSmartInlineTaskKeybinding] = createSignal(false)
const [enableChatAutocomplete, setEnableChatAutocomplete] = createSignal(false)
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 = (
key: "enableAutoTrigger" | "enableSmartInlineTaskKeybinding" | "enableChatAutocomplete",
value: boolean,
) => {
vscode.postMessage({ type: "updateAutocompleteSetting", key, value })
}
return (
<div>
<div
style={{
background: "var(--vscode-editor-background)",
border: "1px solid var(--vscode-panel-border)",
"border-radius": "4px",
padding: "16px",
}}
<div data-component="autocomplete-settings" style={{ display: "flex", "flex-direction": "column", gap: "12px" }}>
<Switch
checked={enableAutoTrigger()}
onChange={(checked) => updateSetting("enableAutoTrigger", checked)}
description="Automatically show inline completion suggestions as you type"
>
<p
style={{
"font-size": "12px",
color: "var(--vscode-descriptionForeground)",
margin: 0,
"line-height": "1.5",
}}
>
<strong style={{ color: "var(--vscode-foreground)" }}>This section is not implemented yet.</strong> It will
contain configuration options and explanatory text related to the selected settings category. During
reimplementation, use this space to validate layout, spacing, scrolling behavior, and navigation state before
wiring up real controls.
</p>
</div>
Enable automatic inline completions
</Switch>
<Switch
checked={enableSmartInlineTaskKeybinding()}
onChange={(checked) => updateSetting("enableSmartInlineTaskKeybinding", checked)}
description="Use a smart keybinding for triggering inline tasks"
>
Enable smart inline task keybinding
</Switch>
<Switch
checked={enableChatAutocomplete()}
onChange={(checked) => updateSetting("enableChatAutocomplete", checked)}
description="Show autocomplete suggestions in the chat textarea"
>
Enable chat textarea autocomplete
</Switch>
</div>
)
}
@@ -305,6 +305,15 @@ export interface AgentsLoadedMessage {
defaultAgent: string
}
export interface AutocompleteSettingsLoadedMessage {
type: "autocompleteSettingsLoaded"
settings: {
enableAutoTrigger: boolean
enableSmartInlineTaskKeybinding: boolean
enableChatAutocomplete: boolean
}
}
export type ExtensionMessage =
| ReadyMessage
| ConnectionStateMessage
@@ -327,6 +336,7 @@ export type ExtensionMessage =
| DeviceAuthCancelledMessage
| ProvidersLoadedMessage
| AgentsLoadedMessage
| AutocompleteSettingsLoadedMessage
// ============================================
// Messages FROM webview TO extension
@@ -426,6 +436,16 @@ export interface RenameSessionRequest {
title: string
}
export interface RequestAutocompleteSettingsMessage {
type: "requestAutocompleteSettings"
}
export interface UpdateAutocompleteSettingMessage {
type: "updateAutocompleteSetting"
key: "enableAutoTrigger" | "enableSmartInlineTaskKeybinding" | "enableChatAutocomplete"
value: boolean
}
export type WebviewMessage =
| SendMessageRequest
| AbortRequest
@@ -446,6 +466,8 @@ export type WebviewMessage =
| SetLanguageRequest
| DeleteSessionRequest
| RenameSessionRequest
| RequestAutocompleteSettingsMessage
| UpdateAutocompleteSettingMessage
// ============================================
// VS Code API type