updating yarn, patching react-native-draggable-flatlist per computerj…

…azz/react-native-draggable-flatlist#539
kamatsuoka · Aug 3, 2024 · 08f55e7 · 08f55e7
1 parent 15db8eb
commit 08f55e7
Show file tree

Hide file tree

Showing 7 changed files with 1,091 additions and 1,121 deletions.
diff --git a/.yarn/patches/react-native-draggable-flatlist-npm-4.0.1-4a95e98e27.patch b/.yarn/patches/react-native-draggable-flatlist-npm-4.0.1-4a95e98e27.patch
@@ -0,0 +1,122 @@
+diff --git a/react-native-draggable-flatlist+4.0.1.patch.txt b/react-native-draggable-flatlist+4.0.1.patch.txt
+new file mode 100644
+index 0000000000000000000000000000000000000000..a4c89a29a71285e8d058aef96d9604afca29c905
+--- /dev/null
++++ b/react-native-draggable-flatlist+4.0.1.patch.txt
+@@ -0,0 +1,58 @@
++diff --git a/src/components/DraggableFlatList.tsx b/node_modules/react-native-draggable-flatlist/src/components/DraggableFlatList.tsx
++index d7d98c2..2f59c7a 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/node_modules/react-native-draggable-flatlist/src/context/refContext.tsx
++index ea21575..66c5eed 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/node_modules/react-native-draggable-flatlist/src/hooks/useCellTranslate.tsx
++index ce4ab68..efea240 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/components/DraggableFlatList.tsx b/src/components/DraggableFlatList.tsx
+index d7d98c2796afb69bb46aa21f0ece8c5ec9f2a339..2f59c7a2e544a183b4f501dadbf79df76cc4ccf3 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 ea21575c9d91d45634dc3371536ab80470413401..66c5eed6775613c2f4b92c4c742e68a1f67e4291 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 ce4ab68ab7ebe6abdfdfb24141b0d7fb1ae1e75a..efea24038ffa1b340b601cea16588ed1a5823e5a 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/.yarn/releases/yarn-4.1.1.cjs b/.yarn/releases/yarn-4.1.1.cjs
diff --git a/.yarn/releases/yarn-4.4.0.cjs b/.yarn/releases/yarn-4.4.0.cjs
diff --git a/.yarnrc.yml b/.yarnrc.yml
@@ -2,4 +2,4 @@ compressionLevel: mixed
 
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.1.1.cjs
+yarnPath: .yarn/releases/yarn-4.4.0.cjs
diff --git a/package.json b/package.json
@@ -42,7 +42,7 @@
     "react-native": "0.72.6",
     "react-native-blob-util": "^0.17.0",
     "react-native-device-info": "^10.12.0",
-    "react-native-draggable-flatlist": "^4.0.1",
+    "react-native-draggable-flatlist": "patch:react-native-draggable-flatlist@npm%3A4.0.1#~/.yarn/patches/react-native-draggable-flatlist-npm-4.0.1-4a95e98e27.patch",
     "react-native-error-boundary": "^1.1.16",
     "react-native-gesture-handler": "~2.12.0",
     "react-native-paper": "^5.11.3",
@@ -138,7 +138,7 @@
       "<rootDir>/e2e"
     ]
   },
-  "packageManager": "yarn@4.1.1",
+  "packageManager": "yarn@4.4.0",
   "lint-staged": {
     "*.{js,jsx,ts,tsx}": "eslint --cache --fix",
     "*.{css,md}": "prettier --write"

diff --git a/src/screens/LabelsScreen.tsx b/src/screens/LabelsScreen.tsx
@@ -6,7 +6,7 @@ import {HomeParamList} from "@app/navigation/navigationParams"
 import {useNavigation} from "@react-navigation/native"
 import {NativeStackNavigationProp} from "@react-navigation/native-stack"
 import {ScrollView, StyleSheet, TouchableOpacity, View} from "react-native"
-import {Button, Divider, List, useTheme} from "react-native-paper"
+import {Divider, List, useTheme} from "react-native-paper"
 import {useSafeAreaInsets} from "react-native-safe-area-context"
 
 /**
@@ -33,6 +33,7 @@ export default function LabelsScreen() {
       backgroundColor: theme.colors.surface,
       paddingHorizontal: 5,
       borderRadius: 10,
+      marginVertical: 5,
     },
     listItem: {
       height: 50,
@@ -53,9 +54,8 @@ export default function LabelsScreen() {
         <ScrollView>
           <View style={styles.listHolder}>
             {labels.map((label, index) => (
-              <View style={styles.listHolder} key={`label_${index}`}>
+              <View key={`label_${index}`}>
                 <TouchableOpacity
-                  style={styles.listHolder}
                   onPress={() => {
                     dispatch(FavoritesActions.selectLabel(label))
                     navigation.navigate("Labeled", {label})
@@ -71,12 +71,16 @@ export default function LabelsScreen() {
               </View>
             ))}
           </View>
-          <View style={styles.buttonHolder}>
-            <Button
-              icon="label-multiple-outline"
+          <View style={styles.listHolder}>
+            <TouchableOpacity
               onPress={() => navigation.navigate("LabelEditor")}>
-              edit labels
-            </Button>
+              <List.Item
+                title="edit labels"
+                left={EditLabelsIcon}
+                right={RightIcon}
+                style={styles.listItem}
+              />
+            </TouchableOpacity>
           </View>
         </ScrollView>
       </List.Section>
@@ -86,3 +90,4 @@ export default function LabelsScreen() {
 
 const RightIcon = homeIcon("chevron-right")
 const LabelIcon = homeIcon("label")
+const EditLabelsIcon = homeIcon("label-multiple-outline")
Original file line number	Diff line number	Diff line change
Expand Up		@@ -2,4 +2,4 @@ compressionLevel: mixed

		nodeLinker: node-modules

		yarnPath: .yarn/releases/yarn-4.1.1.cjs
		yarnPath: .yarn/releases/yarn-4.4.0.cjs