Page rendering is incorrect when changing the scrolling direction.

[blackazaru]

Describe the bug Page rendering is incorrect when changing the scrolling direction

To Reproduce Steps to reproduce the behavior:

1. Init example with ~10 elements
2. Begin scrolling to the right, and when you reach the fourth or fifth element, attempt to scroll to the left.

Expected behavior You should see the previous element, but the carousel renders the same one.

Screenshots

https://github.com/dohooo/react-native-reanimated-carousel/assets/6501334/6394f9f0-3c23-44db-ba73-eeb3c548eed9

Versions (please complete the following information):

• react: v18.2.0
• react-native: v0.73.1
• react-native-reanimated: v3.6.1
• react-native-reanimated-carousel: v4.0.0-alpha.10
• react-native-gesture-handler: 2.10.0

Smartphone (please complete the following information):

• Device: iPhone11
• OS: IOS 17.4
• Browser
• Version

Additional context

My review indicates that Reanimated's useSharedValue doesn't update the value immediately (scrollEndTranslation). https://github.com/dohooo/react-native-reanimated-carousel/blob/d78784808f1a4d233708561354ca198122cfbb62/src/components/ScrollViewGesture.tsx#L342-L355

Consequently, we encounter an incorrect (previous) value in the endWithSpring function, which triggers the incorrect direction. https://github.com/dohooo/react-native-reanimated-carousel/blob/d78784808f1a4d233708561354ca198122cfbb62/src/components/ScrollViewGesture.tsx#L138-L142

[benforsrup]

Probably the same issue as described in #535

[robioconic]

Also experiencing this issue!

[ckanissatran]

Creating a patch with the changes @nmassey created here: https://github.com/dohooo/react-native-reanimated-carousel/pull/574 fixed this bug for me on ^4.0.0-alpha.10

[wscullen]

I'm experiencing this in alpha.6 and above, for me it look like alpha.5 doesn't exhibit this.

[dohooo]

Solved in https://github.com/dohooo/react-native-reanimated-carousel/releases/tag/v4.0.0-alpha.12