about summary refs log tree commit diff
path: root/src/components/ProgressGuide/Toast.tsx
diff options
context:
space:
mode:
authordan <dan.abramov@gmail.com>2024-11-17 15:06:28 +0000
committerGitHub <noreply@github.com>2024-11-17 15:06:28 +0000
commit474c4eff29b6a2454a20febf78a1edd5cf58663a (patch)
tree43a189a8101cf3f5265d967ad46182cf8cbde9a0 /src/components/ProgressGuide/Toast.tsx
parentd575a2fdaaa4d9c93d6b739dfe3377cdd5985dc1 (diff)
downloadvoidsky-474c4eff29b6a2454a20febf78a1edd5cf58663a.tar.zst
Use compiler-safe Reanimated get/set APIs (#6391)
* Convert lightbox to get/set

* Work around software-mansion/react-native-reanimated#6613

* Use get/set in more places

* Port MainScrollProvider to get/set

* Port more to get/set

* Port composer to get/set

* Remove unnecessary thread hops in composer

* Port more things to get/set

* Convert more to get/set, remove redundant runOnJS

* Convert remaining cases to get/set
Diffstat (limited to 'src/components/ProgressGuide/Toast.tsx')
-rw-r--r--src/components/ProgressGuide/Toast.tsx48
1 files changed, 27 insertions, 21 deletions
diff --git a/src/components/ProgressGuide/Toast.tsx b/src/components/ProgressGuide/Toast.tsx
index 69e008260..b26c718f8 100644
--- a/src/components/ProgressGuide/Toast.tsx
+++ b/src/components/ProgressGuide/Toast.tsx
@@ -55,13 +55,15 @@ export const ProgressGuideToast = React.forwardRef<
 
     // animate the opacity then set isOpen to false when done
     const setIsntOpen = () => setIsOpen(false)
-    opacity.value = withTiming(
-      0,
-      {
-        duration: 400,
-        easing: Easing.out(Easing.cubic),
-      },
-      () => runOnJS(setIsntOpen)(),
+    opacity.set(() =>
+      withTiming(
+        0,
+        {
+          duration: 400,
+          easing: Easing.out(Easing.cubic),
+        },
+        () => runOnJS(setIsntOpen)(),
+      ),
     )
   }, [setIsOpen, opacity])
 
@@ -71,20 +73,24 @@ export const ProgressGuideToast = React.forwardRef<
 
     // animate the vertical translation, the opacity, and the checkmark
     const playCheckmark = () => animatedCheckRef.current?.play()
-    opacity.value = 0
-    opacity.value = withTiming(
-      1,
-      {
-        duration: 100,
+    opacity.set(0)
+    opacity.set(() =>
+      withTiming(
+        1,
+        {
+          duration: 100,
+          easing: Easing.out(Easing.cubic),
+        },
+        () => runOnJS(playCheckmark)(),
+      ),
+    )
+    translateY.set(0)
+    translateY.set(() =>
+      withTiming(insets.top + 10, {
+        duration: 500,
         easing: Easing.out(Easing.cubic),
-      },
-      () => runOnJS(playCheckmark)(),
+      }),
     )
-    translateY.value = 0
-    translateY.value = withTiming(insets.top + 10, {
-      duration: 500,
-      easing: Easing.out(Easing.cubic),
-    })
 
     // start the countdown timer to autoclose
     timeoutRef.current = setTimeout(close, visibleDuration || 5e3)
@@ -114,8 +120,8 @@ export const ProgressGuideToast = React.forwardRef<
   }, [winDim.width])
 
   const animatedStyle = useAnimatedStyle(() => ({
-    transform: [{translateY: translateY.value}],
-    opacity: opacity.value,
+    transform: [{translateY: translateY.get()}],
+    opacity: opacity.get(),
   }))
 
   return (