fix(web): clarify desktop update status

[StiensWout]

Summary

The compact desktop updater action did not clearly distinguish an available update from an active download, and fast update checks could stop the refresh icon before it completed one turn.

This adds a determinate progress ring while downloading, a completion badge when the update is ready to install, and a presentation latch that finishes the current check rotation before handing off to the next state. Reduced-motion preferences skip the extra rotation.

UI

The status text and nightly release notes in this capture are the existing hover tooltip. They are not permanently visible.

Verification

• 29 focused desktop updater logic tests passed
• Web typecheck passed
• Targeted lint and formatting passed
• Verified the real sidebar component in dark mode with checking, available, downloading, and downloaded states

Checklist

• This PR is small and focused
• I explained what changed and why
• I included a GIF for the UI state transitions

Created with gpt-5.6-sol using the Codex harness in T3 Code.

---

Note

Low Risk
Electron sidebar UI and presentation only; update bridge actions and logic are unchanged.

Overview
The desktop sidebar update control now uses a dedicated DesktopUpdateStatusIcon instead of a single download/refresh/install icon, so checking, available, downloading, and ready to install are visually distinct.

While an update downloads, the button shows a determinate progress ring driven by downloadPercent. When an install is ready, it shows a restart icon with a check badge. Available updates use a download icon with a notification dot.

Update checks keep the spinning refresh icon until the current rotation finishes (latched via onAnimationIteration), so fast checks no longer cut the animation mid-spin. prefers-reduced-motion skips the latch and spin. While the check icon is shown, the button stays disabled and the tooltip reads “Checking for updates…”; update-styled pill chrome applies only when showing update states, not during the check animation.

^{Reviewed by Cursor Bugbot for commit c85f955. Bugbot is set up for automated code reviews on this repo. Configure here.}

Note

Add distinct download progress, available, and downloaded visuals to the desktop update status button

• Introduces DesktopUpdateStatusIcon with separate icon variants for each update state: available (badge), downloading (animated circular progress ring), downloaded (check badge), and checking (spinner).
• The checking spinner latches after triggering a check and unlatches via animation iteration events, so the icon completes its current spin before disappearing.
• Reduced motion preference (prefers-reduced-motion) is respected throughout: the spinner is suppressed and the latch is skipped when enabled.
• normalizeDesktopUpdateDownloadPercent clamps null or non-finite download percent values to [0, 100], preventing the progress ring from breaking on invalid input.
• SidebarUpdatePill.tsx is updated to use the new icon component and drives tooltip styling and button disabled state from the derived presentation helpers.

^{Macroscope summarized c85f955.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: aafab15e-78c7-4fcb-8782-49590f628eb6

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[macroscopeapp]

Approvability

Verdict: Approved c85f955

UI-only change that extracts update status icons into a dedicated component and adds visual enhancements (download progress indicator, improved animations). Purely presentational with accessibility improvements for reduced-motion preference.

^{You can customize Macroscope's approvability policy. Learn more.}

Dismissing prior approval to re-evaluate f13240b

Dismissing prior approval to re-evaluate c85f955