Repository navigation
Soften the home boot stagger - #998
Conversation
The first-load wave popped: each block scaled and jumped 18px, then the action buttons scaled again inside that. Drop the scale, shorten the travel, and overlap the children so it reads as one lift instead of four distinct pops.
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. 🗂️ Base branches to auto review (1)
Please check the settings in the CodeRabbit UI or the ⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Advanced Run ID: You can disable this status message by setting the Use the checkbox below for a quick retry:
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. Comment |
Deploying wallet-mutinynet with
|
| Latest commit: |
f0e9262
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://70ddd58f.arkade-wallet.pages.dev |
| Branch Preview URL: | https://cursor-smooth-home-stagger-2.arkade-wallet.pages.dev |
Deploying wallet-bitcoin with
|
| Latest commit: |
f0e9262
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://3dff13f3.wallet-bitcoin.pages.dev |
| Branch Preview URL: | https://cursor-smooth-home-stagger-2.wallet-bitcoin.pages.dev |
The action-button CSS runs under the boot overlay, so retiming it does not change what you see. The visible wave is the home sections: drop the scale, shorten the travel, and overlap them a bit more.
arkana-ai-bot
left a comment
arkana-ai-bot
left a comment
There was a problem hiding this comment.
Arkana review — animations.ts, boot stagger soften
No protocol, security, or cross-repo concerns. This touches only UI animation timing.
What the change does
| Property | Before | After |
|---|---|---|
delayChildren |
0.04 s | 0.02 s |
staggerChildren |
0.09 s | 0.07 s |
| Initial Y offset | 18 px | 12 px |
| Initial scale | scale(0.985) |
removed |
| Child duration | 0.34 s | 0.48 s |
The result: tighter wave, no scale pop, slower individual fade-up — reads as one lift rather than a cascade of pops. Matches the stated intent.
Checks
Reduced-motion / accessibility — both call-sites gate correctly on prefersReduced / useReducedMotion():
src/components/WalletLoadIn.tsxlines 17–25: short-circuits to a plain<div>— ✓src/screens/Wallet/BitcoinDetail.tsxline 271 ff: passesundefinedwhenprefersReduced— ✓
No regression here.
Cross-repo impact — animations.ts is consumed only within wallet; no exported types, protos, or interfaces change. Other SDK repos (ts, go, rust, dotnet) are unaffected.
Stacking on #995 — PR body notes this depends on #995 (boot-only gate). The variants themselves are stateless; the gate lives at call-site, so merge order matters for correct behavior. Ensure #995 is merged first (or this is landed as a stack).
Minor observation (non-blocking)
src/lib/animations.ts:86–92 — the walletLoadInChild variants use a raw transform string (translate3d(0, 12px, 0)) rather than Framer Motion's native y prop. The rest of the file is consistent with this pattern so it's not a regression, but native props (y: 12 / omitting scale) would give FM's layout engine more information and are easier to diff in future. Worth a follow-up cleanup, not a blocker here.
Danger flag — "source changed with no test changes" is noted. Animation constants aren't meaningfully unit-testable; no action needed.
Verdict: no changes requested. Safe to merge once #995 is in.
The first-load home stagger felt snappy: each block scaled and jumped 18px.
This only retimes that boot wave — 12px, no scale, a bit more overlap — so it lifts as one piece. Stacked on #995 so the stagger still plays only on real boot, not on swap-back.
Does not change swap → home transitions.