From 9fa14132d593f9891e25be92fb9af99614194865 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ignacy=20=C5=81=C4=85tka?= <latkaignacy@gmail.com>
Date: Mon, 14 Oct 2024 14:24:01 +0200
Subject: [PATCH] Fix elements dissapearing due to high values set to
 `threshold` props in `ReanimatedSwipeable` (#3153)

## Description

Remove mechanism hiding elements which are already out of screen to fix
a bug where this mechanism sometimes fired when the element was still on
the screen.

Still researching why elements had to be hidden in the first place.

First commit adding the feature which is removed in this PR:
([link](https://github.com/radko93/react-native-gesture-handler/commit/fdef400f4c017f6936fa26b74467fc9bb29d73e7))

## Test plan

- open `Swipeable Reanimation` example
- open the `Reanimated` swipeable
- close it but just enough to stop seeing the `red` element
- due to `threshold` set to `80`, which is `2` times the width of the
element, the swipeable fails to close
- swipeable retracts to open
- before this fix, the `red` element wouldn't be visible
---
 src/components/ReanimatedSwipeable.tsx | 43 ++------------------------
 1 file changed, 3 insertions(+), 40 deletions(-)

diff --git a/src/components/ReanimatedSwipeable.tsx b/src/components/ReanimatedSwipeable.tsx
index f7e3a190f1..c6cc25a983 100644
--- a/src/components/ReanimatedSwipeable.tsx
+++ b/src/components/ReanimatedSwipeable.tsx
@@ -18,7 +18,6 @@ import {
 import type { PanGestureHandlerProps } from '../handlers/PanGestureHandler';
 import type { PanGestureHandlerEventPayload } from '../handlers/GestureHandlerEventPayload';
 import Animated, {
-  Extrapolation,
   SharedValue,
   interpolate,
   runOnJS,
@@ -232,9 +231,6 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
     const rightWidth = useSharedValue<number>(0);
     const rightOffset = useSharedValue<number | null>(null);
 
-    const leftActionTranslate = useSharedValue<number>(0);
-    const rightActionTranslate = useSharedValue<number>(0);
-
     const showLeftProgress = useSharedValue<number>(0);
     const showRightProgress = useSharedValue<number>(0);
 
@@ -325,12 +321,7 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
               [0, 0, 1]
             )
           : 0;
-      leftActionTranslate.value = interpolate(
-        showLeftProgress.value,
-        [0, Number.MIN_VALUE],
-        [-10000, 0],
-        Extrapolation.CLAMP
-      );
+
       showRightProgress.value =
         rightWidth.value > 0
           ? interpolate(
@@ -339,12 +330,6 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
               [1, 0, 0]
             )
           : 0;
-      rightActionTranslate.value = interpolate(
-        showRightProgress.value,
-        [0, Number.MIN_VALUE],
-        [-10000, 0],
-        Extrapolation.CLAMP
-      );
     };
 
     const dispatchImmediateEvents = useCallback(
@@ -466,19 +451,8 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       },
     };
 
-    const leftAnimatedStyle = useAnimatedStyle(
-      () => ({
-        transform: [
-          {
-            translateX: leftActionTranslate.value,
-          },
-        ],
-      }),
-      [leftActionTranslate]
-    );
-
     const leftElement = renderLeftActions && (
-      <Animated.View style={[styles.leftActions, leftAnimatedStyle]}>
+      <Animated.View style={[styles.leftActions]}>
         {renderLeftActions(
           showLeftProgress,
           appliedTranslation,
@@ -492,19 +466,8 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       </Animated.View>
     );
 
-    const rightAnimatedStyle = useAnimatedStyle(
-      () => ({
-        transform: [
-          {
-            translateX: rightActionTranslate.value,
-          },
-        ],
-      }),
-      [rightActionTranslate]
-    );
-
     const rightElement = renderRightActions && (
-      <Animated.View style={[styles.rightActions, rightAnimatedStyle]}>
+      <Animated.View style={[styles.rightActions]}>
         {renderRightActions(
           showRightProgress,
           appliedTranslation,