feat/fix: better slow pan: if user intent is to stay on current page, _don't_ change page

[nmassey]

Overview

This improves swipe behavior for my full-screen carousel use case. If a user pans very slowly and ultimately not very far, we would prefer that they stay on the current page. This still allows them to "flick" to pan to the next (or previous) screen.

This should fix the following issue:

• https://github.com/dohooo/react-native-reanimated-carousel/issues/515

Details

1. refactor code slighty: calculate nextPageoutside of the if branch
2. when calculating nextPage, use velocity * 2 instead of velocity * 0.4: I liked this factor better for my usage. This value seems to work well on all of my iOS and Android test devices
3. fix: if the calculated nextPage is actually the current page, don't go anywhere (previous behavior was to always go to next or previous page)
4. improve: if user has mostly panned one direction, but then reverses that pan at the end of their gesture, return to current page

Screen recording

👎 before patch (4.0.0-alpha.10)

Notice: panning only a little bit always brings user to the next page. This happens even if it seems that the user's intent is to stay on the current page.

https://github.com/dohooo/react-native-reanimated-carousel/assets/589004/040e6e5b-d102-49ee-9d0e-06ba9e599b79

👎 before patch: this version shows with some other important patches on top of 4.0.0-alpha.10: this includes #577 (worklets), #574 (useSharedValue), and #576 (panOffset)

https://github.com/dohooo/react-native-reanimated-carousel/assets/589004/67c8391e-d02b-4082-99e6-1ed0017a933c

✅ with this patch (also includes #577 (worklets), #574 (useSharedValue), and #576 (panOffset))

This shows good behavior with my expected user intent.

https://github.com/dohooo/react-native-reanimated-carousel/assets/589004/2187c95a-c3b8-4409-87f8-e77fe30926d5

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: 65e3d0febc6f6d3a6c0afd78f85c2dc795f0a57d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
react-native-reanimated-carousel	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
react-native-reanimated-carousel	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	May 6, 2024 4:27pm

[dohooo]

Incredible work, thank you! But before merging, could you gen a changeset for this PR?

npx changeset

[BrodaNoel]

I have the feeling that this PR is the one who is going to fix https://github.com/dohooo/react-native-reanimated-carousel/issues/590#issuecomment-2080230589

I'm using alpha.12 and seems like the only remaining bug that I have after migrating from Expo SDK 49 to 50 (thus, alpha0 to 10), is this.

Crossed fingers.