react-native-actions-sheet does not working on Android apk (release) mode version 0.9.6

[OFD16]

https://github.com/user-attachments/assets/03c4f8ca-f84a-46b4-9980-4fac6d64d4f3

My bottomsheets are causing problems after running in Android release mode but in debug mode there is no problem when opening or using my bottomsheets. As you can see in the video, the sheet does not open but its content is visible. Real phones have the same problem.

My method to run apk in emulator:

1. I cleared previous builds cd android ./gradlew clean

2. I created apk ./gradlew assembleRelease

3. I ran it on emulator adb devices adb install app/build/outputs/apk/release/app-release.apk

This is my package.json file. Packages that may cause problems include react-native-modal and @gorhom/bottom-sheet. I did not uninstall the packages.

{
  "name": "name",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "start": "react-native start",
  },
  "dependencies": {
    "@bam.tech/react-native-image-resizer": "^3.0.10",
    "@gorhom/bottom-sheet": "^4.6.1",
    "@react-native-community/blur": "^4.4.0",
    "@react-native-community/datetimepicker": "^7.6.4",
    "@react-native-community/geolocation": "^3.2.1",
    "@react-native-community/netinfo": "^11.3.1",
    "@react-native-picker/picker": "^2.7.2",
    "@react-navigation/bottom-tabs": "^6.5.20",
    "@react-navigation/drawer": "^6.6.15",
    "@react-navigation/native": "^6.1.17",
    "@react-navigation/native-stack": "^6.9.26",
    "@shopify/flash-list": "^1.7.0",
    "axios": "^1.6.8",
    "react": "18.2.0",
    "react-native": "0.73.6",
    "react-native-actions-sheet": "^0.9.6",
    "react-native-animatable": "^1.4.0",
    "react-native-app-intro-slider": "^4.0.4",
    "react-native-confirmation-code-field": "^7.4.0",
    "react-native-dotenv": "^3.4.11",
    "react-native-floating-action": "^1.22.0",
    "react-native-gesture-handler": "^2.17.1",
    "react-native-image-picker": "^7.1.2",
    "react-native-image-viewing": "^0.2.2",
    "react-native-input-outline": "^1.5.2",
    "react-native-maps": "^1.14.0",
    "react-native-mmkv": "^2.12.2",
    "react-native-modal": "^13.0.1",
    "react-native-pell-rich-editor": "^1.9.0",
    "react-native-reanimated": "^3.8.1",
    "react-native-rename": "^3.2.14",
    "react-native-render-html": "^6.3.4",
    "react-native-safe-area-context": "^4.9.0",
    "react-native-screens": "^3.30.1",
    "react-native-slick": "^1.6.0",
    "react-native-svg": "^15.1.0",
    "react-native-toast-message": "^2.2.0",
    "react-native-ui-lib": "^7.19.0",
    "react-native-webview": "^13.10.3",
    "react-native-zoom-lightbox": "^1.0.1",
    "util": "^0.12.5",
    "zustand": "^4.5.2"
  },
  "devDependencies": {
    "@babel/core": "^7.20.0",
    "@babel/preset-env": "^7.20.0",
    "@babel/runtime": "^7.20.0",
    "@react-native/babel-preset": "0.73.21",
    "@react-native/eslint-config": "0.73.2",
    "@react-native/metro-config": "0.73.5",
    "@react-native/typescript-config": "0.73.1",
    "@types/react": "^18.2.6",
    "@types/react-native-dotenv": "^0.2.2",
    "@types/react-test-renderer": "^18.0.0",
    "babel-jest": "^29.6.3",
    "eslint": "^8.19.0",
    "jest": "^29.6.3",
    "prettier": "2.8.8",
    "react-native-svg-transformer": "^1.3.0",
    "react-test-renderer": "18.2.0",
    "typescript": "5.0.4"
  },
  "engines": {
    "node": ">=18"
  }
}

Also, this is my provider.tsx file where I keep my providers.

import {SafeAreaProvider} from 'react-native-safe-area-context';
import {BottomSheetModalProvider} from '@gorhom/bottom-sheet';
import {GestureHandlerRootView} from 'react-native-gesture-handler';
import Toast from 'react-native-toast-message';
import React from 'react';
import {SheetProvider} from 'react-native-actions-sheet';
import '../utils/sheets/sheets';

const Providers = ({children}: {children: React.ReactNode}) => {
  return (
    <SafeAreaProvider>
      <GestureHandlerRootView style={{flex: 1}}>
        <SheetProvider>
          {/* <AuthProvider> */}
          {children}
          {/* <BottomSheetModalProvider>{children}</BottomSheetModalProvider> */}
          {/* </AuthProvider> */}
        </SheetProvider>
        <Toast />
      </GestureHandlerRootView>
    </SafeAreaProvider>
  );
};

export default Providers;

[OFD16]

Set newArchEnabled false

I fix in react-native-modal and react-native-actions-sheet does not opening/work on release mode(apk) problems with gradle.properties newArchEnabled prop by setting it to false. I think these packages need to adapt to the new architecture of react-native as soon as possible or react native should find a solution to this because I don't know the problem 😄.

Also, I use the react-native-image-picker package to use the camera, take videos and select photos from the gallery. And since the documentation suggested Set newArchEnabledto true inside android/gradle.properties, that's what I did. But now I set it to false and everything works without any problems. I say pay attention to these.

Also my versions:

"react-native-image-picker": "^7.1.2",
"react-native-actions-sheet": "^0.9.6",
"react-native-modal": "^13.0.1"