[v4] Crash when use handleComponent with keyboard

[Lucasark]

Bug

When try pull down/up handleComponent it show a error and freeze application, video below:

Gravacao.de.Tela.2023-04-22.as.14.20.37_compressed.mp4

Environment info

Library	Version
@gorhom/bottom-sheet	4.4.5
react-native	0.69.4
react-native-reanimated	3.1.0
react-native-gesture-handler	2.5.0

Steps To Reproduce

Video attech

Describe what you expected to happen:

Not crash :D

Reproducible sample code

Using example from this repo.

Ps.: Example is too up-date, I needed todo fews steps to complete build.

[Lucasark]

Temporary Workaround:

On handle I am using Presseble with Keyboard.dismiss();

      <Pressable style={{
        paddingHorizontal: 16,
        paddingVertical: 5,
        
      }} onPressIn={() => Keyboard.dismiss()}> 

     {...}

[sussertod891015]

same here, even I pass the props enablePanDownToClose={false}, sometimes I can scroll BottomSheet, and will cause error like above, then app crashed.

[cctipgit]

I have the same problem, wait

[gorhom]

this should be fixed in v5, #1346

[batuhansahan]

hello @gorhom i just updated the library to latest version still this error is happening

"@gorhom/bottom-sheet": "5.0.0-alpha.1",

  "error": {
    "message": "Tried to synchronously call a non-worklet function on the UI thread.\n\nPossible solutions are:\n  a) If you want to synchronously execute this method, mark it as a worklet\n  b) If you want to execute this function on the JS thread, wrap it using `runOnJS`",
    "name": "ReanimatedError",
    "jsEngine": "reanimated"
  }

[RichardLindhout]

This still happens

[david98]

I had the same error on on iOS and solved it like this:

--- a/node_modules/@gorhom/bottom-sheet/src/hooks/useGestureEventsHandlersDefault.tsx
+++ b/node_modules/@gorhom/bottom-sheet/src/hooks/useGestureEventsHandlersDefault.tsx
@@ -21,7 +21,7 @@ type GestureEventContextType = {
   isScrollablePositionLocked: boolean;
 };
 
-const dismissKeyboardOnJs = runOnJS(Keyboard.dismiss);
+const dismissKeyboard = Keyboard.dismiss
 
 export const useGestureEventsHandlersDefault: GestureEventsHandlersHookType =
   () => {
@@ -298,7 +298,7 @@ export const useGestureEventsHandlersDefault: GestureEventsHandlersHookType =
                 absoluteY > WINDOW_HEIGHT - animatedKeyboardHeight.value
               )
             ) {
-              dismissKeyboardOnJs();
+              runOnJS(dismissKeyboard)();
             }
           }

I used patch-package to apply the fix.

[robinlindhout]

@david98 this patch crashed Android on startup for me

[david98]

@david98 this patch crashed Android on startup for me

I did get some crashes during use, but I got those before patching too. In the end, I just reverted to reanimated v2 as I kept having issues.

[gabisanmartin12]

Same issue!!!!

[gorhom]

this should be resolved with the latest releases on v4 and v5