React native and rn-fetch-blob move captured image from Pictures to custom folder created in Android

Question

New to React Native coming from Jquery.

I am creating an app where the user will take a photo of the documents and save to the server.

I am creating a CameraScreen using react-native-camera-kitwhich gives me image URI something like below

/storage/emulated/0/Pictures/IMAGENO1235.jpg

Camera Screen Code

 <CameraKitCameraScreen
            actions={{ leftButtonText: 'Cancel' }}
            onBottomButtonPressed={event => this.onBottomButtonPressed(event)}

            flashImages={{
              on: require('./img/flashon.png'),
              off: require('./img/flashoff.png'),
              auto: require('./img/flashauto.png'),
            }}
            TopTitle={this.state.title}
            cameraFlipImage={require('./img/flip-camera.png')}
            captureButtonImage={require('./img/capture.png')}
            cameraOptions={{
              flashMode: 'auto',             // on/off/auto(default)
              focusMode: 'on',               // off/on(default)
              zoomMode: 'on',                // off/on(default)
              ratioOverlay:'16:9',
              ratioOverlayColor: '#00000077'
            }}
          />

I want this image to move to another Folder Created by rn-fetch-blob using below code

 onBottomButtonPressed(event) {
   if (event.type) {
     if (event.type == "capture") {
      const pictureFolder = RNFetchBlob.fs.dirs.SDCardDir+'/FOSApp/';
      const captureImageLength = event.captureImages.length;
      RNFetchBlob.fs.exists(pictureFolder).then((exists)=>{
        if(exists){
          RNFetchBlob.fs.isDir(pictureFolder).then((isDir)=>{
            if(isDir){

              RNFetchBlob.fs.mv('file:/'+event.captureImages[0].uri, pictureFolder).then(() => {
                  alert('Image Moved');
              }).catch((e)=>{      alert("FAILED:= "+e.message) });
            }else{
              alert('Some Error Happened');
            }
          }).catch((e)=>{ alert("Checking Directory Error : "+e.message); });
        }else{
          RNFetchBlob.fs.mkdir(pictureFolder).then(()=>{
              alert('DIRECTORY CREATED');
          }).catch((e)=>{ alert("Directory Creating Error : "+e.message); });
        }
      });

But it is giving me error

Source File at path /storage/emulated/0/Pictures/IMAGENO1235.jpg does not exist.

Please help.

Thanks

Answer 1

i created an empty file first then move or copy the file depending on what you trying to achieve !

async onBottomButtonPressed(event) {
    if (!event.type || event.type != "capture") { return false }
    const pictureFolder = RNFetchBlob.fs.dirs.SDCardDir + '/FOSApp/';
    const captureImageLength = event.captureImages.length;
    let exists = await RNFetchBlob.fs.exists(pictureFolder);

    if (exists) {
        let isDir = await RNFetchBlob.fs.isDir(pictureFolder);
        if (isDir) {
            let filename = event.captureImages[0].uri.split('/')[event.captureImages[0].uri.split('/').length - 1];

            // create an empty file fisrt
            let createEmptyFile = await RNFetchBlob.fs.createFile(pictureFolder + filename, '', 'base64');

            // then you can copy it or move it like
            let _copy = await RNFetchBlob.fs.cp(event.captureImages[0].uri, pictureFolder + filename);
        }
    } else {
        RNFetchBlob.fs.mkdir(pictureFolder).then(() => {
            alert('DIRECTORY CREATED');
        }).catch((e) => { alert("Directory Creating Error : " + e.message); });
    }
}

Answer 2

Change
RNFetchBlob.fs.mv('file:/'+event.captureImages[0].uri, pictureFolder).then(() => { to RNFetchBlob.fs.mv(event.captureImages[0].uri, pictureFolder).then(() => {

directory gets created and an image is moved alert shows, but no images are getting moved in FOSApp directory that gets created.