Skip to content

fix(ui): stabilize update animations#37

Open
optiplex331 wants to merge 1 commit intoRealZST:mainfrom
optiplex331:fix/update-button-animation
Open

fix(ui): stabilize update animations#37
optiplex331 wants to merge 1 commit intoRealZST:mainfrom
optiplex331:fix/update-button-animation

Conversation

@optiplex331
Copy link
Copy Markdown

@optiplex331 optiplex331 commented May 3, 2026

Summary

  • keep update and audit loading icons as the existing RefreshCw arrow animation
  • center the SVG rotation to avoid visual overlap or offset while spinning
  • keep quick loading states visible briefly so fast checks still show feedback

Root cause

Fast update/audit requests could flip loading state back before the browser painted the spinner, and RefreshCw icons were relying on the default transform origin. Settings also used a different Loader2 icon for update checks, making the animation inconsistent.

Validation

  • npx biome check src/pages/settings.tsx src/pages/audit.tsx src/pages/extensions.tsx src/pages/overview.tsx src/stores/audit-store.ts src/stores/extension-store.ts src/stores/update-store.ts src/stores/web-update-store.ts
  • npm run build
  • git diff --cached --check
  • verified Audit and Settings loading states in the in-app browser

Screenshot

  • Before:
update-animation-before
  • After:
CleanShot 2026-05-03 at 14 26 15 CleanShot 2026-05-03 at 14 25 35 CleanShot 2026-05-03 at 14 24 25

@optiplex331 optiplex331 marked this pull request as ready for review May 3, 2026 12:29
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant