mirror of
https://github.com/Kilo-Org/kilocode.git
synced 2026-09-24 16:02:55 +08:00
Merge pull request #283 from Kilo-Org/mark/update-migration-plan-status
docs: update migration plan with current implementation status
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
|
||||
|
||||
@@ -10,21 +10,27 @@ This document tracks remaining work needed for feature parity with the old exten
|
||||
|
||||
The rebuild has a working foundation:
|
||||
|
||||
- **CLI backend**: server lifecycle (spawn, port detection, auth, dispose) in [`server-manager.ts`](../src/services/cli-backend/server-manager.ts), HTTP client with 11 endpoints in [`http-client.ts`](../src/services/cli-backend/http-client.ts), SSE client with event subscriptions in [`sse-client.ts`](../src/services/cli-backend/sse-client.ts)
|
||||
- **Chat UI**: message list with text/tool/reasoning parts, streaming text deltas, auto-scroll in [`ChatView.tsx`](../webview-ui/src/components/chat/ChatView.tsx) and [`MessageList.tsx`](../webview-ui/src/components/chat/MessageList.tsx)
|
||||
- **Tool parts**: status icons (⏳⚙️✓✕), expandable input/output sections, status-based CSS classes in [`Message.tsx`](../webview-ui/src/components/chat/Message.tsx)
|
||||
- **Prompt input**: send/abort controls in [`PromptInput.tsx`](../webview-ui/src/components/chat/PromptInput.tsx)
|
||||
- **Permissions**: reject/once/always dialog with expandable tool details in [`PermissionDialog.tsx`](../webview-ui/src/components/chat/PermissionDialog.tsx)
|
||||
- **CLI backend**: server lifecycle (spawn, port detection, auth, dispose) in [`server-manager.ts`](../src/services/cli-backend/server-manager.ts), HTTP client with 20 endpoints in [`http-client.ts`](../src/services/cli-backend/http-client.ts), SSE client with event subscriptions in [`sse-client.ts`](../src/services/cli-backend/sse-client.ts)
|
||||
- **Chat UI**: message list with text/tool/reasoning parts, streaming text deltas, auto-scroll in [`ChatView.tsx`](../webview-ui/src/components/chat/ChatView.tsx) and [`MessageList.tsx`](../webview-ui/src/components/chat/MessageList.tsx). Markdown rendering via kilo-ui's `<KiloMessage>` component with syntax-highlighted code blocks and per-tool renderers.
|
||||
- **Tool parts**: delegation to kilo-ui per-tool renderers with status icons, expandable input/output sections, status-based styling in [`Message.tsx`](../webview-ui/src/components/chat/Message.tsx)
|
||||
- **Prompt input**: send/abort controls with integrated model selector and mode switcher in [`PromptInput.tsx`](../webview-ui/src/components/chat/PromptInput.tsx)
|
||||
- **Permissions**: rendered through kilo-ui's DataProvider/permission components — reject/once/always with expandable tool details
|
||||
- **Sessions**: create, list, select, load messages via [`session.tsx`](../webview-ui/src/context/session.tsx)
|
||||
- **Todo pipeline**: `todo.updated` SSE event handled through KiloProvider → webview store (no rendering UI yet)
|
||||
- **Auth**: full device auth flow with QR code, verification code, countdown in [`DeviceAuthCard.tsx`](../webview-ui/src/components/DeviceAuthCard.tsx)
|
||||
- **Profile**: login state, balance, dashboard link, logout in [`ProfileView.tsx`](../webview-ui/src/components/ProfileView.tsx)
|
||||
- **Session history**: list with relative dates in [`SessionList.tsx`](../webview-ui/src/components/history/SessionList.tsx)
|
||||
- **Settings**: 14-tab sidebar navigation shell in [`Settings.tsx`](../webview-ui/src/components/Settings.tsx) (tabs are stubs)
|
||||
- **Message protocol**: 28 message types in [`messages.ts`](../webview-ui/src/types/messages.ts)
|
||||
- **Settings**: 15-tab sidebar navigation, 2 functional (BrowserTab, LanguageTab), 13 stubs in [`Settings.tsx`](../webview-ui/src/components/Settings.tsx)
|
||||
- **Message protocol**: 41 message types (22 ExtensionMessage + 19 WebviewMessage) in [`messages.ts`](../webview-ui/src/types/messages.ts)
|
||||
- **Build pipeline**: dual esbuild (extension + webview), CLI binary provisioning in [`esbuild.js`](../esbuild.js) and [`prepare-cli-binary.mjs`](../scripts/prepare-cli-binary.mjs)
|
||||
- **View title bar button**: ✅ Done — [#181](https://github.com/Kilo-Org/kilo/issues/181)
|
||||
- **Browser automation**: Playwright MCP integration with settings toggle, lifecycle service, and CLI MCP hub registration in [`BrowserAutomationService`](../src/services/browser-automation/browser-automation-service.ts)
|
||||
- **kilo-ui integration**: Webview uses `@kilocode/kilo-ui` shared component library — ThemeProvider, MarkedProvider, DataProvider, Button, IconButton, Tooltip, Popover, Switch, Select, Toast, KiloMessage
|
||||
- **Task header**: Session title, cost display, context token usage with percentage, compact button in [`TaskHeader.tsx`](../webview-ui/src/components/chat/TaskHeader.tsx)
|
||||
- **Model selector**: Popover-based model picker with search, provider grouping, free model tags in [`ModelSelector.tsx`](../webview-ui/src/components/chat/ModelSelector.tsx)
|
||||
- **Mode switcher**: Agent/mode selector with descriptions in [`ModeSwitcher.tsx`](../webview-ui/src/components/chat/ModeSwitcher.tsx)
|
||||
- **Localization**: Full i18n system with 16 locales, three-layer dict merging, locale auto-detection in [`language.tsx`](../webview-ui/src/context/language.tsx) and [`i18n/`](../webview-ui/src/i18n/)
|
||||
- **Context compaction**: summarize endpoint + CompactRequest message + compact button in TaskHeader
|
||||
|
||||
---
|
||||
|
||||
@@ -35,7 +41,7 @@ The rebuild has a working foundation:
|
||||
| [Auto-Approval Controls](chat-ui-features/auto-approval-controls.md) | ❌ Not started | No auto-approval toggle, scope selectors, or timeout config. Permission dialog exists but only supports per-request decisions. [#171](https://github.com/Kilo-Org/kilo/issues/171) | CLI owns permissions; webview needs config UI | P1 |
|
||||
| [Browser Session Controls](chat-ui-features/browser-session-controls.md) | 🔨 Partial | BrowserTab settings UI implemented with enable/disable toggle, system Chrome and headless options. Missing: in-chat browser session controls, action replay, screenshot viewing. | CLI-side (if browser tool exists) + webview | P3 |
|
||||
| [Checkpoint & Task Management](chat-ui-features/checkpoint-task-management.md) | ❌ Not started | No checkpoint restore, navigation, or "See New Changes" diff buttons. | CLI session undo/redo/fork + extension git integration | P1 |
|
||||
| [Code Block Interactions](chat-ui-features/code-block-interactions.md) | ❌ Not started | No markdown rendering, syntax highlighting, copy button, expand/collapse, or sticky buttons on code blocks. Messages render as plain text. | Webview-only | P0 |
|
||||
| [Code Block Interactions](chat-ui-features/code-block-interactions.md) | 🔨 Partial | Code blocks render with syntax highlighting via kilo-ui's KiloMessage + MarkedProvider + shiki. Missing: copy button, expand/collapse, sticky buttons (depends on kilo-ui feature completeness). | Webview-only | P0 |
|
||||
| [Command Execution](chat-ui-features/command-execution.md) | 🔨 Partial | Tool messages render but lack expandable terminal output, abort-by-PID, exit status indicators, command pattern selectors, and syntax highlighting. | CLI executes commands; webview renders output | P0 |
|
||||
| [Connection State UI](chat-ui-features/connection-state-ui.md) | ❌ Not started | No loading/connecting spinner, error panel with retry, or reconnecting indicator. Chat renders even when disconnected. | Webview-only (consumes connection state) | P0 |
|
||||
| [Context Menus & Tooltips](chat-ui-features/context-menus-tooltips.md) | ❌ Not started | No right-click context menus or hover tooltips on interactive elements. | Webview-only | P2 |
|
||||
@@ -44,12 +50,12 @@ The rebuild has a working foundation:
|
||||
| [Follow-Up Questions](chat-ui-features/follow-up-questions.md) | ❌ Not started | No suggested reply chips, click-to-submit, auto-approval countdown, or mode indicators. | Likely extension-side generation | P2 |
|
||||
| [Image Handling](chat-ui-features/image-handling.md) | ❌ Not started | No image viewer, zoom/pan modal, thumbnails, file attachment support in prompt input, or image paste support. | CLI provides image data; webview renders + VS Code integration | P1 |
|
||||
| [Inline Actions on Tool Messages](chat-ui-features/inline-actions-on-tool-messages.md) | 🔨 Partial | Tool parts render with status icons (⏳⚙️✓✕), expandable sections with input/output, and status-based CSS classes. Missing: jump-to-file links and inline action buttons. | CLI provides tool metadata; webview renders | P1 |
|
||||
| [Kilo Themed Chat Session](chat-ui-features/kilo-themed-chat-session.md) | 🔨 Partial | Basic chat exists but lacks Kilo theming, markdown rendering, and visual polish. [#161](https://github.com/Kilo-Org/kilo/issues/161) | Webview-only (styling/theming) | P0 |
|
||||
| [Markdown Rendering](chat-ui-features/markdown-rendering.md) | ❌ Not started | Assistant messages render as plain text. No markdown parsing, code syntax highlighting, or clickable links. Blocks Code Block Interactions and Mermaid features. [#161](https://github.com/Kilo-Org/kilo/issues/161) | Webview-only | P0 |
|
||||
| [Kilo Themed Chat Session](chat-ui-features/kilo-themed-chat-session.md) | ✅ Done | kilo-ui components throughout: ThemeProvider with `defaultTheme="kilo-vscode"`, KiloMessage for rendering, MarkedProvider for markdown, Button/IconButton/Tooltip/Popover from kilo-ui. [#161](https://github.com/Kilo-Org/kilo/issues/161) | Webview-only (styling/theming) | P0 |
|
||||
| [Markdown Rendering](chat-ui-features/markdown-rendering.md) | ✅ Done | Message.tsx delegates to kilo-ui's `<KiloMessage>` component. MarkedProvider in App.tsx provides markdown context. Syntax highlighting via shiki. [#161](https://github.com/Kilo-Org/kilo/issues/161) | Webview-only | P0 |
|
||||
| [Mermaid Diagram Features](chat-ui-features/mermaid-diagram-features.md) | ❌ Not started | No mermaid rendering, "Fix with AI" button, copy, or open-as-PNG. Requires markdown rendering first. | Webview-only (rendering); CLI for "Fix with AI" | P2 |
|
||||
| [Message Editing & Management](chat-ui-features/message-editing-management.md) | ❌ Not started | No inline editing, deletion, timestamp display, or redo-previous-message (up-arrow). [#177](https://github.com/Kilo-Org/kilo/issues/177) | CLI session fork/undo for edit semantics | P1 |
|
||||
| [Special Content Types](chat-ui-features/special-content-types.md) | 🔨 Partial | Reasoning blocks render (collapsible). Missing: open-markdown-preview button, MCP tool/resource rows, expandable error rows with copy. | Mixed: CLI for MCP data; webview for rendering | P1 |
|
||||
| [Task Header](chat-ui-features/task-header.md) | ❌ Not started | No task header with initial prompt, cost, context size, or compaction button. [#166](https://github.com/Kilo-Org/kilo/issues/166) | CLI provides cost/context data; webview renders | P0 |
|
||||
| [Task Header](chat-ui-features/task-header.md) | ✅ Done | TaskHeader.tsx implements session title, cost display (formatted USD), context token usage with percentage, compact button with tooltip. Uses kilo-ui IconButton and Tooltip. [#166](https://github.com/Kilo-Org/kilo/issues/166) | CLI provides cost/context data; webview renders | P0 |
|
||||
| [Todo List Management](chat-ui-features/todo-list-management.md) | 🔨 Partial | `todo.updated` SSE event is handled through the full pipeline: KiloProvider → webview message → session store with `todos()` accessor. Missing: UI component to render, display, or interact with todo items. | CLI tool or extension-side feature | P2 |
|
||||
| [Toggle Thinking](chat-ui-features/toggle-thinking.md) | 🔨 Partial | Reasoning blocks render but no toggle to enable/disable thinking. Linked [PR #127](https://github.com/Kilo-Org/kilo/pull/127). [#172](https://github.com/Kilo-Org/kilo/issues/172) | CLI controls thinking; webview provides toggle UI | P2 |
|
||||
|
||||
@@ -76,17 +82,17 @@ The rebuild has a working foundation:
|
||||
| [Git Commit Message Generation](non-agent-features/git-commit-message-generation.md) | ❌ Not started | No AI commit message generation or VS Code Source Control integration. [#165](https://github.com/Kilo-Org/kilo/issues/165) | Extension-side (VS Code Git API) | P2 |
|
||||
| [Integrations](non-agent-features/integrations.md) | ❌ Not started | No external system integrations (GitHub, etc.) beyond basic auth. | CLI plugin system (partial); extension for IDE hooks | P3 |
|
||||
| [Kilo Gateway](non-agent-features/kilo-gateway.md) | 🔨 Partial | Auth flow works but no explicit gateway provider selection or default model. [#176](https://github.com/Kilo-Org/kilo/issues/176) | CLI handles gateway connection; extension provides config UI | P0 |
|
||||
| [Localization](non-agent-features/localization-and-locale-alignment.md) | ❌ Not started | No i18n or locale normalization. All UI is English-only. | Extension + webview; CLI locale mapping needed | P3 |
|
||||
| [Localization](non-agent-features/localization-and-locale-alignment.md) | ✅ Done | Full i18n system with 16 locales in [`i18n/`](../webview-ui/src/i18n/), three-layer dict merging, locale auto-detection, LanguageTab settings UI with locale selector. | Extension + webview; CLI locale mapping needed | P3 |
|
||||
| [Marketplace](non-agent-features/marketplace.md) | 🔨 Partial | Placeholder view exists but is non-functional. No catalog, install, or update capabilities. [#169](https://github.com/Kilo-Org/kilo/issues/169) | Extension-side | P2 |
|
||||
| [MCP & MCP Hub](non-agent-features/mcp-and-mcp-hub.md) | 🔨 Partial | MCP types and HTTP client methods added (getMcpStatus, addMcpServer, connectMcpServer, disconnectMcpServer). Used by BrowserAutomationService. Missing: general MCP configuration UI, server management, tool allowlisting, connection status display. | CLI owns MCP lifecycle; extension provides config UI | P1 |
|
||||
| [Mode Switcher](non-agent-features/mode-switcher.md) | ❌ Not started | No mode switching UI (Code, Architect, Ask, Debug, etc.). [#162](https://github.com/Kilo-Org/kilo/issues/162) | CLI manages modes; extension provides switcher UI | P2 |
|
||||
| [Model Switcher](non-agent-features/model-switcher.md) | 🔨 Partial | No model switching UI. In progress. [#163](https://github.com/Kilo-Org/kilo/issues/163) | CLI provides model list; extension provides switcher UI | P1 |
|
||||
| [Provider Configuration](non-agent-features/provider-configuration.md) | ❌ Not started | No provider add/edit/remove or switching UI. ProvidersTab is a stub. [#175](https://github.com/Kilo-Org/kilo/issues/175) | CLI manages providers; extension provides config UI | P1 |
|
||||
| [Mode Switcher](non-agent-features/mode-switcher.md) | ✅ Done | ModeSwitcher.tsx implements popover-based agent/mode selector with descriptions, persisted via session.selectAgent(). Integrated into PromptInput. [#162](https://github.com/Kilo-Org/kilo/issues/162) | CLI manages modes; extension provides switcher UI | P2 |
|
||||
| [Model Switcher](non-agent-features/model-switcher.md) | ✅ Done | ModelSelector.tsx implements popover-based selector with search/filter, keyboard navigation, provider grouping, free model tags. Integrated into PromptInput. [#163](https://github.com/Kilo-Org/kilo/issues/163) | CLI provides model list; extension provides switcher UI | P1 |
|
||||
| [Provider Configuration](non-agent-features/provider-configuration.md) | 🔨 Partial | Provider context fetches and exposes provider data, connected providers, defaults, model lists — wired into ModelSelector. ProvidersTab UI still a stub. [#175](https://github.com/Kilo-Org/kilo/issues/175) | CLI manages providers; extension provides config UI | P1 |
|
||||
| [Repository Initialization](non-agent-features/repository-initialization.md) | ❌ Not started | No /init command support for setting up agentic engineering. [#174](https://github.com/Kilo-Org/kilo/issues/174) | CLI /init endpoint; extension provides UI trigger | P3 |
|
||||
| [Rules & Workflows](non-agent-features/rules-and-workflows.md) | ❌ Not started | No rules or workflow management UI. [#173](https://github.com/Kilo-Org/kilo/issues/173) | CLI owns rules runtime; extension provides management UI | P3 |
|
||||
| [Search & Repo Scanning](non-agent-features/search-and-repo-scanning-infrastructure.md) | ❌ Not started | No search infrastructure beyond CLI grep/glob. | CLI has grep/glob; extension may add UI | P2 |
|
||||
| [Settings Sync](non-agent-features/settings-sync-integration.md) | ❌ Not started | No VS Code Settings Sync allowlist registration. Settings tabs are all stubs. | Extension-side (VS Code API) | P3 |
|
||||
| [Settings UI](non-agent-features/settings-ui.md) | 🔨 Partial | 14-tab settings shell exists, all tabs are stubs. [#170](https://github.com/Kilo-Org/kilo/issues/170) | CLI exposes config; extension provides settings forms | P1 |
|
||||
| [Settings UI](non-agent-features/settings-ui.md) | 🔨 Partial | 15-tab settings shell exists. BrowserTab has real settings controls (enable/disable, system Chrome, headless toggles). LanguageTab has working locale selector. Remaining 13 tabs are stubs. [#170](https://github.com/Kilo-Org/kilo/issues/170) | CLI exposes config; extension provides settings forms | P1 |
|
||||
| [Skills System](non-agent-features/skills-system.md) | ❌ Not started | No skill discovery, management, or hot-reload in extension. | CLI has skills runtime; extension provides packaging/UI | P2 |
|
||||
| [Speech-to-Text](non-agent-features/speech-to-text.md) | ❌ Not started | No voice input or streaming STT. | Webview (mic capture); CLI-compatible STT optional | P3 |
|
||||
| [Task History](non-agent-features/task-history.md) | 🔨 Partial | Session list exists but lacks search, metadata, and full persistence. [#167](https://github.com/Kilo-Org/kilo/issues/167) | CLI session storage; extension provides history UI | P1 |
|
||||
@@ -155,13 +161,17 @@ Before publishing this extension to the VS Code Marketplace or deploying to user
|
||||
|
||||
- **Solid.js** (not React) powers the webview. JSX compiles via `esbuild-plugin-solid`. All webview components use Solid's reactive primitives (signals, createEffect, etc.).
|
||||
- **Two separate esbuild builds**: extension (Node/CJS) and webview (browser/IIFE), configured in [`esbuild.js`](../esbuild.js).
|
||||
- **No shared state** between extension and webview. All communication is via `vscode.Webview.postMessage()` with typed messages defined in [`messages.ts`](../webview-ui/src/types/messages.ts).
|
||||
- **No shared state** between extension and webview. All communication is via `vscode.Webview.postMessage()` with typed messages defined in [`messages.ts`](../webview-ui/src/types/messages.ts). Provider hierarchy: `ThemeProvider → DialogProvider → VSCodeProvider → ServerProvider → LanguageBridge → MarkedProvider → ProviderProvider → SessionProvider → DataBridge`.
|
||||
- **CLI backend owns**: agent orchestration, MCP lifecycle, tool execution, search/grep/glob, session storage, permissions runtime, custom commands, skills, and fast edits.
|
||||
- **Extension owns**: VS Code API integrations (code actions, inline completions, terminal, SCM, settings sync), webview rendering, auth mediation, and any feature not supported by CLI.
|
||||
|
||||
### kilo-ui Shared Library
|
||||
|
||||
- **kilo-ui shared library**: The webview now heavily uses `@kilocode/kilo-ui` for UI components. A `DataBridge` component in App.tsx adapts the session store to kilo-ui's `DataProvider` expected shape, enabling shared components like `<KiloMessage>` to work with the extension's data model.
|
||||
|
||||
### Key Differences from Old Extension
|
||||
|
||||
- No `Task.ts` or `webviewMessageHandler.ts` — the CLI server replaces the old in-process agent loop.
|
||||
- Permissions flow through CLI's ask/reply model, not extension-side approval queues.
|
||||
- Permissions flow through CLI's ask/reply model, not extension-side approval queues. Permissions are rendered through kilo-ui's DataProvider pattern, not a standalone PermissionDialog.
|
||||
- Session history is CLI-managed, not stored in VS Code global state.
|
||||
- MCP servers are configured and managed by the CLI, not the extension.
|
||||
|
||||
Reference in New Issue
Block a user