Skip to content

feat: add projection segment on current-period bar in charts#886

Merged
rajbos merged 1 commit into
mainfrom
rajbos/chart-projection-segments
May 15, 2026
Merged

feat: add projection segment on current-period bar in charts#886
rajbos merged 1 commit into
mainfrom
rajbos/chart-projection-segments

Conversation

@rajbos
Copy link
Copy Markdown
Owner

@rajbos rajbos commented May 15, 2026

Summary

Adds a semi-transparent stacked "projected remaining" segment on top of the current-period bar in every chart view (today / this week / this month).

How it works

The projection formula matches the user spec:

extra = actual / fractionElapsed - actual

where fractionElapsed uses minute-level precision:

  • Day view: (hours×60 + minutes) / 1440
  • Week view: (isoWeekDay + dayFrac) / 7 (Mon=0…Sun=6)
  • Month view: (dayOfMonth − 1 + dayFrac) / daysInMonth

Visual style

View Actual bar Projection segment
Total tokens Blue rgba(54,162,235,0.6) Same blue rgba(54,162,235,0.2)
Est. Cost Green rgba(34,197,94,0.6) Same green rgba(34,197,94,0.2)
By Model / Editor / Repo Coloured segments Neutral grey rgba(200,200,200,0.25)

Tooltip shows 📈 Projected (today) / 📈 Projected (this week) / 📈 Projected (this month).

Not shown when

  • Rolling-average mode is active
  • Period barely started (<1% elapsed)
  • Period essentially complete (≥99.5% elapsed)
  • No actual usage yet (0 tokens)

Files changed

  • src/webview/chart/projectionUtils.ts — new: getCurrentPeriodFraction() and computeProjectionExtra() helpers
  • src/webview/chart/main.ts — adds projection dataset to all 5 chart views; enables stacking on total/cost views
  • test/unit/webview-chart-projection.test.ts — 18 unit tests, all passing ✅

For the 'today', 'this week', and 'this month' bars, adds a
semi-transparent stacked segment showing the projected remaining
tokens/cost for the period, calculated as:

  extra = actual / fractionElapsed - actual

where fractionElapsed uses minute-level precision:
- day:   (hours*60 + minutes) / 1440
- week:  (isoWeekDay + dayFrac) / 7   (Mon=0...Sun=6)
- month: (dayOfMonth - 1 + dayFrac) / daysInMonth

Applies to all chart views (total, cost, model, editor, repository).
Hidden in rolling-average mode. Uses same colour family as the actual
bar but at 20-25% opacity so projection is visually distinct.

Projection helpers are extracted to projectionUtils.ts with full
unit-test coverage (18 tests).

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@rajbos rajbos merged commit ac4754a into main May 15, 2026
17 checks passed
@rajbos rajbos deleted the rajbos/chart-projection-segments branch May 15, 2026 14:29
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.

1 participant