feat: improve animation for check for new data #598#624
feat: improve animation for check for new data #598#624andrewtavis merged 3 commits intoscribe-org:mainfrom
Conversation
- Replace RadioCircle with CheckDataSpinner component - Add three states: idle (gray circle), checking (rotating arc + X cancel), checked (filled orange + checkmark) - Animate spinner using Timer at ~60fps for smooth rotation - Tap X during check to cancel back to idle - Auto-transitions to checked state after check completes
Thank you for the pull request! 💙The Scribe-iOS team will do our best to address your contribution as soon as we can. If you're not already a member of our public Matrix community, please consider joining! We'd suggest that you use the Element client as well as Element X for a mobile app, and definitely join the Note Scribe uses Conventional Comments in reviews to make sure that communication is as clear as possible. |
Maintainer ChecklistThe following is a checklist for maintainers to make sure this process goes as well as possible. Feel free to address the points below yourself in further commits if you realize that actions are needed :) |
|
Would you be able to fix the conflicts on the PR, @prince-0408? We just merged in some updates to the download functionality :) |
|
Thanks so much for the PR, btw! Videos are looking great. Looking forward to the review 😊 |
|
Hello, @andrewtavis Conflicts have been settled; the CheckDataSpinner implementation has been retained, and the most recent upstream download functionality updates have been integrated. I appreciate the heads-up! 😊 |
andrewtavis
left a comment
andrewtavis
left a comment
There was a problem hiding this comment.
praise: Is working great, @prince-0408! Thanks so much for your efforts here and updating the PR with main 😊
| if isSelected { | ||
| switch state { | ||
| case .idle: | ||
| // Empty gray circle |
There was a problem hiding this comment.
nitpick: In the future it'd be great if comments that are their own line end in periods, as we like to have them as complete sentences :)
…-org#624) - Replace RadioCircle with CheckDataSpinner component - Add three states: idle (gray circle), checking (rotating arc + X cancel), checked (filled orange + checkmark) - Animate spinner using Timer at ~60fps for smooth rotation - Tap X during check to cancel back to idle - Auto-transitions to checked state after check completes Co-authored-by: Andrew Tavis McAllister <andrew.t.mcallister@gmail.com>
2 participants
Description
Closes #598
Replaces the static
RadioCircletoggle on the "Check for new data" row in the Update Data card with a new animatedCheckDataSpinnercomponent, matching the Figma design spec.Changes
New component:
CheckDataSpinnerReplaces
RadioCircleinUpdateDataCardViewwith a three-state animated spinner:Removed:
RadioCircleThe old static radio button toggle has been removed and fully replaced.
Screenshots
Notes
startChecking()is a placeholder simulating a network check. This should be replaced with the actual API call once the backend check endpoint is available.Timerat 16ms intervals (~60fps) for smooth rotation instead of SwiftUI'sRotationEffectanimation loop, giving more control over cancellation.Screen.Recording.2026-03-24.at.4.28.32.PM.mov
Screen.Recording.2026-03-24.at.3.15.02.PM.mov