commit a0801ad5dbd2a0e4d4983447b62f72444e829927
author Josh Bleecher Snyder <josharian@gmail.com> Fri Apr 25 19:34:53 2025 +0000
committer Josh Bleecher Snyder <josharian@gmail.com> Fri Apr 25 13:56:59 2025 -0700
tree 6c622b74649869703cd85f2fe3ea317ee293d46f
parent df2d3dccd3f2f97fd4b8ab3bd153fbef15becea0

Add comma formatting to input and output token displays

The token counts now display with commas in both the terminal UI and web UI.

Co-Authored-By: sketch <hello@sketch.dev>

webui/src/web-components/sketch-timeline-message.ts

diff --git a/webui/src/web-components/sketch-timeline-message.ts b/webui/src/web-components/sketch-timeline-message.ts
index a2dd533..95de17a 100644
--- a/webui/src/web-components/sketch-timeline-message.ts
+++ b/webui/src/web-components/sketch-timeline-message.ts
@@ -596,13 +596,14 @@
               ? html` <span class="message-usage">
                   <span title="Input tokens"
                     >In:
-                    ${(this.message?.usage?.input_tokens || 0) +
-                    (this.message?.usage?.cache_read_input_tokens || 0) +
-                    (this.message?.usage?.cache_creation_input_tokens ||
-                      0)}</span
+                    ${this.formatNumber(
+                      (this.message?.usage?.input_tokens || 0) +
+                      (this.message?.usage?.cache_read_input_tokens || 0) +
+                      (this.message?.usage?.cache_creation_input_tokens || 0)
+                    )}</span
                   >
                   <span title="Output tokens"
-                    >Out: ${this.message?.usage?.output_tokens}</span
+                    >Out: ${this.formatNumber(this.message?.usage?.output_tokens)}</span
                   >
                   <span title="Message cost"
                     >(${this.formatCurrency(