Skip to content

feat(vscode): show balance in account controls - #11803

Merged
johnnyeric merged 1 commit into
mainfrom
johnnyeric/balance-vscode-ui
Jul 1, 2026
Merged

feat(vscode): show balance in account controls#11803
johnnyeric merged 1 commit into
mainfrom
johnnyeric/balance-vscode-ui

Conversation

@johnnyeric

@johnnyeric johnnyeric commented Jun 29, 2026

Copy link
Copy Markdown
Contributor

Context

Show Kilo account balance where users already manage account context, and expand the Profile view with Kilo Pass details so balance and subscription state are visible in one place.

Implementation

  • Add a passive balance chip to the VS Code webview account switcher so the header reads like Kilo $947.89 MEMBER without adding another Profile navigation target.
  • Surface Kilo Pass usage, bonus credits, renewal date, and top-up/subscribe actions in the Profile view.
  • Add profile message typing, localized labels, Storybook sample data, and a changeset.

Screenshots / Video

vscode vscode-2

How to Test

Manual/local verification

  • Agent: bun run typecheck from packages/kilo-vscode/ passed.
  • Agent: bun run lint from packages/kilo-vscode/ passed.

Reviewer test steps

  1. Sign in with a Kilo account that has balance data and an organization membership.
  2. Open the empty chat view.
  3. Confirm the header account control shows account name, balance, and role badge in one control, e.g. Kilo $947.89 MEMBER.
  4. Open Profile and confirm balance, Kilo Pass usage, bonus credits, renewal date, and top-up/subscribe actions render as expected.

Checklist

  • Issue linked above, or exception explained
  • Tests/verification described
  • Screenshots/video included for visual changes, or marked N/A
  • Changeset considered for user-facing changes
  • I personally reviewed the diff and can explain the changes, including any AI-assisted work.

@johnnyeric
johnnyeric force-pushed the johnnyeric/balance-vscode-ui branch from 443eb8f to ea7e4f0 Compare June 29, 2026 14:53
@johnnyeric
johnnyeric marked this pull request as ready for review June 29, 2026 14:59
Comment thread packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx Outdated
@kilo-code-bot

kilo-code-bot Bot commented Jun 29, 2026

Copy link
Copy Markdown
Contributor

Code Review Summary

Status: No Issues Found | Recommendation: Merge

Files Reviewed (31 files)
  • .changeset/warm-balance-chip.md
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-chromium-linux.png
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-personal-chromium-linux.png
  • packages/kilo-docs/source-links.md
  • packages/kilo-vscode/webview-ui/src/components/chat/TaskHeader.tsx
  • packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx
  • packages/kilo-vscode/webview-ui/src/components/shared/AccountSwitcher.tsx
  • packages/kilo-vscode/webview-ui/src/components/shared/BalanceChip.tsx
  • packages/kilo-vscode/webview-ui/src/i18n/ar.ts
  • packages/kilo-vscode/webview-ui/src/i18n/br.ts
  • packages/kilo-vscode/webview-ui/src/i18n/bs.ts
  • packages/kilo-vscode/webview-ui/src/i18n/da.ts
  • packages/kilo-vscode/webview-ui/src/i18n/de.ts
  • packages/kilo-vscode/webview-ui/src/i18n/en.ts
  • packages/kilo-vscode/webview-ui/src/i18n/es.ts
  • packages/kilo-vscode/webview-ui/src/i18n/fr.ts
  • packages/kilo-vscode/webview-ui/src/i18n/it.ts
  • packages/kilo-vscode/webview-ui/src/i18n/ja.ts
  • packages/kilo-vscode/webview-ui/src/i18n/ko.ts
  • packages/kilo-vscode/webview-ui/src/i18n/nl.ts
  • packages/kilo-vscode/webview-ui/src/i18n/no.ts
  • packages/kilo-vscode/webview-ui/src/i18n/pl.ts
  • packages/kilo-vscode/webview-ui/src/i18n/ru.ts
  • packages/kilo-vscode/webview-ui/src/i18n/th.ts
  • packages/kilo-vscode/webview-ui/src/i18n/tr.ts
  • packages/kilo-vscode/webview-ui/src/i18n/uk.ts
  • packages/kilo-vscode/webview-ui/src/i18n/zh.ts
  • packages/kilo-vscode/webview-ui/src/i18n/zht.ts
  • packages/kilo-vscode/webview-ui/src/stories/profile.stories.tsx
  • packages/kilo-vscode/webview-ui/src/styles/welcome.css
  • packages/kilo-vscode/webview-ui/src/types/messages/profile.ts
Previous Review Summaries (3 snapshots, latest commit 709a0e4)

Current summary above is authoritative. Previous snapshots are kept for context only.

Previous review (commit 709a0e4)

Status: No Issues Found | Recommendation: Merge

