Skip to content

Improve CI status widget icons and layout in sessions changes view#302425

Merged
benibenj merged 4 commits intomainfrom
copilot/conceptual-puma
Mar 17, 2026
Merged

Improve CI status widget icons and layout in sessions changes view#302425
benibenj merged 4 commits intomainfrom
copilot/conceptual-puma

Conversation

@benibenj
Copy link
Contributor

Summary

Improves the CI checks list in the sessions window changes view with better icons and proper layout/scrolling behavior.

Icon improvements

  • Header icon: Shows a pending icon when checks are pending, red error icon on failure, green checkmark on success, and spinning loader when running
  • Queued checks: Now show a filled circle icon (grey) instead of an empty outline, making them visually distinct
  • Fix Checks button: Uses lightbulbAutofix codicon instead of sparkle
  • Default case: Added fallback for unknown check statuses

Layout improvements

  • CI checks list now has min height (72px / 3 items) and max height (240px / 10 items)
  • The changes tree gets priority for space; CI widget gets remaining space with guaranteed minimum
  • CI list is properly scrollable when there are many checks
  • Widget fires onDidChangeHeight event on expand/collapse and data changes to trigger parent re-layout
  • Parent layoutTree collaboratively distributes space between the changes tree and CI widget

Copilot AI review requested due to automatic review settings March 17, 2026 11:52
@vs-code-engineering vs-code-engineering bot added this to the 1.113.0 milestone Mar 17, 2026
Copy link
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

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

Pull request overview

This PR updates the Agent Sessions Changes view CI status widget to support dynamic height/layout coordination with the changes tree, and refreshes some CI status visuals (icons/colors) to better distinguish states.

Changes:

  • Add height/visibility APIs and a parent-driven layout() method to CIStatusWidget, plus a height-change event for relayout.
  • Update ChangesViewPane.layoutTree() to allocate space between the changes tree and CI widget (including min/max CI body constraints).
  • Adjust pending-state styling and update icons used for “pending/queued” and the “Fix Checks” action.

Reviewed changes

Copilot reviewed 3 out of 3 changed files in this pull request and generated 3 comments.

File Description
src/vs/sessions/contrib/changes/browser/media/ciStatusWidget.css Tweaks pending-state icon coloring for header vs check rows.
src/vs/sessions/contrib/changes/browser/ciStatusWidget.ts Adds desired height/visibility + relayout signaling and exposes a layout API; updates icons.
src/vs/sessions/contrib/changes/browser/changesView.ts Reworks layout computation to share vertical space between tree and CI widget.

You can also share your feedback on Copilot code review. Take the survey.

bpasero
bpasero previously approved these changes Mar 17, 2026
… compatibility

The spinningLoading ThemeIcon (id: loading~spin) gets rendered as a single
CSS class 'codicon-loading~spin' by ResourceLabels, which doesn't match the
'.codicon-loading::before' CSS rule needed for the icon content. Using
Codicon.loading directly produces the class 'codicon-loading', which has both
the icon glyph and the spin animation defined in codicon-modifiers.css.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
@benibenj benibenj merged commit 907d1f1 into main Mar 17, 2026
20 of 21 checks passed
@benibenj benibenj deleted the copilot/conceptual-puma branch March 17, 2026 13:18
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants