feat(tui): add About dialog - #12466
Conversation
Adds a new "About" dialog accessible from the command palette and via the `/about` slash command. The dialog shows: - Version, channel, build kind, license - Runtime (Bun/Node), platform, $TERM - Config dir, project root, cwd - Connected providers, default model, agent/MCP/plugin counts - Helpful links (docs, GitHub, issues, Discord) - `c` to copy diagnostic info to the clipboard The body is wrapped in a scrollbox with a visible scrollbar and a height clamped to a fraction of the terminal height so the dialog stays usable on small terminals. `kilo.about` is registered as a palette command alongside the other Kilo Gateway commands in `registerKiloCommands`.
Code Review SummaryStatus: No Issues Found | Recommendation: Merge Files Reviewed (2 files)
Previous Review Summaries (4 snapshots, latest commit abc5530)Current summary above is authoritative. Previous snapshots are kept for context only. Previous review (commit abc5530)Status: 2 Issues Found | Recommendation: Address before merge Overview
Issue Details (click to expand)WARNING
SUGGESTION
Files Reviewed (2 files, incremental)
Fix these issues in Kilo Cloud Previous review (commit 9112b77)Status: 2 Issues Found | Recommendation: Address before merge Overview
Issue Details (click to expand)WARNING
Files Reviewed (1 file, incremental)
Fix these issues in Kilo Cloud Previous review (commit 81d2828)Status: 1 Issue Found | Recommendation: Address before merge Overview
Issue Details (click to expand)WARNING
Files Reviewed (2 files, incremental)
The previous SUGGESTION about the Fix these issues in Kilo Cloud Previous review (commit 4f8fac0)Status: 2 Issues Found | Recommendation: Address before merge Overview
Issue Details (click to expand)WARNING
SUGGESTION
Files Reviewed (3 files)
Both changed files live entirely under Reviewed by grok-4.6 · Input: 181.6K · Output: 15.5K · Cached: 742.3K Review guidance: REVIEW.md from base branch |
4f8fac0 to
5c1bcc8
Compare
User-facing new feature in @kilocode/cli: About dialog reachable from the command palette and via `/about`.
6979196 to
81d2828
Compare
|
@IamCoder18 I like the idea, but I am not sure if we really need all of those infos. I think we should simplify this and only include the most important infos for that that matter. |
Drop counts (agents/MCP/plugins), plugin list, build kind, terminal, and CWD; combine runtime+platform into a single row. Inline the copy-diagnostics payload instead of a dedicated helper. Remove License from the copied payload.
The MIT literal could go stale and mislead in a diagnostic surface meant for accurate bug reports. Drop the row and refresh the changeset to list only the items the dialog actually shows.
I dropped the agent/MCP/plugin counts, the plugins list, Build, Terminal, license, and CWD rows, and folded Runtime + Platform into a single row.
Example copy diagnositics: |
|
Comment to prevent this PR from automatically closing due to 30 days of inactivity. |
| `Config: ${Global.Path.config}`, | ||
| `Project: ${projectRoot()}`, |
There was a problem hiding this comment.
Should we consider the existing privacy mode here, and abbreviate/redact paths according to the privacy settings?
| <Row theme={theme} label="Runtime" value={`${runtime()} (${process.platform}/${process.arch})`} muted /> | ||
| <Row theme={theme} label="Config" value={truncate(Global.Path.config, 60)} muted /> | ||
| <Row theme={theme} label="Project" value={truncate(projectRoot(), 60)} muted /> |
There was a problem hiding this comment.
See above comment about privacy mode.
| const connected = sync.data.provider_next.connected | ||
| return connected.length ? connected.join(", ") : "(none connected)" | ||
| } | ||
| const defaultModel = () => sync.data.config.model ?? "" |
There was a problem hiding this comment.
The selected model here may differ from the model picker. Please take a look at how debug dialog uses local.model.current().
- Use live picker selection for default model via useLocal().model.current() - Run config fallback through Model.name() for consistent format - Apply privacy_mode redaction to Config/Project in both copy() and display - Use shared pathLabel helper so clipboard matches on-screen rendering - Add REDACTED_PATH constant to keep path redaction distinct from balance
|
Thanks @IamCoder18 for addressing the comments - looks great. Merged. |


Issue
Closes #12465
Context
The TUI had no in-session way to view version, build, runtime, config path, or current provider info. Users filing bug reports had to leave the TUI to gather it from another shell.
This adds an About dialog reachable from the command palette (under "Kilo") and via a
/aboutslash command. It shows version/channel/build, runtime, environment, provider/model, MCP/plugin/agent counts, helpful links, and a one-key action to copy a diagnostic block to the clipboard for bug reports.Implementation
A new
DialogAboutcomponent (packages/opencode/src/kilocode/cli/cmd/tui/component/dialog-about.tsx) renders the existing dialog chrome (useDialog,useTheme) and reads from the same TUI contexts already used elsewhere. The body is wrapped in a<scrollbox>with a visible vertical scrollbar and a height clamped to a fraction of the terminal height so it stays usable on small terminals.kilo.aboutis registered as a palette command inregisterKiloCommands(the same placekilo.profile,kilo.teams, etc. live), which gives it both the command palette entry and the/aboutslash autocomplete throughuseCommandSlashes. A localuseBindingscall inside the dialog addsesc/returnto close,cto copy diagnostics, andpageup/pagedownfor keyboard scrolling.InstallationVersion,InstallationChannel,InstallationBuildKindandGlobal.Pathare reused for build identity; runtime detection falls back toprocess.versions.nodewhenBunis not present.Both edited files live entirely under
packages/opencode/src/kilocode/, so nokilocode_changemarkers are needed and there is no upstream-shared file changes.Screenshots / Video
How to Test
Manual/local verification
ctrl+p) and search for "About". Confirm it appears under the Kilo category and opens the dialog./about. Confirm it opens the dialog.cinside the dialog. Confirm the toast "Diagnostics copied" appears and the clipboard now contains the multi-line block with version, runtime, provider, etc.Reviewer test steps
ctrl+p, typeabout, select the entry.$TERM, config path, project root, cwd, connected provider, default model, agent/MCP/plugin counts, and links.cand paste somewhere to confirm the diagnostic block was copied.Checklist
Get in Touch
Discord: @IamCoder18