Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

Visualize context window usage in Ask Sourcebot - #1370

Merged
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context
Jun 26, 2026
Merged

Visualize context window usage in Ask Sourcebot#1370
jsourcebot merged 12 commits into
mainfrom
jminnetian/visualize-context

Conversation

@jsourcebot

@jsourcebotjsourcebot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor
image

We support showing the context usage in cases where we know the context window the model (from models.dev). For self hosted models or if they are behind an API, this will not currently work.

Summary by CodeRabbit

  • New Features
    • Added a context-window usage gauge to chat details, visualizing the latest turn’s prompt token consumption as a percent of the selected model’s context window (with tooltip and progress arc).
    • Streaming now includes the model’s context-window value in message metadata so the gauge can render when available.
    • Context-window sizes are resolved from the models catalog, including provider/model mapping.
  • Bug Fixes
    • The gauge is not shown when context-window data is missing, invalid, or unsupported.
  • Tests
    • Expanded tests for catalog lookup, mapping, caching/refresh, and failure scenarios.

@coderabbitai

coderabbitaiBot commented Jun 26, 2026

Copy link
Copy Markdown
Contributor

Review Change Stack

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

  • @coderabbitai resume to resume automatic reviews.
  • @coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

  • ▶️ Resume reviews
  • 🔍 Trigger review

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: a7bd1907-3351-47cc-8b2e-9949b6810958

📥 Commits

Reviewing files that changed from the base of the PR and between 005f251 and 28f61eb.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts
✅ Files skipped from review due to trivial changes (2)
  • packages/web/src/features/chat/types.ts
  • CHANGELOG.md
🚧 Files skipped from review as they are similar to previous changes (6)
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts

Walkthrough

Adds context-window resolution to chat flows, carries that value through message metadata, and renders a usage gauge in chat details. The changelog also notes the new gauge.

Changes

Context window usage gauge

Layer / File(s)Summary
Catalog lookup and caching
packages/web/src/features/chat/modelContextWindow.server.ts, packages/web/src/features/chat/modelContextWindow.test.ts
lookupContextWindow and resolveContextWindow load the models.dev catalog, map provider IDs, and return context-window values; tests cover lookup cases and cached fetch behavior.
Context window propagation
packages/web/src/app/api/(server)/ee/chat/route.ts, packages/web/src/ee/features/mcp/askCodebase.ts
The chat route and askCodebase resolve the selected model context window and pass it into createMessageStream.
Metadata carries contextWindow
packages/web/src/features/chat/types.ts, packages/web/src/ee/features/chat/agent.ts
SBChatMessageMetadata and createMessageStream now carry contextWindow in message metadata.
Chat details gauge
packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx, CHANGELOG.md
DetailsCardComponent derives context-window usage from the latest step token counts, renders ContextWindowGauge, and the changelog records the new gauge.

Sequence Diagram(s)

sequenceDiagram
participant ChatRoute
participant AskCodebase
participant ResolveContextWindow
participant CreateMessageStream
participant DetailsCardComponent
ChatRoute->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
AskCodebase->>ResolveContextWindow: resolveContextWindow(languageModelConfig)
ResolveContextWindow-->>ChatRoute: contextWindow
ResolveContextWindow-->>AskCodebase: contextWindow
ChatRoute->>CreateMessageStream: createMessageStream(..., contextWindow)
AskCodebase->>CreateMessageStream: createMessageStream(..., contextWindow)
CreateMessageStream-->>DetailsCardComponent: message-metadata.contextWindow
DetailsCardComponent->>DetailsCardComponent: derive usage and render gauge
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

Suggested reviewers

  • brendan-kellam
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check nameStatusExplanation
Description Check✅ PassedCheck skipped - CodeRabbit’s high-level summary is enabled.
Title check✅ PassedThe title clearly matches the main change: adding a context window usage visualization for Ask Sourcebot.
Docstring Coverage✅ PassedNo functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check✅ PassedCheck skipped because no linked issues were found for this pull request.
Out of Scope Changes check✅ PassedCheck skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch jminnetian/visualize-context

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@coderabbitaicoderabbitaiBot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Actionable comments posted: 2

🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@CHANGELOG.md`:
- Line 15: Update the changelog entry for the context-window usage gauge to
follow the enterprise-only convention by adding the [EE] prefix, and replace the
placeholder PR reference with the real GitHub PR number/link. Keep the wording
otherwise the same, and make sure the entry still clearly describes the Ask
Sourcebot chat details gauge and its models.dev-based window sizing.
In `@packages/web/src/features/chat/modelContextWindow.server.ts`:
- Around line 59-73: The loadCatalog caching flow currently drops the previously
cached ModelsDevCatalog on a failed refresh and immediately retries every
request, which can block chat sends on the request path. Update loadCatalog so a
TTL-triggered fetch failure preserves and returns the last-known-good catalog
instead of replacing it with null, and add a short negative-cache/backoff window
for repeated fetchCatalog failures. Keep the retry behavior bounded, but avoid
clearing a usable catalog or reattempting on every resolveContextWindow call.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 808a7227-a756-49ec-9fad-14d26485aa46

📥 Commits

Reviewing files that changed from the base of the PR and between 5e1b8ee and b02535e.

📒 Files selected for processing (8)
  • CHANGELOG.md
  • packages/web/src/app/api/(server)/ee/chat/route.ts
  • packages/web/src/ee/features/chat/agent.ts
  • packages/web/src/ee/features/chat/components/chatThread/detailsCard.tsx
  • packages/web/src/ee/features/mcp/askCodebase.ts
  • packages/web/src/features/chat/modelContextWindow.server.ts
  • packages/web/src/features/chat/modelContextWindow.test.ts
  • packages/web/src/features/chat/types.ts

Comment threadCHANGELOG.md Outdated
Comment threadpackages/web/src/features/chat/modelContextWindow.server.ts
if (percent >= CONTEXT_USAGE_YELLOW_PERCENT) {
return "text-yellow-500";
}
return "text-[#6cb38f]";

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

to confirm, does this look good in light mode?

Resolve each model's context window from the models.dev catalog (already
fetched by the setup wizard) and bake it into chat message metadata. The
Details card now renders a usage gauge from the latest step's input tokens.
Models with no catalog entry (openai-compatible/self-hosted) fall back to
the existing raw token count.
createMessageStream's MCP/programmatic caller omitted contextWindow, so
chats created via ask_codebase rendered the Details card without a usage
gauge even for catalogued models — unlike the same chat created from the
web API. Resolve it from the already-available languageModelConfig so the
gauge is deterministic per model, not per entry point.
Replace the horizontal bar with a circular ring showing the percentage
inside and the used / total token counts beside it. The arc and percentage
are colored by usage — green below 70%, yellow from 70%, red from 90%.
Shrink the ring and move the percentage beside it, reading
"<percent>% of <total>" instead of a number-in-ring. The arc and
percentage stay colored by usage (green/yellow/red).
Reduce the ring to 14px, switch the track to a solid palette gray (the
theme tokens lack an alpha channel, so /opacity on them was ignored and
the track rendered at full brightness), and use a desaturated sage green
for the in-range percentage.
Also drop the gauge's yellow/red thresholds from 70/90 to 50/80 so the
ring shifts color earlier as the context fills.
Real PR number to be filled in once the PR is opened.
Previously a failed fetch reset the cache to null, so every chat send
re-attempted the fetch and blocked up to the 8s timeout during a models.dev
outage; a failed TTL refresh also discarded the previously-cached catalog.
Switch loadCatalog to stale-while-revalidate: after the first successful
load the request path never blocks (it serves the last-known-good catalog
and refreshes in the background), failed refreshes keep the cached value,
and a 60s negative-cache window bounds retries during an outage.
@jsourcebot
jsourcebotforce-pushed the jminnetian/visualize-context branch from 005f251 to 28f61ebCompareJune 26, 2026 20:32
@jsourcebot
jsourcebot merged commit 0fdf0b3 into mainJun 26, 2026
9 checks passed
@github-actionsgithub-actionsBot mentioned this pull request Jun 26, 2026
Sign up for freeto 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

@jsourcebot@brendan-kellam