feat(cli): add model token usage indicator to footer and fix stream handling

[christianmerkwirth]

Summary

Add a model token usage indicator to the CLI footer and fix a crash in CodeAssistServer related to non-Node stream responses.

Details

• Model Token Usage Indicator:
  • Implemented getShortDisplayString in packages/core to provide compact model abbreviations (e.g., '3P', '2.5F').
  • Created a new TokenUsageIndicator component in packages/cli.
  • Integrated the indicator into the footer, sorted by usage descending.
  • Added ui.footer.showTokenUsage setting (default: true) to allow users to toggle the display.
• Robust Stream Handling:
  • Improved CodeAssistServer to robustly handle stream responses by wrapping async iterables (like Web ReadableStream) into Node.js Readable streams.
  • Added defensive checks to provide a clear error message if the API returns an unexpected JSON object instead of a stream, fixing the input.on is not a function crash.
• Maintenance:
  • Fixed a circular dependency in contentGenerator.ts.
  • Regenerated settings documentation.
  • Added unit and integration tests for all new functionality.

Related Issues

• Closes Footer: Display Model Usage % #16754
• Fixes the input.on is not a function crash.

How to Validate

1. Run npm start.
2. Send a prompt.
3. Observe token usage indicator in the footer (e.g., 3P: 1.2k).
4. Switch models using /model pro or /model flash and verify usage updates.
5. Check /stats model to confirm the numbers match.
6. Verify the indicator can be hidden with settings set ui.footer.showTokenUsage false.

Pre-Merge Checklist

• Updated relevant documentation and README (if needed)
• Added/updated tests (if needed)
• Noted breaking changes (if any)
• Validated on required platforms/methods:
  • MacOS
  • Windows
  • Linux
    • npm run

[google-cla]

Thanks for your pull request! It looks like this may be your first contribution to a Google open source project. Before we can look at your pull request, you'll need to sign a Contributor License Agreement (CLA).

View this failed invocation of the CLA check for more information.

For the most up to date status, view the checks section at the bottom of the pull request.

[gemini-code-assist]

Summary of Changes

Hello @christianmerkwirth, I'm Gemini Code Assist¹! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!

This pull request enhances the CLI's user experience by introducing a visible token usage indicator in the footer, allowing users to monitor their model interactions more effectively. Concurrently, it significantly improves the stability and error handling of the CodeAssistServer when processing API responses, ensuring smoother operation and clearer diagnostics for stream-based communications.

Highlights

• Model Token Usage Indicator: A new token usage indicator has been added to the CLI footer, displaying cumulative token usage per model. This feature is configurable via a new ui.footer.showTokenUsage setting, which is enabled by default. Model names are shown using compact abbreviations (e.g., '3P', '2.5F') and sorted by usage descending.
• Robust Stream Handling in CodeAssistServer: The CodeAssistServer has been improved to robustly handle various stream responses. It now correctly wraps async iterables (such as Web ReadableStream objects) into Node.js Readable streams, preventing crashes related to unexpected stream types. Additionally, defensive checks were added to provide clear error messages if the API returns a non-stream JSON object.
• Maintenance and Testing: A circular dependency in contentGenerator.ts was resolved, and settings documentation was regenerated. Comprehensive unit and integration tests have been added for the new token usage indicator and the improved stream handling logic.

Changelog

• docs/cli/settings.md
  • Added documentation for the new ui.footer.showTokenUsage setting.
• docs/reference/configuration.md
  • Updated the configuration reference to include the ui.footer.showTokenUsage setting.
• packages/cli/src/config/settingsSchema.ts
  • Added showTokenUsage property to the UI footer settings schema.
• packages/cli/src/ui/components/Footer.test.tsx
  • Added a test case to verify the display of token usage in the footer when enabled.
• packages/cli/src/ui/components/Footer.tsx
  • Imported TokenUsageIndicator component.
  • Introduced showTokenUsage setting from merged settings.
  • Conditionally rendered the TokenUsageIndicator in the footer based on the showTokenUsage setting.
