fix: keyboard handler memoization

src/components/Dialog/index.tsx

@@ -214,12 +214,15 @@ export const ScrollableInner = React.forwardRef<ScrollView, DialogInnerProps>(
       }
     })
 
-    useKeyboardHandler({
+    useKeyboardHandler(
-      onEnd: e => {
+      {
-        'worklet'
+        onEnd: e => {
-        runOnJS(setKeyboardHeight)(e.height)
+          'worklet'
+          runOnJS(setKeyboardHeight)(e.height)
+        },
       },
-    })
+      [],
+    )
 
     const basePading =
       (isIOS ? 30 : 50) + (isIOS ? keyboardHeight / 4 : keyboardHeight)

src/screens/Messages/components/MessagesList.tsx

@@ -250,30 +250,33 @@ export function MessagesList({
   // We use this value to keep track of when we want to disable the animation.
   const layoutScrollWithoutAnimation = useSharedValue(false)
 
-  useKeyboardHandler({
+  useKeyboardHandler(
-    onStart: e => {
+    {
-      'worklet'
+      onStart: e => {
-      // Immediate updates - like opening the emoji picker - will have a duration of zero. In those cases, we should
+        'worklet'
-      // just update the height here instead of having the `onMove` event do it (that event will not fire!)
+        // Immediate updates - like opening the emoji picker - will have a duration of zero. In those cases, we should
-      if (e.duration === 0) {
+        // just update the height here instead of having the `onMove` event do it (that event will not fire!)
-        layoutScrollWithoutAnimation.set(true)
+        if (e.duration === 0) {
+          layoutScrollWithoutAnimation.set(true)
+          keyboardHeight.set(e.height)
+        } else {
+          keyboardIsOpening.set(true)
+        }
+      },
+      onMove: e => {
+        'worklet'
         keyboardHeight.set(e.height)
-      } else {
+        if (e.height > bottomOffset) {
-        keyboardIsOpening.set(true)
+          scrollTo(flatListRef, 0, 1e7, false)
-      }
+        }
+      },
+      onEnd: () => {
+        'worklet'
+        keyboardIsOpening.set(false)
+      },
     },
-    onMove: e => {
+    [],
-      'worklet'
+  )
-      keyboardHeight.set(e.height)
-      if (e.height > bottomOffset) {
-        scrollTo(flatListRef, 0, 1e7, false)
-      }
-    },
-    onEnd: () => {
-      'worklet'
-      keyboardIsOpening.set(false)
-    },
-  })
 
   const animatedListStyle = useAnimatedStyle(() => ({
     marginBottom: