From 28736f74d7293cf9673fcd0445a0f99abca1b6b2 Mon Sep 17 00:00:00 2001
From: Elliott Kember <elliott.kember@gmail.com>
Date: Fri, 6 Sep 2024 18:03:11 +1200
Subject: [PATCH] Apply patches from
 https://github.com/computerjazz/react-native-draggable-flatlist/issues/539

---
 src/components/DraggableFlatList.tsx  |  2 +-
 src/context/refContext.tsx            |  8 ++++----
 src/hooks/useCellTranslate.tsx        |  2 +-
 src/hooks/useOnCellActiveAnimation.ts | 11 ++++++-----
 4 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/src/components/DraggableFlatList.tsx b/src/components/DraggableFlatList.tsx
index d7d98c27..2f59c7a2 100644
--- a/src/components/DraggableFlatList.tsx
+++ b/src/components/DraggableFlatList.tsx
@@ -295,7 +295,7 @@ function DraggableFlatListInner<T>(props: DraggableFlatListProps<T>) {
       const springTo = placeholderOffset.value - activeCellOffset.value;
       touchTranslate.value = withSpring(
         springTo,
-        animationConfigRef.current,
+        animationConfigRef.value,
         () => {
           runOnJS(onDragEnd)({
             from: activeIndexAnim.value,
diff --git a/src/context/refContext.tsx b/src/context/refContext.tsx
index ea21575c..66c5eed6 100644
--- a/src/context/refContext.tsx
+++ b/src/context/refContext.tsx
@@ -1,14 +1,14 @@
 import React, { useContext } from "react";
 import { useMemo, useRef } from "react";
 import { FlatList } from "react-native-gesture-handler";
-import Animated, { WithSpringConfig } from "react-native-reanimated";
+import Animated, { type SharedValue, useSharedValue, WithSpringConfig } from "react-native-reanimated";
 import { DEFAULT_PROPS } from "../constants";
 import { useProps } from "./propsContext";
 import { CellData, DraggableFlatListProps } from "../types";
 
 type RefContextValue<T> = {
   propsRef: React.MutableRefObject<DraggableFlatListProps<T>>;
-  animationConfigRef: React.MutableRefObject<WithSpringConfig>;
+  animationConfigRef: SharedValue<WithSpringConfig>;
   cellDataRef: React.MutableRefObject<Map<string, CellData>>;
   keyToIndexRef: React.MutableRefObject<Map<string, number>>;
   containerRef: React.RefObject<Animated.View>;
@@ -54,8 +54,8 @@ function useSetupRefs<T>({
     ...DEFAULT_PROPS.animationConfig,
     ...animationConfig,
   } as WithSpringConfig;
-  const animationConfigRef = useRef(animConfig);
-  animationConfigRef.current = animConfig;
+  const animationConfigRef = useSharedValue(animConfig);
+  animationConfigRef.value = animConfig;
 
   const cellDataRef = useRef(new Map<string, CellData>());
   const keyToIndexRef = useRef(new Map<string, number>());
diff --git a/src/hooks/useCellTranslate.tsx b/src/hooks/useCellTranslate.tsx
index ce4ab68a..efea2403 100644
--- a/src/hooks/useCellTranslate.tsx
+++ b/src/hooks/useCellTranslate.tsx
@@ -101,7 +101,7 @@ export function useCellTranslate({ cellIndex, cellSize, cellOffset }: Params) {
       ? activeCellSize.value * (isAfterActive ? -1 : 1)
       : 0;
 
-    return withSpring(translationAmt, animationConfigRef.current);
+    return withSpring(translationAmt, animationConfigRef.value);
   }, [activeKey, cellIndex]);
 
   return translate;
diff --git a/src/hooks/useOnCellActiveAnimation.ts b/src/hooks/useOnCellActiveAnimation.ts
index 7c205876..857c7d04 100644
--- a/src/hooks/useOnCellActiveAnimation.ts
+++ b/src/hooks/useOnCellActiveAnimation.ts
@@ -1,8 +1,9 @@
-import { useRef } from "react";
-import Animated, {
+
+import {
   useDerivedValue,
   withSpring,
   WithSpringConfig,
+  useSharedValue,
 } from "react-native-reanimated";
 import { DEFAULT_ANIMATION_CONFIG } from "../constants";
 import { useAnimatedValues } from "../context/animatedValueContext";
@@ -15,8 +16,8 @@ type Params = {
 export function useOnCellActiveAnimation(
   { animationConfig }: Params = { animationConfig: {} }
 ) {
-  const animationConfigRef = useRef(animationConfig);
-  animationConfigRef.current = animationConfig;
+  const animationConfigRef = useSharedValue(animationConfig);
+  animationConfigRef.value = animationConfig;
 
   const isActive = useIsActive();
 
@@ -26,7 +27,7 @@ export function useOnCellActiveAnimation(
     const toVal = isActive && isTouchActiveNative.value ? 1 : 0;
     return withSpring(toVal, {
       ...DEFAULT_ANIMATION_CONFIG,
-      ...animationConfigRef.current,
+      ...animationConfigRef.value,
     });
   }, [isActive]);