Skip to content

Handle data change and reset sortable grid list order #2020

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 10 commits into from
May 9, 2022

Conversation

ethanshar
Copy link
Collaborator

@ethanshar ethanshar commented Apr 28, 2022

Description

Support dynamic data in SortableGridList
I'm aware this is a breaking change, but due to the fact it's a new component and that without this feature it doesn't work well, let's push it and not wait for next major version

The main change here, is that we now identify each item by an id prop the user pass (instead of the index)
This way we can handle data change (remove/add) of items without breaking the logic of the sorting

Changelog

Breaking: Support dynamic data in SortableGridList
This requires to pass id prop for each item

@ethanshar ethanshar requested a review from lidord-wix May 1, 2022 14:46
@ethanshar ethanshar added the Important for Next Release PR that must be included in the release version label May 3, 2022
Copy link
Contributor

@lidord-wix lidord-wix left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Before reviewing the code, I see weird behavior in the example screen, a video attached.

Simulator.Screen.Recording.-.iPhone.13.-.2022-05-04.at.10.19.29.mp4

@ethanshar
Copy link
Collaborator Author

Before reviewing the code, I see weird behavior in the example screen, a video attached.

You're right!
I think that recent update of reanimated version to 2.8.0 makes this bug more frequent.
Anyway, I also managed to reproduce it on the old reanimated version we were on, so I decided to just fix the issue.

It's all related to this issue I opened to reanimated library -> software-mansion/react-native-reanimated#3224

Anyway, it should be fixed now in my last commit, I hope I didn't miss anything.

@ethanshar ethanshar requested a review from lidord-wix May 8, 2022 05:19
Copy link
Contributor

@lidord-wix lidord-wix left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks really good overall, I approved the PR with a small comment about adding notes in the code. it's up to you if you want to add some or merge it as it is.. :)

Comment on lines 59 to 73
if (newOrder === initialIndex.value) {
if (dataManuallyChanged.value) {
translateX.value = 0;
translateY.value = 0;
} else {
translateX.value = withTiming(0, animationConfig);
translateY.value = withTiming(0, animationConfig);
}
dataManuallyChanged.value = false;
} else if (newOrder !== prevOrder) {
const translation = getTranslationByOrderChange(newOrder, prevOrder);
translateX.value = withTiming(translateX.value + translation.x, animationConfig);
translateY.value = withTiming(translateY.value + translation.y, animationConfig);
}
}
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I know we don't use to do it, but I found the conditions here a bit confusing.. consider adding a comment for every condition that explains the cases that are relevant to this condition..

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Done

@ethanshar ethanshar enabled auto-merge (squash) May 9, 2022 13:19
@ethanshar ethanshar merged commit ae3692a into master May 9, 2022
@ethanshar ethanshar deleted the fix/SortableGridList_dynamicData branch April 2, 2024 06:38
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Important for Next Release PR that must be included in the release version
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants