mirror of
https://github.com/Kilo-Org/kilocode.git
synced 2026-09-24 16:02:55 +08:00
docs: update feature docs with current implementation status and fix stale references
This commit is contained in:
Mark IJbema
@@ -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
|
||||
|
||||
|
||||
@@ -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 `<KiloMessage>` 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 `<MarkedProvider>`.
|
||||
|
||||
## 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.
|
||||
|
||||
@@ -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 `<KiloMessage>` 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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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 `<KiloMessage>` 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
|
||||
|
||||
|
||||
@@ -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 <div class="message-text">{props.part.text}</div>
|
||||
}
|
||||
```
|
||||
|
||||
No markdown library is imported. No syntax highlighting exists.
|
||||
Message.tsx delegates rendering to kilo-ui's `<KiloMessage>` component which internally handles Markdown via `<MarkedProvider>`. Syntax highlighting is provided by shiki (bundled via kilo-ui). All assistant messages render as rich markdown with code blocks, links, lists, etc.
|
||||
|
||||
## Gaps
|
||||
|
||||
|
||||
@@ -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 `<KiloMessage>` 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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
+1
-2
@@ -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.
|
||||
|
||||
@@ -18,4 +18,4 @@
|
||||
|
||||
## Primary implementation anchors
|
||||
|
||||
- [`src/services/browser/`](../../src/services/browser/)
|
||||
- [`src/services/browser-automation/`](../../src/services/browser-automation/)
|
||||
|
||||
@@ -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.
|
||||
|
||||
@@ -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.
|
||||
|
||||
@@ -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.
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
|
||||
@@ -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
|
||||
|
||||
Reference in New Issue
Block a user