• packages/cli/src/ui/components/TokenUsageIndicator.test.tsx
  • Added unit tests for the TokenUsageIndicator component, covering scenarios with no active models, rendering with abbreviations, and correct sorting by usage.
• packages/cli/src/ui/components/TokenUsageIndicator.tsx
  • Added a new React component TokenUsageIndicator to display token usage for active models.
  • Implemented formatTokens utility to display token counts compactly.
  • Integrated getShortDisplayString from @google/gemini-cli-core for model abbreviations.
  • Sorted active models by total token usage in descending order for display.
• packages/core/src/code_assist/server.test.ts
  • Added a test to verify requestStreamingPost correctly handles async iterable input.
  • Added a test to confirm requestStreamingPost throws a descriptive error for non-stream input.
• packages/core/src/code_assist/server.ts
  • Imported Readable from node:stream.
  • Modified requestStreamingPost to detect and wrap async iterables (like Web ReadableStream) into Node.js Readable streams.
  • Implemented defensive checks to throw an informative error if res.data is not a stream or async iterable.
• packages/core/src/config/models.test.ts
  • Added unit tests for the new getShortDisplayString function, covering various Gemini models, auto models, and non-Gemini models.
• packages/core/src/config/models.ts
  • Added getShortDisplayString function to provide compact abbreviations for model names.
• packages/core/src/core/contentGenerator.ts
  • Refactored imports to resolve a circular dependency by importing getVersion from ../utils/version.js and resolveModel from ../config/models.js.
• schemas/settings.schema.json
  • Added showTokenUsage property to the ui.footer section of the settings JSON schema.

Ignored Files

• Ignored by pattern: .gemini/** (1)
  • .gemini/skills/pr-address-comments/scripts/fetch-pr-info.js

Activity

• The pull request introduces new features and fixes, including a token usage indicator and improved stream handling.
• New unit and integration tests have been added to cover the new functionality.
• Documentation for the new settings has been updated in docs/cli/settings.md and docs/reference/configuration.md.
• The author has validated the changes on Linux by running npm run.

Using Gemini Code Assist

The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.

Invoking Gemini

You can request assistance from Gemini at any point by creating a comment using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands on the current page.

Feature	Command	Description
Code Review	/gemini review	Performs a code review for the current pull request in its current state.
Pull Request Summary	/gemini summary	Provides a summary of the current pull request in its current state.
Comment	@gemini-code-assist	Responds in comments when explicitly tagged, both in pull request comments and review comments.
Help	/gemini help	Displays a list of available commands.

Customization

To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.

Limitations & Feedback

Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.

You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.

Footnotes

1. Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩

[gemini-code-assist]

Code Review

The pull request introduces a model token usage indicator in the CLI footer and improves the robustness of stream handling in CodeAssistServer. The changes are well-structured and include comprehensive tests. However, there are a few critical issues in the manual SSE parsing logic and resource management that should be addressed to ensure correctness and prevent potential memory leaks.

[jackwotherspoon]

Hi @christianmerkwirth thanks for the PR 😄

Quick note, we try and have PRs follow the separation of concerns pattern. i.e. they should fix one thing and one thing only. That way there is a clean history and if we need to revert something we can do it easily without having to pull out pieces of logic.

For this PR the stream handling fix should be fully separate from the footer indicator as they are unrelated to one another. My personal rule of thumb is that whenever you start adding "and" to a PR title it should most likely be split into two PRs 😁.

Also I have a PR up to add /footer command that allows toggling and re-ordering all footer items in a clean way.

#19001

Thus the ui.footer.showTokenUsage and other settings for footer will become deprecated and legacy shortly.

So I think the best course of action is to remove the footer piece entirely from this PR and have it focus on the stream handling issue. Hope this makes sense. Thanks a ton for the contribution!