Migrate runOnUI/runOnJS to scheduleOnUI/scheduleOnRN (#11249)

src/screens/Messages/components/MessageComposer.tsx

@@ -7,10 +7,10 @@ import {
 import Animated, {
   Extrapolation,
   interpolate,
-  runOnJS,
   useAnimatedStyle,
 } from 'react-native-reanimated'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
+import {scheduleOnRN} from 'react-native-worklets'
 import {GlassContainer} from 'expo-glass-effect'
 import {LinearGradient} from 'expo-linear-gradient'
 import {type $Typed, type ChatBskyConvoDefs} from '@atproto/api'
@@ -95,7 +95,7 @@ export function MessageComposer({
     onEnd: evt => {
       'worklet'
       if (IS_ANDROID && evt.progress === 0) {
-        runOnJS(blur)()
+        scheduleOnRN(blur)
       }
     },
   })

src/screens/Messages/components/MessagesList.tsx

@@ -13,7 +13,6 @@ import {
   KeyboardGestureArea,
 } from 'react-native-keyboard-controller'
 import Animated, {
-  runOnJS,
   type ScrollEvent,
   type SharedValue,
   useAnimatedStyle,
@@ -22,6 +21,7 @@ import Animated, {
   withTiming,
 } from 'react-native-reanimated'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
+import {scheduleOnRN} from 'react-native-worklets'
 import {
   type $Typed,
   type AppBskyEmbedRecord,
@@ -502,7 +502,7 @@ export function MessagesList({
         (e.contentOffset.y > newMessagesPill.startContentOffset + 200 ||
           isAtBottom.get())
       ) {
-        runOnJS(setNewMessagesPill)({
+        scheduleOnRN(setNewMessagesPill, {
           show: false,
           startContentOffset: 0,
         })

src/screens/Profile/Header/GrowableBanner.tsx

@@ -4,13 +4,13 @@ import Animated, {
   type AnimatedRef,
   Extrapolation,
   interpolate,
-  runOnJS,
   type SharedValue,
   useAnimatedProps,
   useAnimatedReaction,
   useAnimatedStyle,
 } from 'react-native-reanimated'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
+import {scheduleOnRN} from 'react-native-worklets'
 import {BlurView} from 'expo-blur'
 import {useIsFetching} from '@tanstack/react-query'
 
@@ -226,7 +226,7 @@ function useShouldAnimateSpinner({
     () => scrollY.get() < -5,
     (value, prevValue) => {
       if (value !== prevValue) {
-        runOnJS(setIsOverscrolled)(value)
+        scheduleOnRN(setIsOverscrolled, value)
       }
     },
     [scrollY],

src/screens/Profile/Header/index.tsx

@@ -1,12 +1,12 @@
 import {memo, useMemo, useState} from 'react'
 import {type LayoutChangeEvent, StyleSheet, View} from 'react-native'
 import Animated, {
-  runOnJS,
   useAnimatedReaction,
   useAnimatedStyle,
   withTiming,
 } from 'react-native-reanimated'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
+import {scheduleOnRN} from 'react-native-worklets'
 import {
   type AppBskyActorDefs,
   type AppBskyLabelerDefs,
@@ -151,7 +151,7 @@ const MinimalHeader = memo(function MinimalHeader({
     () => scrollY.get() > 100,
     (value, prev) => {
       if (prev !== value) {
-        runOnJS(setVisible)(value)
+        scheduleOnRN(setVisible, value)
       }
     },
   )

src/screens/VideoFeed/components/Scrubber.tsx

@@ -8,8 +8,6 @@ import {
 import Animated, {
   clamp,
   interpolate,
-  runOnJS,
-  runOnUI,
   type SharedValue,
   useAnimatedReaction,
   useAnimatedStyle,
@@ -20,6 +18,7 @@ import {
   useSafeAreaFrame,
   useSafeAreaInsets,
 } from 'react-native-safe-area-context'
+import {scheduleOnRN, scheduleOnUI} from 'react-native-worklets'
 import {useEventListener} from 'expo'
 import {type VideoPlayer} from 'expo-video'
 
@@ -66,7 +65,7 @@ export function Scrubber({
     () => Math.round(seekProgressSV.get()),
     (progress, prevProgress) => {
       if (progress !== prevProgress) {
-        runOnJS(setCurrentSeekTime)(progress)
+        scheduleOnRN(setCurrentSeekTime, progress)
       }
     },
   )
@@ -76,11 +75,11 @@ export function Scrubber({
       player?.seekBy(time)
 
       setTimeout(() => {
-        runOnUI(() => {
+        scheduleOnUI(() => {
           'worklet'
           isSeekingSV.set(false)
           seekingAnimationSV.set(withTiming(0, {duration: 500}))
-        })()
+        })
       }, 50)
     },
     [player, isSeekingSV, seekingAnimationSV],
@@ -116,7 +115,7 @@ export function Scrubber({
 
         // it's seek by, so offset by the current time
         // seekBy sets isSeekingSV back to false, so no need to do that here
-        runOnJS(seekBy)(newTime - currentTimeSV.get())
+        scheduleOnRN(seekBy, newTime - currentTimeSV.get())
       })
   }, [
     scrollGesture,
@@ -253,7 +252,7 @@ function PlayerListener({
     if (duration !== 0) {
       setDuration(Math.round(duration))
     }
-    runOnUI(updateTime)(evt.currentTime, duration)
+    scheduleOnUI(updateTime, evt.currentTime, duration)
   })
 
   return null