From dd74fc99b6af2fd7531f3f5138cc6141a629e01c Mon Sep 17 00:00:00 2001 From: Mark IJbema Date: Thu, 12 Feb 2026 14:43:34 +0100 Subject: [PATCH] docs: update feature docs with current implementation status and fix stale references --- .../chat-ui-features/auto-approval-controls.md | 3 +-- .../chat-ui-features/code-block-interactions.md | 14 +++++--------- .../docs/chat-ui-features/command-execution.md | 2 +- .../chat-ui-features/file-permission-dialogs.md | 2 +- .../kilo-themed-chat-session.md | 9 ++------- .../docs/chat-ui-features/markdown-rendering.md | 12 ++---------- .../chat-ui-features/special-content-types.md | 2 +- .../docs/chat-ui-features/task-header.md | 4 ++-- .../chat-ui-features/todo-list-management.md | 2 +- ...ation-organization-enterprise-enforcement.md | 3 +-- .../browser-automation-url-ingestion.md | 2 +- .../localization-and-locale-alignment.md | 11 +++++++++++ .../docs/non-agent-features/marketplace.md | 2 +- .../docs/non-agent-features/mcp-and-mcp-hub.md | 3 +-- .../docs/non-agent-features/mode-switcher.md | 4 ++-- .../docs/non-agent-features/model-switcher.md | 4 ++-- .../provider-configuration.md | 4 ++-- .../docs/non-agent-features/settings-ui.md | 17 +---------------- .../docs/non-agent-features/task-history.md | 2 +- 19 files changed, 39 insertions(+), 63 deletions(-) diff --git a/packages/kilo-vscode/docs/chat-ui-features/auto-approval-controls.md b/packages/kilo-vscode/docs/chat-ui-features/auto-approval-controls.md index 50e028b3b38..43acdf17522 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/auto-approval-controls.md +++ b/packages/kilo-vscode/docs/chat-ui-features/auto-approval-controls.md @@ -4,8 +4,7 @@ Interactive UI for configuring and toggling auto-approval. ## Location -- [`webview-ui/src/components/settings/AutoApproveDropdown.tsx`](../../webview-ui/src/components/settings/AutoApproveDropdown.tsx:1) -- [`webview-ui/src/components/settings/AutoApproveMenu.tsx`](../../webview-ui/src/components/settings/AutoApproveMenu.tsx:1) +The old `AutoApproveDropdown.tsx` and `AutoApproveMenu.tsx` components don't exist in the new extension. [`AutoApproveTab.tsx`](../../webview-ui/src/components/settings/AutoApproveTab.tsx) exists in settings but is currently a stub. Auto-approval configuration needs to be built as a new feature. ## Interactions diff --git a/packages/kilo-vscode/docs/chat-ui-features/code-block-interactions.md b/packages/kilo-vscode/docs/chat-ui-features/code-block-interactions.md index 6caf0f95e27..9cced50225f 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/code-block-interactions.md +++ b/packages/kilo-vscode/docs/chat-ui-features/code-block-interactions.md @@ -2,9 +2,13 @@ Interactive functionality for rendered code blocks (copying, expanding, scroll behavior). +## Status + +πŸ”¨ Partial + ## Location -- [`webview-ui/src/components/common/CodeBlock.tsx`](../../webview-ui/src/components/common/CodeBlock.tsx:1) +Code blocks are now rendered via kilo-ui's `` component with shiki syntax highlighting. There is no standalone `CodeBlock.tsx` in the new extension β€” code block rendering is handled internally by kilo-ui's markdown pipeline via ``. ## Interactions @@ -13,11 +17,3 @@ Interactive functionality for rendered code blocks (copying, expanding, scroll b - Sticky button positioning during scroll - Inertial scroll chaining between code block and container - Auto-hide buttons during text selection - -## Suggested migration - -**Reimplement?** No (UI-only). - -- Keep this behavior in the webview as-is when switching the backend per [`docs/opencode-core/opencode-migration-plan.md`](docs/opencode-core/opencode-migration-plan.md:1). -- Ensure the Kilo CLIβ†’Kilo event mapping preserves fenced code blocks in assistant output so the existing code-block renderer continues to activate. -- Reference: Kilo CLI also implements code-block copy in its own UI markdown renderer ([`packages/ui/src/components/markdown.tsx`](https://github.com/Kilo-Org/kilo/blob/main/packages/ui/src/components/markdown.tsx:1)), but Kilo does not need to adopt it. diff --git a/packages/kilo-vscode/docs/chat-ui-features/command-execution.md b/packages/kilo-vscode/docs/chat-ui-features/command-execution.md index 48f5e1641bf..3a77580148b 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/command-execution.md +++ b/packages/kilo-vscode/docs/chat-ui-features/command-execution.md @@ -4,7 +4,7 @@ Interactive terminal output rendering and approval controls for executed command ## Location -- [`webview-ui/src/components/chat/tool-message/CommandExecution.tsx`](../../webview-ui/src/components/chat/tool-message/CommandExecution.tsx:1) +Command execution rendering is now handled by kilo-ui's `` component which includes per-tool renderers including `BasicTool`. There is no standalone command execution component β€” tool messages are rendered through the unified message pipeline. ## Interactions diff --git a/packages/kilo-vscode/docs/chat-ui-features/file-permission-dialogs.md b/packages/kilo-vscode/docs/chat-ui-features/file-permission-dialogs.md index b39d2bb3f6a..737acf13afc 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/file-permission-dialogs.md +++ b/packages/kilo-vscode/docs/chat-ui-features/file-permission-dialogs.md @@ -4,7 +4,7 @@ Batch approval UI for file read operations. ## Location -- [`webview-ui/src/components/chat/tool-message/BatchFilePermission.tsx`](../../webview-ui/src/components/chat/tool-message/BatchFilePermission.tsx:1) +Permissions are now rendered through kilo-ui's `DataProvider` pattern using `Dialog` + `BasicTool` + `data-component="permission-prompt"`. There is no standalone `BatchFilePermission.tsx` β€” the permission UI is integrated into the kilo-ui message rendering pipeline. ## Interactions diff --git a/packages/kilo-vscode/docs/chat-ui-features/kilo-themed-chat-session.md b/packages/kilo-vscode/docs/chat-ui-features/kilo-themed-chat-session.md index 0105ee47c50..f6d51de5e08 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/kilo-themed-chat-session.md +++ b/packages/kilo-vscode/docs/chat-ui-features/kilo-themed-chat-session.md @@ -2,7 +2,7 @@ **GitHub Issue:** [#161](https://github.com/Kilo-Org/kilo/issues/161) **Priority:** P0 -**Status:** πŸ”¨ Partial +**Status:** βœ… Complete ## Description @@ -19,12 +19,7 @@ The chat session should be present and Kilo-themed. This is the core chat experi ## Current State -The basic chat infrastructure exists: - -- [`ChatView.tsx`](../../webview-ui/src/components/chat/ChatView.tsx) β€” main chat layout with message list and prompt input -- [`MessageList.tsx`](../../webview-ui/src/components/chat/MessageList.tsx) β€” renders messages with auto-scroll -- [`Message.tsx`](../../webview-ui/src/components/chat/Message.tsx) β€” renders text, tool, and reasoning parts with status icons -- [`PromptInput.tsx`](../../webview-ui/src/components/chat/PromptInput.tsx) β€” send/abort controls +The chat UI now uses kilo-ui components throughout. `ThemeProvider` with `defaultTheme="kilo-vscode"` provides consistent theming. Messages render via kilo-ui's `` component with full markdown support. UI elements use kilo-ui `Button`, `IconButton`, `Tooltip`, `Popover`, `Toast`. The provider hierarchy in [`App.tsx`](../../webview-ui/src/App.tsx) includes `ThemeProvider β†’ DialogProvider β†’ VSCodeProvider β†’ ServerProvider β†’ LanguageBridge β†’ MarkedProvider β†’ ProviderProvider β†’ SessionProvider β†’ DataBridge`. ## Gaps diff --git a/packages/kilo-vscode/docs/chat-ui-features/markdown-rendering.md b/packages/kilo-vscode/docs/chat-ui-features/markdown-rendering.md index 69b3b39e6ae..0fc5864dfb7 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/markdown-rendering.md +++ b/packages/kilo-vscode/docs/chat-ui-features/markdown-rendering.md @@ -1,7 +1,7 @@ # Markdown Rendering **Priority:** P0 -**Status:** ❌ Not started +**Status:** βœ… Complete **Source:** [JetBrains plugin analysis](../../LESSONS_LEARNED_JETBRAINS.md), [GitHub Issue #161](https://github.com/Kilo-Org/kilo/issues/161) ## Description @@ -19,15 +19,7 @@ Assistant messages render as plain text. No markdown parsing, no syntax highligh ## Current State -[`TextPartView`](../../webview-ui/src/components/chat/Message.tsx:15) renders raw text: - -```tsx -const TextPartView: Component<{ part: TextPart }> = (props) => { - return
{props.part.text}
-} -``` - -No markdown library is imported. No syntax highlighting exists. +Message.tsx delegates rendering to kilo-ui's `` component which internally handles Markdown via ``. Syntax highlighting is provided by shiki (bundled via kilo-ui). All assistant messages render as rich markdown with code blocks, links, lists, etc. ## Gaps diff --git a/packages/kilo-vscode/docs/chat-ui-features/special-content-types.md b/packages/kilo-vscode/docs/chat-ui-features/special-content-types.md index c86abafe3d3..7e3c50326d2 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/special-content-types.md +++ b/packages/kilo-vscode/docs/chat-ui-features/special-content-types.md @@ -4,7 +4,7 @@ Interactive elements for specialized message content beyond plain markdown/code. ## Location -- Various specialized components +Content type rendering is now handled by kilo-ui's `` component which includes renderers for reasoning blocks, tool results, and other part types. The old standalone components (`ReasoningBlock`, `OpenMarkdownPreviewButton`, etc.) don't exist in the new extension. ## Interactions diff --git a/packages/kilo-vscode/docs/chat-ui-features/task-header.md b/packages/kilo-vscode/docs/chat-ui-features/task-header.md index 18b5da10e20..7a482ee9b38 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/task-header.md +++ b/packages/kilo-vscode/docs/chat-ui-features/task-header.md @@ -2,7 +2,7 @@ **GitHub Issue:** [#166](https://github.com/Kilo-Org/kilo/issues/166) **Priority:** P0 -**Status:** ❌ Not started +**Status:** βœ… Complete ## Description @@ -18,7 +18,7 @@ A task header displayed at the top of the chat session that provides key context ## Current State -No task header exists. The chat view starts directly with the message list. +[`TaskHeader.tsx`](../../webview-ui/src/components/chat/TaskHeader.tsx) implements the task header with session title, cost display (formatted USD), context token usage with percentage bar, and a compact button with tooltip. Uses kilo-ui `IconButton` and `Tooltip`. Integrated into [`ChatView.tsx`](../../webview-ui/src/components/chat/ChatView.tsx). ## Gaps diff --git a/packages/kilo-vscode/docs/chat-ui-features/todo-list-management.md b/packages/kilo-vscode/docs/chat-ui-features/todo-list-management.md index 36c4f2c250f..a9fa2e2e3b9 100644 --- a/packages/kilo-vscode/docs/chat-ui-features/todo-list-management.md +++ b/packages/kilo-vscode/docs/chat-ui-features/todo-list-management.md @@ -4,7 +4,7 @@ Interactive editing for todo lists surfaced by the agent/tool messages. ## Location -- [`webview-ui/src/components/chat/tool-message/UpdateTodoListToolBlock.tsx`](../../webview-ui/src/components/chat/tool-message/UpdateTodoListToolBlock.tsx:1) +Todo list data flows through the SSE pipeline: `todo.updated` events are handled by KiloProvider β†’ webview message β†’ session store with `todos()` accessor. No rendering UI component exists yet. The old `UpdateTodoListToolBlock.tsx` is not present in the new extension. ## Interactions diff --git a/packages/kilo-vscode/docs/non-agent-features/authentication-organization-enterprise-enforcement.md b/packages/kilo-vscode/docs/non-agent-features/authentication-organization-enterprise-enforcement.md index eaa1389c802..af28143c26e 100644 --- a/packages/kilo-vscode/docs/non-agent-features/authentication-organization-enterprise-enforcement.md +++ b/packages/kilo-vscode/docs/non-agent-features/authentication-organization-enterprise-enforcement.md @@ -18,5 +18,4 @@ ## Primary implementation anchors -- [`src/services/kilocode/`](../../src/services/kilocode/) -- [`src/services/mdm/`](../../src/services/mdm/) +Auth is handled via [`DeviceAuthCard.tsx`](../../webview-ui/src/components/DeviceAuthCard.tsx) for the device auth flow and [`ProfileView.tsx`](../../webview-ui/src/components/ProfileView.tsx) for login state display. The CLI backend manages the actual auth tokens. The old `src/services/kilocode/` and `src/services/mdm/` directories don't exist in the new extension. diff --git a/packages/kilo-vscode/docs/non-agent-features/browser-automation-url-ingestion.md b/packages/kilo-vscode/docs/non-agent-features/browser-automation-url-ingestion.md index aa12722d582..977f970c133 100644 --- a/packages/kilo-vscode/docs/non-agent-features/browser-automation-url-ingestion.md +++ b/packages/kilo-vscode/docs/non-agent-features/browser-automation-url-ingestion.md @@ -18,4 +18,4 @@ ## Primary implementation anchors -- [`src/services/browser/`](../../src/services/browser/) +- [`src/services/browser-automation/`](../../src/services/browser-automation/) diff --git a/packages/kilo-vscode/docs/non-agent-features/localization-and-locale-alignment.md b/packages/kilo-vscode/docs/non-agent-features/localization-and-locale-alignment.md index f864fca21c0..8a9cb6cbb0e 100644 --- a/packages/kilo-vscode/docs/non-agent-features/localization-and-locale-alignment.md +++ b/packages/kilo-vscode/docs/non-agent-features/localization-and-locale-alignment.md @@ -1,5 +1,16 @@ # Localization & locale alignment (Kilo Code ↔ Kilo CLI) +## Implementation Status + +**Status: βœ… Complete** + +The localization system is fully implemented: +- [`language.tsx`](../../webview-ui/src/context/language.tsx) provides the i18n context with three-layer dict merging (app + kilo-ui + kilo-i18n) +- 16 locale files in [`webview-ui/src/i18n/`](../../webview-ui/src/i18n/): ar, br, bs, da, de, en, es, fr, ja, ko, no, pl, ru, th, zh, zht +- Locale auto-detection: user override β†’ VS Code language β†’ browser default +- [`LanguageTab`](../../webview-ui/src/components/settings/LanguageTab.tsx) provides a working locale selector in settings +- Template interpolation support for dynamic values + ## Goal During the Kilo CLI backend migration, we must keep **UI translations** and **server-facing locale identifiers** consistent. diff --git a/packages/kilo-vscode/docs/non-agent-features/marketplace.md b/packages/kilo-vscode/docs/non-agent-features/marketplace.md index 125151f2f50..65a9f389deb 100644 --- a/packages/kilo-vscode/docs/non-agent-features/marketplace.md +++ b/packages/kilo-vscode/docs/non-agent-features/marketplace.md @@ -18,4 +18,4 @@ ## Primary implementation anchors -- [`src/services/marketplace/`](../../src/services/marketplace/) +No marketplace service directory exists in the new extension. The marketplace feature needs to be built from scratch. diff --git a/packages/kilo-vscode/docs/non-agent-features/mcp-and-mcp-hub.md b/packages/kilo-vscode/docs/non-agent-features/mcp-and-mcp-hub.md index 94d26cfd575..3a7207f13f7 100644 --- a/packages/kilo-vscode/docs/non-agent-features/mcp-and-mcp-hub.md +++ b/packages/kilo-vscode/docs/non-agent-features/mcp-and-mcp-hub.md @@ -23,5 +23,4 @@ ## Primary implementation anchors -- [`src/services/mcp/`](../../src/services/mcp/) -- [`src/services/mcp/oauth/`](../../src/services/mcp/oauth/) +MCP is managed by the CLI backend, not local extension services. The extension interacts with MCP via HTTP client methods in [`http-client.ts`](../../src/services/cli-backend/http-client.ts): `getMcpStatus`, `addMcpServer`, `connectMcpServer`, `disconnectMcpServer`. The [`BrowserAutomationService`](../../src/services/browser-automation/browser-automation-service.ts) uses these methods to register Playwright as an MCP server. diff --git a/packages/kilo-vscode/docs/non-agent-features/mode-switcher.md b/packages/kilo-vscode/docs/non-agent-features/mode-switcher.md index 5238bfd534a..53c8e4f630e 100644 --- a/packages/kilo-vscode/docs/non-agent-features/mode-switcher.md +++ b/packages/kilo-vscode/docs/non-agent-features/mode-switcher.md @@ -2,7 +2,7 @@ **GitHub Issue:** [#162](https://github.com/Kilo-Org/kilo/issues/162) **Priority:** P2 -**Status:** ❌ Not started +**Status:** βœ… Complete ## Description @@ -18,7 +18,7 @@ Users should be able to switch between modes (e.g., Code, Architect, Ask, Debug, ## Current State -No mode switcher UI exists. The CLI backend supports modes (visible in the old extension). +[`ModeSwitcher.tsx`](../../webview-ui/src/components/chat/ModeSwitcher.tsx) implements a popover-based agent/mode selector listing all available agents with descriptions. Selection is persisted via `session.selectAgent()`. Integrated into [`PromptInput.tsx`](../../webview-ui/src/components/chat/PromptInput.tsx). Agent data is fetched via the `listAgents` HTTP endpoint and `AgentsLoadedMessage`. ## Gaps diff --git a/packages/kilo-vscode/docs/non-agent-features/model-switcher.md b/packages/kilo-vscode/docs/non-agent-features/model-switcher.md index 14cb7c709d4..c3612e2760c 100644 --- a/packages/kilo-vscode/docs/non-agent-features/model-switcher.md +++ b/packages/kilo-vscode/docs/non-agent-features/model-switcher.md @@ -2,7 +2,7 @@ **GitHub Issue:** [#163](https://github.com/Kilo-Org/kilo/issues/163) **Priority:** P1 -**Status:** πŸ”¨ Partial (In progress) +**Status:** βœ… Complete ## Description @@ -18,7 +18,7 @@ Users should be able to view and switch between the models for the providers tha ## Current State -No model switcher UI exists. The CLI backend likely has endpoints for listing available models and setting the active model. +[`ModelSelector.tsx`](../../webview-ui/src/components/chat/ModelSelector.tsx) implements a popover-based selector with search/filter, keyboard navigation (arrow keys + Enter), provider grouping with sort order, free model tags, and selected state. Integrated into [`PromptInput.tsx`](../../webview-ui/src/components/chat/PromptInput.tsx). Provider context in [`provider.tsx`](../../webview-ui/src/context/provider.tsx) fetches providers, connected status, and defaults. ## Gaps diff --git a/packages/kilo-vscode/docs/non-agent-features/provider-configuration.md b/packages/kilo-vscode/docs/non-agent-features/provider-configuration.md index 87fd3036bdb..905fea65533 100644 --- a/packages/kilo-vscode/docs/non-agent-features/provider-configuration.md +++ b/packages/kilo-vscode/docs/non-agent-features/provider-configuration.md @@ -2,7 +2,7 @@ **GitHub Issue:** [#175](https://github.com/Kilo-Org/kilo/issues/175) **Priority:** P1 -**Status:** ❌ Not started +**Status:** πŸ”¨ Partial ## Description @@ -19,7 +19,7 @@ Configure a provider and switch between configured providers. Providers are the ## Current State -No provider configuration UI exists. The [`ProvidersTab.tsx`](../../webview-ui/src/components/settings/ProvidersTab.tsx) settings tab is a stub. The CLI manages provider configuration. +Provider data infrastructure is in place. [`provider.tsx`](../../webview-ui/src/context/provider.tsx) context fetches and exposes provider data, connected providers, defaults, and model lists. This powers the [`ModelSelector.tsx`](../../webview-ui/src/components/chat/ModelSelector.tsx) component. [`ProvidersTab.tsx`](../../webview-ui/src/components/settings/ProvidersTab.tsx) still needs a full configuration UI for adding, editing, and removing providers. ## Gaps diff --git a/packages/kilo-vscode/docs/non-agent-features/settings-ui.md b/packages/kilo-vscode/docs/non-agent-features/settings-ui.md index b8ad2dbd89d..6bb8d2d3e68 100644 --- a/packages/kilo-vscode/docs/non-agent-features/settings-ui.md +++ b/packages/kilo-vscode/docs/non-agent-features/settings-ui.md @@ -18,22 +18,7 @@ Replicate the settings that are available in OpenCode (CLI) and allow users to c ## Current State -A 14-tab settings sidebar navigation shell exists in [`Settings.tsx`](../../webview-ui/src/components/Settings.tsx) with stub tab components: - -- [`ProvidersTab.tsx`](../../webview-ui/src/components/settings/ProvidersTab.tsx) -- [`AgentBehaviourTab.tsx`](../../webview-ui/src/components/settings/AgentBehaviourTab.tsx) -- [`AutoApproveTab.tsx`](../../webview-ui/src/components/settings/AutoApproveTab.tsx) -- [`AutocompleteTab.tsx`](../../webview-ui/src/components/settings/AutocompleteTab.tsx) -- [`BrowserTab.tsx`](../../webview-ui/src/components/settings/BrowserTab.tsx) -- [`CheckpointsTab.tsx`](../../webview-ui/src/components/settings/CheckpointsTab.tsx) -- [`ContextTab.tsx`](../../webview-ui/src/components/settings/ContextTab.tsx) -- [`DisplayTab.tsx`](../../webview-ui/src/components/settings/DisplayTab.tsx) -- [`ExperimentalTab.tsx`](../../webview-ui/src/components/settings/ExperimentalTab.tsx) -- [`LanguageTab.tsx`](../../webview-ui/src/components/settings/LanguageTab.tsx) -- [`NotificationsTab.tsx`](../../webview-ui/src/components/settings/NotificationsTab.tsx) -- [`PromptsTab.tsx`](../../webview-ui/src/components/settings/PromptsTab.tsx) -- [`TerminalTab.tsx`](../../webview-ui/src/components/settings/TerminalTab.tsx) -- [`AboutKiloCodeTab.tsx`](../../webview-ui/src/components/settings/AboutKiloCodeTab.tsx) +15-tab settings shell exists, migrated to kilo-ui `Tabs` component. [`BrowserTab`](../../webview-ui/src/components/settings/BrowserTab.tsx) has real settings controls (enable/disable, system Chrome, headless toggles using kilo-ui `Switch`). [`LanguageTab`](../../webview-ui/src/components/settings/LanguageTab.tsx) has a working locale selector using kilo-ui `Select`. The remaining 13 tabs are still stubs. ## Gaps diff --git a/packages/kilo-vscode/docs/non-agent-features/task-history.md b/packages/kilo-vscode/docs/non-agent-features/task-history.md index b9b4d58b2e7..26e768c02c1 100644 --- a/packages/kilo-vscode/docs/non-agent-features/task-history.md +++ b/packages/kilo-vscode/docs/non-agent-features/task-history.md @@ -20,7 +20,7 @@ Persist tasks so that users can continue prior tasks. This includes browsing pas Basic session history exists: -- [`SessionList.tsx`](../../webview-ui/src/components/history/SessionList.tsx) β€” lists sessions with relative dates +- [`SessionList.tsx`](../../webview-ui/src/components/history/SessionList.tsx) β€” now uses kilo-ui `List` component with keyboard navigation and fuzzy search; lists sessions with relative dates - [`session.tsx`](../../webview-ui/src/context/session.tsx) β€” create, list, select, load messages ## Gaps