From 2f511a30ab4580c1b8d24eedb67b18d0f861fdae Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Ignacy=20=C5=81=C4=85tka?= <latkaignacy@gmail.com>
Date: Wed, 9 Oct 2024 13:03:06 +0200
Subject: [PATCH] fix swipeable detecting incorrect right element width, when
 right element is not present

---
 src/components/ReanimatedSwipeable.tsx | 19 ++++++++++++++-----
 1 file changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/components/ReanimatedSwipeable.tsx b/src/components/ReanimatedSwipeable.tsx
index f0b61b770d..f03253847b 100644
--- a/src/components/ReanimatedSwipeable.tsx
+++ b/src/components/ReanimatedSwipeable.tsx
@@ -231,7 +231,7 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
     const rowWidth = useSharedValue<number>(0);
     const leftWidth = useSharedValue<number>(0);
     const rightWidth = useSharedValue<number>(0);
-    const rightOffset = useSharedValue<number>(0);
+    const rightOffset = useSharedValue<number | null>(null);
 
     const leftActionTranslate = useSharedValue<number>(0);
     const rightActionTranslate = useSharedValue<number>(0);
@@ -267,19 +267,29 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
     const overshootLeftProp = overshootLeft;
     const overshootRightProp = overshootRight;
 
+    const updateRightElementWidth = () => {
+      'worklet';
+      if (rightOffset.value === null) {
+        rightOffset.value = rowWidth.value;
+      }
+      rightWidth.value = Math.max(0, rowWidth.value - rightOffset.value);
+    };
+
     const calculateCurrentOffset = useCallback(() => {
       'worklet';
+      updateRightElementWidth();
       if (rowState.value === 1) {
         return leftWidth.value;
       } else if (rowState.value === -1) {
-        return -rowWidth.value - rightOffset.value;
+        return -rowWidth.value - rightOffset.value!;
       }
       return 0;
     }, [leftWidth, rightOffset, rowState, rowWidth]);
 
     const updateAnimatedEvent = () => {
       'worklet';
-      rightWidth.value = Math.max(0, rowWidth.value - rightOffset.value);
+
+      updateRightElementWidth();
 
       const overshootLeft = overshootLeftProp ?? leftWidth.value > 0;
       const overshootRight = overshootRightProp ?? rightWidth.value > 0;
@@ -447,7 +457,6 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       },
       openRight() {
         'worklet';
-        rightWidth.value = rowWidth.value - rightOffset.value;
         animateRow(calculateCurrentOffset(), -rightWidth.value);
       },
       reset() {
@@ -521,7 +530,7 @@ const Swipeable = forwardRef<SwipeableMethods, SwipeableProps>(
       const { velocityX } = event;
       userDrag.value = event.translationX;
 
-      rightWidth.value = rowWidth.value - rightOffset.value;
+      updateRightElementWidth();
 
       const leftThreshold = leftThresholdProp ?? leftWidth.value / 2;
       const rightThreshold = rightThresholdProp ?? rightWidth.value / 2;