sessions: fix spinner animation restart and respect reduced motion#312219
Merged
hawkticehurst merged 2 commits intomainfrom Apr 23, 2026
Merged
sessions: fix spinner animation restart and respect reduced motion#312219hawkticehurst merged 2 commits intomainfrom
hawkticehurst merged 2 commits intomainfrom
Conversation
Fix the session list spinner (loading icon) animation restarting on every tree re-render. The tree calls renderElement on all visible rows whenever the list is spliced, which clears elementDisposables and recreates the icon autorun. The icon CSS selector tracking was stored in a local variable that reset to undefined each time, causing the spinner DOM to be rebuilt and the CSS animation to restart. Move the icon selector tracking onto the template object so it persists across renderSession calls for the same row. The spinner element now stays alive and its animation continues smoothly. Also add reduced motion support: when the user has reduced motion enabled (via workbench.reduceMotion or system preference), show the static session-in-progress codicon instead of the animated loading spinner. The icon reactively updates when the preference changes. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Contributor
There was a problem hiding this comment.
Pull request overview
This PR updates the Agents/Sessions sidebar session-row status icon rendering to (1) prevent the loading spinner’s CSS animation from restarting on frequent tree re-renders and (2) respect the user’s reduced-motion preference by switching from an animated spinner to a static icon.
Changes:
- Persist icon identity across
renderSessioncalls by tracking the current icon selector on the row template to avoid unnecessary DOM rebuilds (and animation restarts). - Replace the spinning
loadingicon with a staticsession-in-progressicon when reduced motion is enabled. - Wire reduced-motion changes into the row’s reactive render flow via
observableSignalFromEventandIAccessibilityService.
- Hoist observableSignalFromEvent to a renderer-level field so it's shared across all rows instead of recreated on every renderSession. - Always update iconSpan.style.color even when the selector hasn't changed, fixing stale color when the same codicon is used with different theme colors (e.g. circleFilled for both NeedsInput and unread states). Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
TylerLeonhardt
approved these changes
Apr 23, 2026
hawkticehurst
deleted the
agents/fix-spinner-re-render-and-motion-preference
branch
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes two issues with the session list spinner icon in the agents/sessions sidebar:
1. Spinner animation glitch
The loading spinner (codicon-loading with spin modifier) was restarting its CSS animation on every tree re-render. The tree calls
renderElementon all visible rows whenever the session list is spliced (e.g. when chat progress text updates), which clearselementDisposablesand recreates the icon autorun. The icon CSS selector tracking was in a local variable that reset toundefinedeach time, causing the spinner DOM element to be destroyed and recreated — restarting the animation.Fix: Move the icon selector tracking onto
ISessionItemTemplateso it persists acrossrenderSessioncalls for the same row. The spinner DOM element now stays alive and its animation continues smoothly.2. Reduced motion preference
When the user has reduced motion enabled (via
workbench.reduceMotionsetting or OS-levelprefers-reduced-motion), the animated spinner is now replaced with the staticsession-in-progresscodicon. The icon reactively updates when the preference changes viaobservableSignalFromEventononDidChangeReducedMotion.