🐱‍👤 App crashes after cropping done by cropper

[hackrx]

Version

Tell us which versions you are using: Inside package.json

• "react-native-image-crop-picker": "^0.32.0",
• react-native : "0.62.2",

Platform

Tell us to which platform this issue is related

• Android

Expected behavior

Cropper should return the cropped image path

Actual behavior

Cropper causes app crashing.

I am using react-native-share-extension to share an image from the gallery to my app. And when the app receives an image path, it opens a cropper to crop the image, after successful cropping, app crashes on android. I have tried this, but it is also not working. But it is working well when the app is already in the background. openCropper code

ImagePicker.openCropper({
      path: this.props.filePath,
      width: 1000,
      height: 800,
      includeBase64: false,
      compressImageQuality: 1,
      cropperActiveWidgetColor: PrimaryColor,
      cropperStatusBarColor: PrimaryColor,
      compressImageMaxWidth: 1500,
      compressImageMaxHeight: 1000,
      mediaType: 'photo',
    })
      .then((image) => {
        this.setState({
          filePath: image.path,
        });
        console.log('We got cropped image ', image.path);
      })
      .catch((err) => {
        console.log('We got error while picking image from another app', err);
        if (err.message === 'User cancelled image selection') {
          console.log('User cancelled the image selection', err.message);
          this.setState({
            filePath: null,
          });
          this.props.clearImageInfo();
        }
      });
  };

[Luckygirlllll]

I have the same problem in Android after choosing image from gallery and doing cropping. Any solutions for this problem so far?

[hackrx]

I wasn't able to solve this package issue but I used one another package which is react-native-image-resizer. I am using this to resize my image when I am getting an image in my initial props and that's how I resolved the issue of size, able to convert 4Mb image file to 1-2Mb image file. I hope this will help you. I am also waiting for the community response.

[msvargas]

Any solution? not working for me

[hackrx]

Hey @punisher97 and @Luckygirlllll are you able to solve this issue? I am still facing this issue.

[SUMITIOS]

Hi @hackrx , can you confirm the issue on latest version 0.35.0 or above.

[hackrx]

Yes @SUMITIOS, now basically what is happening, when cropper crop an image, it doesn't return the image (Promise is not resolved), and it resets the navigation. Like if I am at ImageUpload screen, after cropping App's navigation resets and the user is navigated to AppStart screen. Here are the details of my packages:

package.json

"react": "16.13.1",
"react-native": "0.63.0",
"react-native-image-crop-picker": "^0.35.1",
"react-native-share": "^4.0.1",
"@react-navigation/native": "^5.7.4",
"@react-navigation/stack": "^5.9.1",

android/build..gradle

// Top-level build file where you can add configuration options common to all sub-projects/modules.

buildscript {
    ext {
        buildToolsVersion = "29.0.3"
        minSdkVersion = 16
        compileSdkVersion = 30
        targetSdkVersion = 30
         supportLibVersion = "28.0.0"
    }
    repositories {
        google()
        jcenter()
    }
    dependencies {
        classpath 'com.android.tools.build:gradle:4.0.1'    
        classpath 'com.google.gms:google-services:4.3.3'
        classpath 'com.google.firebase:firebase-crashlytics-gradle:2.2.1'

    }
}

allprojects {
    repositories {
        mavenLocal()
        google()
        jcenter()
        maven {
            // All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
            url("$rootDir/../node_modules/react-native/android")
        }
        maven {
            // Android JSC is installed from npm
            url("$rootDir/../node_modules/jsc-android/dist")
        }
        maven { url 'https://maven.google.com' }

        maven { url 'https://www.jitpack.io' }
    }
}

ImageUpload.js

callCropPicker = (localImageArray) => {
    console.log('Image path ', localImageArray);
     ImagePicker.openCropper({
      path: localImageArray[0].url,
      width: 1000,
      cropping: true,
      height: 800,
    })
      .then((image) => {
        console.log(image);   // <-------------promise not resolved
      })
      .catch((err) => {
        console.log('error in image cropper', err);   //<--- error is also not thrown  
      });
  };
//Removed all irrelevant code

Facing issue on

[x] Android

[msvargas]

Hi @hackrx I solved using this code: https://github.com/ivpusic/react-native-image-crop-picker/issues/980#issuecomment-724106359

[hackrx]

Hi @hackrx I solved using this code: #980 (comment)

@punisher97 thanks, I will try it soon, and close this issue. But I want to know if you are using @react-navigation v5.x , because in my case app is not crashing now, but when cropping is done, the app unmounts the UploadScreen and then mounts the Start screen due to which promise not gets resolved and it didn't log the cropped-ImagePath.

[msvargas]

I use @react-navigation v5 but I don't have any issue with it.