Files Reviewed (31 files)
  • .changeset/warm-balance-chip.md
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-chromium-linux.png
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-personal-chromium-linux.png
  • packages/kilo-docs/source-links.md
  • packages/kilo-vscode/webview-ui/src/components/chat/TaskHeader.tsx
  • packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx
  • packages/kilo-vscode/webview-ui/src/components/shared/AccountSwitcher.tsx
  • packages/kilo-vscode/webview-ui/src/components/shared/BalanceChip.tsx
  • packages/kilo-vscode/webview-ui/src/i18n/ar.ts
  • packages/kilo-vscode/webview-ui/src/i18n/br.ts
  • packages/kilo-vscode/webview-ui/src/i18n/bs.ts
  • packages/kilo-vscode/webview-ui/src/i18n/da.ts
  • packages/kilo-vscode/webview-ui/src/i18n/de.ts
  • packages/kilo-vscode/webview-ui/src/i18n/en.ts
  • packages/kilo-vscode/webview-ui/src/i18n/es.ts
  • packages/kilo-vscode/webview-ui/src/i18n/fr.ts
  • packages/kilo-vscode/webview-ui/src/i18n/it.ts
  • packages/kilo-vscode/webview-ui/src/i18n/ja.ts
  • packages/kilo-vscode/webview-ui/src/i18n/ko.ts
  • packages/kilo-vscode/webview-ui/src/i18n/nl.ts
  • packages/kilo-vscode/webview-ui/src/i18n/no.ts
  • packages/kilo-vscode/webview-ui/src/i18n/pl.ts
  • packages/kilo-vscode/webview-ui/src/i18n/ru.ts
  • packages/kilo-vscode/webview-ui/src/i18n/th.ts
  • packages/kilo-vscode/webview-ui/src/i18n/tr.ts
  • packages/kilo-vscode/webview-ui/src/i18n/uk.ts
  • packages/kilo-vscode/webview-ui/src/i18n/zh.ts
  • packages/kilo-vscode/webview-ui/src/i18n/zht.ts
  • packages/kilo-vscode/webview-ui/src/stories/profile.stories.tsx
  • packages/kilo-vscode/webview-ui/src/styles/welcome.css
  • packages/kilo-vscode/webview-ui/src/types/messages/profile.ts

Previous review (commit 80755d5)

Status: 2 Issues Found | Recommendation: Address before merge

Overview

Severity Count
CRITICAL 0
WARNING 2
SUGGESTION 0

Fix these issues in Kilo Cloud

Issue Details (click to expand)

WARNING

File Line Issue
packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx 310 The new Kilo Pass metadata labels are hard-coded in English, so localized profile pages now render mixed-language content.
packages/kilo-vscode/webview-ui/src/styles/welcome.css 467 flex-shrink: 0 prevents long account names from truncating, so the fixed-width switcher can overflow once the new balance chip is present.
Files Reviewed (31 files)
  • .changeset/warm-balance-chip.md - 0 issues
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-chromium-linux.png - 0 issues
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-personal-chromium-linux.png - 0 issues
  • packages/kilo-docs/source-links.md - 0 issues
  • packages/kilo-vscode/webview-ui/src/components/chat/TaskHeader.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx - 1 issue
  • packages/kilo-vscode/webview-ui/src/components/shared/AccountSwitcher.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/components/shared/BalanceChip.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ar.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/br.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/bs.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/da.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/de.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/en.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/es.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/fr.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/it.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ja.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ko.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/nl.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/no.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/pl.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ru.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/th.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/tr.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/uk.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/zh.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/zht.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/stories/profile.stories.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/styles/welcome.css - 1 issue
  • packages/kilo-vscode/webview-ui/src/types/messages/profile.ts - 0 issues

Previous review (commit ea7e4f0)

Status: 2 Issues Found | Recommendation: Address before merge

Overview

Severity Count
CRITICAL 0
WARNING 2
SUGGESTION 0

Fix these issues in Kilo Cloud

Issue Details (click to expand)

WARNING

File Line Issue
packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx 27 resetLabel() drops the existing UTC and invalid-date handling, so renew dates can render as the wrong calendar day or throw during render.
packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx 339 The new Kilo Pass subscribe CTA is focusable but not keyboard-activatable because it only handles onClick.
Files Reviewed (31 files)
  • .changeset/warm-balance-chip.md - 0 issues
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-chromium-linux.png - 0 issues
  • packages/kilo-docs/public/img/screenshot-tests/kilo-vscode/visual-regression/profile/logged-in-personal-chromium-linux.png - 0 issues
  • packages/kilo-docs/source-links.md - 0 issues
  • packages/kilo-vscode/webview-ui/src/components/chat/TaskHeader.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx - 2 issues
  • packages/kilo-vscode/webview-ui/src/components/shared/AccountSwitcher.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/components/shared/BalanceChip.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ar.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/br.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/bs.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/da.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/de.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/en.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/es.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/fr.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/it.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ja.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ko.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/nl.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/no.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/pl.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/ru.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/th.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/tr.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/uk.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/zh.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/i18n/zht.ts - 0 issues
  • packages/kilo-vscode/webview-ui/src/stories/profile.stories.tsx - 0 issues
  • packages/kilo-vscode/webview-ui/src/styles/welcome.css - 0 issues
  • packages/kilo-vscode/webview-ui/src/types/messages/profile.ts - 0 issues

Reviewed by gpt-5.4-20260305 · Input: 86.8K · Output: 10.2K · Cached: 671.7K

Review guidance: REVIEW.md from base branch main

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: ea7e4f0dc9

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx Outdated
Comment thread packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx Outdated
@johnnyeric
johnnyeric force-pushed the johnnyeric/balance-vscode-ui branch from ea7e4f0 to 80755d5 Compare June 29, 2026 15:39
Comment thread packages/kilo-vscode/webview-ui/src/components/profile/ProfileView.tsx Outdated
Comment thread packages/kilo-vscode/webview-ui/src/styles/welcome.css Outdated
@johnnyeric
johnnyeric force-pushed the johnnyeric/balance-vscode-ui branch from 80755d5 to 709a0e4 Compare June 29, 2026 15:48
@johnnyeric
johnnyeric force-pushed the johnnyeric/balance-vscode-ui branch from 709a0e4 to cd18859 Compare June 29, 2026 16:43
@johnnyeric
johnnyeric merged commit 9638de5 into main Jul 1, 2026
23 checks passed
@johnnyeric
johnnyeric deleted the johnnyeric/balance-vscode-ui branch July 1, 2026 10:29
t7tran pushed a commit to t7tran/kilocode that referenced this pull request Aug 14, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants