How to disable left swipe gesture in react-native-gesture-handler/Swipeable?

Question

Description:

We are creating a component similar like Instagram where we have a Posts screen and Messaging screen. When perform swipe from right to left, screen navigates from Posts screen to Messaging screen. For swiping, we are using @react-navigation/material-top-tabs

In Messaging screen, Flatlist component is used to show conversations list where react-native-gesture-handler/Swipeable is used to show controls which are delete and mute button when user performs "right to left" swipe similar like Instagram which is working 100% fine but when trying to navigating back to post screen using left to right swipe on Flatlist then react-native-gesture-handler/Swipeable gesture executes and their "onSwipeableOpen" callback calls which should not execute so that smoothly translation should be perform from Messaging to Post Screen.

As well as there is no way to disable left to right swipe on FlatList. Is there any solution/ workaround or any suggestion to achieve this task?

Thank you in advance

Answer 1

You can disable left swipe by using dragOffsetFromLeftEdge

 <Swipeable
    ...
    dragOffsetFromLeftEdge={Number.MAX_VALUE} 
  >