diff options
author | dan <dan.abramov@gmail.com> | 2024-11-17 15:06:28 +0000 |
---|---|---|
committer | GitHub <noreply@github.com> | 2024-11-17 15:06:28 +0000 |
commit | 474c4eff29b6a2454a20febf78a1edd5cf58663a (patch) | |
tree | 43a189a8101cf3f5265d967ad46182cf8cbde9a0 /src/components/ProgressGuide/Toast.tsx | |
parent | d575a2fdaaa4d9c93d6b739dfe3377cdd5985dc1 (diff) | |
download | voidsky-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.tsx | 48 |
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 ( |