Enable all delete methods.

app.json

@@ -4,7 +4,7 @@
     "slug": "imexmobile",
     "version": "1.6.0",
     "extra": {
-      "expover": "1",
+      "expover": "3",
       "eas": {
         "projectId": "ffe01f3a-d507-4698-82cd-da1f1cad450b"
       }
@@ -24,7 +24,7 @@
     },
     "android": {
       "package": "com.imex.imexmobile",
-      "versionCode": 1100026,
+      "versionCode": 1100028,
       "googleServicesFile": "./google-services.json",
       "permissions": [
         "android.permission.READ_EXTERNAL_STORAGE",

components/screen-media-browser/screen-media-browser.component.jsx

@@ -1,26 +1,40 @@
-import { Ionicons } from "@expo/vector-icons";
+import { Ionicons } from '@expo/vector-icons';
-import { AssetsSelector } from "expo-images-picker";
+import { AssetsSelector } from 'expo-images-picker';
-import React, { useCallback, useMemo, useState } from "react";
+import { MediaType } from 'expo-media-library';
-import { useTranslation } from "react-i18next";
+import React, { useCallback, useMemo, useState } from 'react';
-import { StyleSheet, Text, View } from "react-native";
+import { useTranslation } from 'react-i18next';
-import { connect } from "react-redux";
+import { StyleSheet, Text, View } from 'react-native';
-import { createStructuredSelector } from "reselect";
+import { connect } from 'react-redux';
-import { logImEXEvent } from "../../firebase/firebase.analytics";
+import { createStructuredSelector } from 'reselect';
-import { selectCurrentCameraJobId } from "../../redux/app/app.selectors";
+import { logImEXEvent } from '../../firebase/firebase.analytics';
-import CameraSelectJob from "../camera-select-job/camera-select-job.component";
+import { toggleDeleteAfterUpload } from '../../redux/app/app.actions';
-import JobSpaceAvailable from "../job-space-available/job-space-available.component";
+import {
-import UploadDeleteSwitch from "../upload-delete-switch/upload-delete-switch.component";
+  selectCurrentCameraJobId,
-import UploadProgress from "../upload-progress/upload-progress.component";
+  selectDeleteAfterUpload,
-import { MediaType } from "expo-media-library";
+} from '../../redux/app/app.selectors';
-import { selectBodyshop } from "../../redux/user/user.selectors";
+import { selectBodyshop } from '../../redux/user/user.selectors';
-import LocalUploadProgress from "../local-upload-progress/local-upload-progress.component";
+import CameraSelectJob from '../camera-select-job/camera-select-job.component';
+import JobSpaceAvailable from '../job-space-available/job-space-available.component';
+import LocalUploadProgress from '../local-upload-progress/local-upload-progress.component';
+import UploadDeleteSwitch from '../upload-delete-switch/upload-delete-switch.component';
+import UploadProgress from '../upload-progress/upload-progress.component';
 
 const mapStateToProps = createStructuredSelector({
   selectedCameraJobId: selectCurrentCameraJobId,
   bodyshop: selectBodyshop,
+  deleteAfterUpload: selectDeleteAfterUpload,
 });
 
-export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
+const mapDispatchToProps = (dispatch) => ({
+  toggleDeleteAfterUpload: () => dispatch(toggleDeleteAfterUpload()),
+});
+
+export function ImageBrowserScreen({
+  bodyshop,
+  selectedCameraJobId,
+  //toggleDeleteAfterUpload,
+  //  deleteAfterUpload,
+}) {
   const { t } = useTranslation();
   const [uploads, setUploads] = useState(null);
   const [tick, setTick] = useState(0);
@@ -29,18 +43,18 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
   }, []);
 
   const onDone = (data) => {
-    logImEXEvent("imexmobile_upload_documents", { count: data.length });
+    logImEXEvent('imexmobile_upload_documents', { count: data.length });
     if (data.length !== 0) setUploads(data);
   };
 
   const widgetErrors = useMemo(
     () => ({
-      errorTextColor: "black",
+      errorTextColor: 'black',
       errorMessages: {
-        hasErrorWithPermissions: "Please Allow media gallery permissions.",
+        hasErrorWithPermissions: 'Please Allow media gallery permissions.',
-        hasErrorWithLoading: "There was an error while loading images.",
+        hasErrorWithLoading: 'There was an error while loading images.',
-        hasErrorWithResizing: "There was an error while loading images.",
+        hasErrorWithResizing: 'There was an error while loading images.',
-        hasNoAssets: "No images found.",
+        hasNoAssets: 'No images found.',
       },
     }),
     []
@@ -64,28 +78,28 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
       width: 50,
       compress: 0.7,
       base64: false,
-      saveTo: "jpeg",
+      saveTo: 'jpeg',
     }),
     []
   );
 
   const _textStyle = {
-    color: "white",
+    color: 'white',
   };
 
   const _buttonStyle = {
-    backgroundColor: "orange",
+    backgroundColor: 'orange',
     borderRadius: 5,
   };
 
   const widgetNavigator = useMemo(
     () => ({
       Texts: {
-        finish: t("mediabrowser.actions.upload"),
+        finish: t('mediabrowser.actions.upload'),
-        back: t("mediabrowser.actions.refresh"),
+        back: t('mediabrowser.actions.refresh'),
-        selected: "selected",
+        selected: 'selected',
       },
-      midTextColor: "black",
+      midTextColor: 'black',
       minSelection: 1,
       buttonTextStyle: styles.textStyle,
       buttonStyle: styles.buttonStyle,
@@ -100,20 +114,20 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
   const widgetStyles = useMemo(
     () => ({
       margin: 2,
-      bgColor: "white",
+      bgColor: 'white',
-      spinnerColor: "blue",
+      spinnerColor: 'blue',
       widgetWidth: 99,
       videoIcon: {
         Component: Ionicons,
-        iconName: "videocam",
+        iconName: 'videocam',
-        color: "white",
+        color: 'white',
         size: 20,
       },
       selectedIcon: {
         Component: Ionicons,
-        iconName: "checkmark-circle-outline",
+        iconName: 'checkmark-circle-outline',
-        color: "white",
+        color: 'white',
-        bg: "rgba(35,35,35, 0.75)",
+        bg: 'rgba(35,35,35, 0.75)',
         size: 32,
       },
     }),
@@ -125,7 +139,7 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
       <CameraSelectJob />
       {bodyshop.uselocalmediaserver ? (
         <Text style={{ margin: 10 }}>
-          {t("mediabrowser.labels.localserver", {
+          {t('mediabrowser.labels.localserver', {
             url: bodyshop.localmediaserverhttp,
           })}
         </Text>
@@ -133,15 +147,25 @@ export function ImageBrowserScreen({ bodyshop, selectedCameraJobId }) {
         <JobSpaceAvailable jobid={selectedCameraJobId} key={`${tick}-space`} />
       )}
       <UploadDeleteSwitch />
+      {
+        // <Button
+        //       onPress={() => {
+        //         //Mutate the state
+        //         toggleDeleteAfterUpload();
+        //       }}
+        //     >
+        //       <Text>{`From screen. ${deleteAfterUpload}`}</Text>
+        //     </Button>
+      }
       {!selectedCameraJobId && (
         <View
           style={{
             flex: 1,
-            justifyContent: "center",
+            justifyContent: 'center',
-            alignItems: "center",
+            alignItems: 'center',
           }}
         >
-          <Text>{t("mediabrowser.labels.selectjobassetselector")}</Text>
+          <Text>{t('mediabrowser.labels.selectjobassetselector')}</Text>
         </View>
       )}
       {selectedCameraJobId && (
@@ -176,7 +200,7 @@ const styles = StyleSheet.create({
     flex: 1,
   },
   container: {
-    display: "flex",
+    display: 'flex',
     // position: "relative",
   },
   buttonStyle: {
@@ -184,11 +208,11 @@ const styles = StyleSheet.create({
   },
   // eslint-disable-next-line react-native/no-color-literals
   textStyle: {
-    color: "dodgerblue",
+    color: 'dodgerblue',
   },
 });
 
-export default connect(mapStateToProps, null)(ImageBrowserScreen);
+export default connect(mapStateToProps, mapDispatchToProps)(ImageBrowserScreen);
 
 // options={{
 //             assetsType: ["photo", "video"],

components/upload-delete-switch/upload-delete-switch.component.jsx

@@ -1,12 +1,11 @@
 import React from 'react';
 import { useTranslation } from 'react-i18next';
 import { StyleSheet, Text, View } from 'react-native';
+import { Checkbox } from 'react-native-paper';
 import { connect } from 'react-redux';
 import { createStructuredSelector } from 'reselect';
-import { logImEXEvent } from '../../firebase/firebase.analytics';
 import { toggleDeleteAfterUpload } from '../../redux/app/app.actions';
 import { selectDeleteAfterUpload } from '../../redux/app/app.selectors';
-import { Checkbox } from 'react-native-paper';
 
 const mapStateToProps = createStructuredSelector({
   deleteAfterUpload: selectDeleteAfterUpload,
@@ -22,6 +21,7 @@ export function UploadDeleteSwitch({
 }) {
   const { t } = useTranslation();
 
+  console.log('🚀 ~ deleteAfterUpload:', deleteAfterUpload);
   return (
     <View style={styles.container}>
       <Text style={styles.text}>
@@ -32,7 +32,6 @@ export function UploadDeleteSwitch({
         // thumbColor={deleteAfterUpload ? 'tomato' : '#f4f3f4'}
         // ios_backgroundColor='#3e3e3e'
         onPress={() => {
-          logImEXEvent('imexmobile_toggle_delete_after_upload');
           toggleDeleteAfterUpload();
         }}
         status={deleteAfterUpload ? 'checked' : 'unchecked'}

components/upload-progress/upload-progress.component.jsx

@@ -207,41 +207,104 @@ export function UploadProgress({
         if (Platform.OS === 'android') {
           //Create a new asset with the first file to delete.
           // console.log('Trying new delete.');
-
+          try {
-          // const delres = await MediaLibrary.removeAssetsFromAlbumAsync(
+            await MediaLibrary.getPermissionsAsync(false);
-          //   filesToDelete,
+            const albumremove = await MediaLibrary.removeAssetsFromAlbumAsync(
-          //   filesToDelete[0].albumId
-          // );
-          // await MediaLibrary.deleteAssetsAsync(filesToDelete.map((f) => f.id));
-
-          // const res = Promise.all(filesToDelete.map(f =>  FileSystem.deleteAsync(f.uri, { idempotent: true })))
-          // console.log("🚀 ~ onDone ~ res:", res)
-          // console.log('🚀 ~ onDone ~ filesToDelete:', filesToDelete);
-
-          await MediaLibrary.getPermissionsAsync(false);
-          const album = await MediaLibrary.createAlbumAsync(
-            'ImEX Mobile Deleted',
-            filesToDelete.pop(),
-            false
-          );
-
-          //Move the rest.
-          if (filesToDelete.length > 0) {
-            const moveResult = await MediaLibrary.addAssetsToAlbumAsync(
               filesToDelete,
-              album,
+              filesToDelete[0].albumId
+            );
+            Toast.show({
+              type: 'info',
+              text1: 'removeAssetsFromAlbumAsync',
+              text2: JSON.stringify(albumremove),
+              autoHide: false,
+            });
+          } catch (error) {
+            console.log("🚀 ~ onDone ~ error:", error)
+            Toast.show({
+              type: 'error',
+              text1: 'removeAssetsFromAlbumAsync',
+              text2: JSON.stringify(error),
+              autoHide: false,
+            });
+          }
+
+          try {
+            const delres = await MediaLibrary.deleteAssetsAsync(
+              filesToDelete.map((f) => f.id)
+            );
+
+            Toast.show({
+              type: 'info',
+              text1: 'deleteAssetsAsync',
+              text2: JSON.stringify(delres),
+              autoHide: false,
+            });
+          } catch (error) {
+            console.log("🚀 ~ onDone ~ error:", error)
+            Toast.show({
+              type: 'error',
+              text1: 'deleteAssetsAsync',
+              text2: JSON.stringify(error),
+              autoHide: false,
+            });
+          }
+
+          try {
+            const res = Promise.all(
+              filesToDelete.map((f) =>
+                FileSystem.deleteAsync(f.uri, { idempotent: true })
+              )
+            );
+            Toast.show({
+              type: 'info',
+              text1: 'FileSystemDelete',
+              text2: JSON.stringify(res),
+              autoHide: false,
+            });
+          } catch (error) {
+            console.log("🚀 ~ onDone ~ error:", error)
+            Toast.show({
+              type: 'error',
+              text1: 'FileSystemDelete',
+              text2: JSON.stringify(error),
+              autoHide: false,
+            });
+          }
+
+          try {
+            const album = await MediaLibrary.createAlbumAsync(
+              'ImEX Mobile Deleted',
+              filesToDelete.pop(),
               false
             );
-            console.log(
+            //Move the rest.
-              'Were assets succesfully moved to the new album?',
+            if (filesToDelete.length > 0) {
-              moveResult
+              const moveResult = await MediaLibrary.addAssetsToAlbumAsync(
-            );
+                filesToDelete,
+                album,
+                false
+              );
+            }
+            const deleteResult = await MediaLibrary.deleteAlbumsAsync(album);
+            Toast.show({
+              type: 'info',
+              text1: 'deleteAlbumsAsync',
+              text2: JSON.stringify(deleteResult),
+              autoHide: false,
+            });
+          } catch (error) {
+            console.log("🚀 ~ onDone ~ error:", error)
+            Toast.show({
+              type: 'error',
+              text1: 'deleteAlbumsAsync',
+              text2: JSON.stringify(error),
+              autoHide: false,
+            });
           }
           //Delete the album.
 
           //This defaults to delete all assets in the album.
-          const deleteResult = await MediaLibrary.deleteAlbumsAsync(album);
-          console.log('Did the albume delete succesfully?', deleteResult);
         } else {
           await MediaLibrary.deleteAssetsAsync(filesToDelete.map((f) => f.id));
         }

redux/app/app.reducer.js

@@ -39,6 +39,7 @@ const appReducer = (state = INITIAL_STATE, action) => {
         documentUploadInProgress: null,
       };
     case AppActionTypes.TOGGLE_DLETE_AFTER_UPLOAD:
+      console.log("It was toggled.")
       return {
         ...state,
         deleteAfterUpload: !state.deleteAfterUpload,

redux/app/app.selectors.js

@@ -1,4 +1,4 @@
-import { createSelector } from "reselect";
+import { createSelector } from 'reselect';
 
 const selectApp = (state) => state.app;