Regressions: v5 RC breaks all touchables by react-native-gesture-handler in FlatList

[hirbod]

@andreialecu I can tell you that I've upgraded and the first thing I realized is that that new release is breaking the swipe behavior in my view. I can only swipe tabs now when I place my finger on the tabs directly or when I swipe in the header area or on a view that does not use touchables by RNGH.

It does not play nicely with RectButton, BaseButton etc by react-native-gesture-handler anymore. It does work with RN-Touchables (which should not be used in FlatLists anyway, because they don't work nicely with FlatList, activating with scroll which they should not)

It does work with TouchableOpacity, TouchableWithoutFeedback etc (from react-native) though
v4 did not had any issues with RectButton

P:S: Can't select "issue" as "issue", only Feature Requests and Questions.

[hirbod]

It does also break the workaround used here: #248

[hirbod]

Other regressions:

• useTabsContext must be inside a Tabs.Container.
• useTabNameContext muss be inside a TabNameContext

I am not even using this. Its coming from the FlatList Implementation.

[andreialecu]

It does also break the workaround used here: #248

Fixed this in v5.0.0-rc.5

[andreialecu]

The RNGH issue is odd. Must be something about react-native-view-pager and react-native-gesture-handler not playing nicely with each other. Wasn't able to find anything related to that in their issue trackers. 🤔

[andreialecu]

Other regressions:

• useTabsContext must be inside a Tabs.Container.
• useTabNameContext muss be inside a TabNameContext

I am not even using this. Its coming from the FlatList Implementation.

Need a repro for this or more details. Nothing related to that should've changed. 🤔

[hirbod]

For now (with a broken heart), I swapped RectButton with TouchableWithoutFeedback.
I really did nothing but upgrading and got those weird TabNameContext issues. Could not reproduce that after upgrade to RC.4 for now - weird (maybe metro bundle cache or some node_modules weirdness again when working with monorepos)

Ok, whats left is RNGH :/

[andreialecu]

If you'd like to help out to figure out if there are any workarounds, or the reason for the RNGH issue it would be greatly appreciated.

[hirbod]

Are you importing Flatlist from RN or from RNGH? Usually it's enough to use Flatlist by RNGH to get rid of touchable issues (it's also preferred when working with gestures).

[andreialecu]

I briefly tested the RNGH flatlist and it didn't make any difference.

[hirbod]

Hm... dang. I'm also seeing my items disappear sometimes now, like when you use removeClippedSubviews. It happens very randomly, have to investigate further

[hirbod]

I made a repro case and its indeed an issue with pager-view vs rngh
https://snack.expo.dev/@hirbod/pager-view---rngh-touchables-issue

The green area is swipeable and the yellow one not. Only the third yellow box works because its using TouchableHighlight from RN

[hirbod]

Not happening on android btw, its iOS only

[andreialecu]

The issue might be caused by RNGH and not pager view. Try opening an issue on that side too.

[hirbod]

I filed an issue at both repos
software-mansion/react-native-gesture-handler#2043
callstack/react-native-pager-view#554

[hirbod]

Just figured that containerStyle is also not working with the new RC. Had to make small adjustments

[hirbod]

My PR has been merged, it was an issue with pager-view. A new version has been released. Touchables should work with 5.4.17

[anabeatrizzz]

Other regressions:

• useTabsContext must be inside a Tabs.Container.
• useTabNameContext muss be inside a TabNameContext

I am not even using this. Its coming from the FlatList Implementation.

I was facing the same issue. The error disappeared after I changed Tabs.ScrollView for Animated.ScrollView.