Fix TabBar accent animation initialization in useTabs hook#14072
Merged
dylanjeffers merged 2 commits intomainfrom Apr 8, 2026
Merged
Fix TabBar accent animation initialization in useTabs hook#14072dylanjeffers merged 2 commits intomainfrom
dylanjeffers merged 2 commits intomainfrom
Conversation
|
Use `from` instead of `to` in useSpring initializer to avoid triggering an animation update before TabAccent mounts. The initial positioning is already handled by resizeTabs() in useEffect after mount. https://claude.ai/code/session_017YQMNfGhGb5tU4e5v9iW9o
449ae9d to
7f0273e
Compare
The useSpring initializer change from `to` to `from` causes TypeScript to infer a narrower type for the setter that excludes `to`. This is consistent with the existing @ts-ignore on the useSpring call itself. https://claude.ai/code/session_017YQMNfGhGb5tU4e5v9iW9o
Contributor
🌐 Web preview readyPreview URL: https://audius-web-preview-pr-14072.audius.workers.dev Unique preview for this PR (deployed from this 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
Updated the TabBar accent animation initialization to use the
fromproperty instead oftowithimmediate: truein the useSpring hook configuration.Key Changes
useSpringinitial animation configuration fromto: { top: 0, left: 0, width: 0 }withimmediate: truetofrom: { top: 0, left: 0, width: 0 }Implementation Details
The
fromproperty in react-spring defines the starting point of an animation, which is more semantically correct than usingtowithimmediate: true. This change improves the animation lifecycle by properly establishing the initial state before any animated transitions occur, resulting in more predictable and correct accent bar positioning behavior.https://claude.ai/code/session_017YQMNfGhGb5tU4e5v9iW9o