fix: prevent item jump on long-press and after reorder#115
Open
lumenwire wants to merge 4 commits intofivecar:mainfrom
Open
fix: prevent item jump on long-press and after reorder#115lumenwire wants to merge 4 commits intofivecar:mainfrom
lumenwire wants to merge 4 commits intofivecar:mainfrom
Conversation
When onReordered causes the parent to update the data prop with the same items in a new order, detect the pure-reorder case (same key set, same count) and skip bumping dataGenRef. This preserves cell keys so FlatList does not remount them mid-animation, eliminating the visual jump after a drag completes. Because FlatList now reuses row components across reorders, also resolve the active item's index by key lookup in onDragStart to avoid acting on a stale info.index from the prior render.
When the user drags an item but drops it back at its starting position (no reorder), the active cell was still at translateY(pan) at the moment reset() switched it to translateY(anim). Zeroing pan before calling reset() ensures both values are 0 at the transition point, eliminating the visible snap.
Introduce isPanGranted through DragListContext so CellRendererComponent can distinguish a long-press touch (pan responder not yet granted) from a real drag. Guard the slide animation useEffect to return early when pan is not granted, preventing all cells from resetting their translateY to 0 on press-only interactions and causing a visible jump.
Two related jump bugs are fixed: 1. Long-press without drag movement caused other items to slide unexpectedly. The guard introduced in the previous commit used panGrantedRef (a ref) to pass isPanGranted through context. Refs don't trigger re-renders, so CellRendererComponent never reacted to the grant status change and the slide animation useEffect guard never fired. Fix: track isPanGranted as React state so context consumers re-render and the guard works correctly. 2. After a successful reorder, reset() was never called in the finally block, leaving activeDataRef non-null and pan in a stale state. A quick subsequent press could then inherit leftover translation and jump. Fix: call pan.setValue(0) and reset() synchronously in the finally block, and also in onDragStart to clear any leftover pan before a new drag begins.
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
1 participant
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
reset()switched the cell back to theanimvalue, causing a visible snap. Fix: callpan.setValue(0)beforereset().reset()was not called in thefinallyblock, leavingactiveDataRefnon-null and pan in a stale state. A quick subsequent press could inherit the leftover translation. Fix: callpan.setValue(0)andreset()synchronously in thefinallyblock and also inonDragStart.isPanGrantedguard inCellRendererComponent's slide animationuseEffectwas ineffective because it was backed by auseRefpassed through context — refs don't trigger re-renders, so the guard never fired. Fix: trackisPanGrantedas React state so context consumers re-render correctly.dataGenwas being bumped even when a reorder produced identical data, causing unnecessary animation resets. Fix: skip the bump when the new data is a reorder of the same items.Test plan