Fix computerjazz#539: Tried to modify key current of an object.

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,

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>());

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;

src/hooks/useOnCellActiveAnimation.ts

@@ -1,6 +1,6 @@
-import { useRef } from "react";
 import Animated, {
   useDerivedValue,
+  useSharedValue,
   withSpring,
   WithSpringConfig,
 } from "react-native-reanimated";
@@ -15,8 +15,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 +26,7 @@ export function useOnCellActiveAnimation(
     const toVal = isActive && isTouchActiveNative.value ? 1 : 0;
     return withSpring(toVal, {
       ...DEFAULT_ANIMATION_CONFIG,
-      ...animationConfigRef.current,
+      ...animationConfigRef.value,
     });
   }, [isActive]);