UsageBar

AI coding assistant usage in your VS Code status bar.

UsageBar is a VS Code extension that displays real-time usage metrics — quota windows, rate limits, and account balances — for your AI coding tools, directly in the editor's status bar.

Inspired by and based on CodexBar by @steipete — a macOS menu bar app with the same provider coverage. UsageBar brings the same philosophy cross-platform into VS Code.

Supported Providers

Features

• Status bar items — one per enabled provider; shows usage % or balance with a progress bar and custom provider icon
• Detail popup — click any status bar item to open a QuickPick with progress bars, reset times, and balance breakdowns; pressing Enter on any data row opens the provider's web portal
• Configurable refresh — manual, or automatic at 1 / 2 / 5 / 15 / 30 minute intervals
• Native VS Code settings — configure providers, display options, and auth sources via the standard Settings UI (usagebar.*)
• Secure secret storage — API keys and cookies stored in VS Code's built-in secret store (OS keychain-backed), never in plaintext settings
• Cross-platform — macOS, Linux, Windows

Installation

Install from the VS Code Marketplace:

1. Open VS Code
2. Press Ctrl+P / Cmd+P → type ext install lfmundim.usagebar
3. Reload VS Code
4. Status bar items appear automatically; open VS Code Settings and search usagebar to configure

Or install the .vsix directly:

code --install-extension <downloaded-release>.vsix

Quick Start

Claude Code

UsageBar automatically reads Claude CLI credentials from ~/.claude/.credentials.json (created by claude login). No manual setup required for most users.

OpenAI Codex CLI

Reads OAuth credentials from ~/.codex/auth.json (created by codex login). No manual setup needed.

Mistral

UsageBar can import your session cookie automatically from Firefox on macOS. On other browsers or platforms, paste the full Cookie: header manually:

1. Open console.mistral.ai/codestral/cli
2. Open DevTools → Network tab → click any request → copy the Cookie: header value
3. Run UsageBar: Set Mistral Admin Cookie from the Command Palette

Toggle between Vibe plan % and billing spend via the detail popup (click the Mistral status bar item).

DeepSeek

Set DEEPSEEK_API_KEY in your environment, or run UsageBar: Set DeepSeek API Key from the Command Palette. Get a key at platform.deepseek.com/usage.

Antigravity

Recommended setup: install antigravity-usage and run antigravity-usage login once. UsageBar reads its stored credentials and auto-refreshes tokens on every cycle — no manual token management needed.

npm install -g antigravity-usage
antigravity-usage login

If the Antigravity IDE extension language server is running (detected via ps), UsageBar probes it directly without needing any OAuth setup.

Model display: Antigravity exposes many Gemini and Claude/GPT models. UsageBar merges them intelligently:

• Models that share the same quota pool are collapsed into a single Gemini or Claude|GPT entry.
• If a model has a different remaining fraction than the rest of its group, it is shown individually (e.g. Gemini 3.5 Flash) with the rest shown as Gemini (others).
• Claude and GPT models share a single pool and are always merged as Claude|GPT.

Use usagebar.providers.antigravity.group to choose which group appears as the primary status bar metric ("gemini" or "claude").

Configuration

All settings live under usagebar.* in VS Code Settings. Provider sub-settings are hidden when the provider is disabled.

Secret management (Command Palette)

Architecture

src/
  extension.ts              # activate() / deactivate(), command registration
  providers/
    base.ts                 # ProviderInterface, UsageSnapshot types
    claude.ts               # Claude Code provider
    codex.ts                # OpenAI Codex CLI provider
    mistral.ts              # Mistral provider
    deepseek.ts             # DeepSeek provider
    antigravity.ts          # Antigravity provider
    registry.ts             # Provider registry
  statusBar/
    controller.ts           # Manages StatusBarItem instances
    renderer.ts             # Text + progress bar rendering
    detail.ts               # QuickPick detail popup
  store/
    usageStore.ts           # State holder; orchestrates refresh timer
  util/
    secrets.ts              # VS Code SecretStorage wrapper
    http.ts                 # HTTPS request helper

Each provider implements ProviderInterface:

interface ProviderInterface {
  readonly id: string;
  isAvailable(): Promise<boolean>;
  fetch(): Promise<UsageSnapshot>;
}

Contributing

Pull requests welcome. Please open an issue first for large changes.

git clone https://github.com/lfmundim/UsageBar
cd UsageBar
npm install
npm run compile
# Press F5 in VS Code to launch Extension Development Host

Credits

• CodexBar by @steipete — the macOS menu bar app that inspired this project. Provider integration logic, API endpoints, auth strategies, and data parsing approaches in UsageBar are directly derived from studying CodexBar's open-source implementation.
• antigravity-usage by @skainguyen1412 — CLI tool that handles Google Cloud Code OAuth for Antigravity. UsageBar reads its stored credentials and delegates token refresh to it.

License

MIT — see LICENSE.