Added file delete after upload.

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

@@ -1,7 +1,9 @@
 import { Ionicons } from "@expo/vector-icons";
+import { useNavigation } from "@react-navigation/native";
 import { AssetsSelector } from "expo-images-picker";
+import * as MediaLibrary from "expo-media-library";
 import _ from "lodash";
-import React, { useState } from "react";
+import React, { useCallback, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { StyleSheet, Text, View } from "react-native";
 import { connect } from "react-redux";
@@ -18,7 +20,6 @@ import { handleUpload } from "../../util/document-upload.utility";
 import CameraSelectJob from "../camera-select-job/camera-select-job.component";
 import UploadDeleteSwitch from "../upload-delete-switch/upload-delete-switch.component";
 import UploadProgress from "../upload-progress/upload-progress.component";
-import * as FileSystem from "expo-file-system";
 
 const mapStateToProps = createStructuredSelector({
   currentUser: selectCurrentUser,
@@ -35,19 +36,25 @@ export function ImageBrowserScreen({
   deleteAfterUpload,
 }) {
   const { t } = useTranslation();
+  const navigation = useNavigation();
   const [uploads, setUploads] = useState({});
-
   function handleOnProgress(uri, percent) {
     setUploads((prevUploads) => ({ ...prevUploads, [uri]: { percent } }));
   }
-  function handleOnSuccess(uri) {
+
+  const [tick, setTick] = useState(0);
+  const forceRerender = useCallback(() => {
+    setTick((tick) => tick + 1);
+  }, []);
+  async function handleOnSuccess(uri, id) {
     console.log("onSucces!", uri);
-    setTimeout(async function () {
-      setUploads((prevUploads) => _.omit(prevUploads, uri));
-      if (deleteAfterUpload) {
-        await FileSystem.deleteAsync(uri);
-      }
-    }, 1000);
+
+    if (deleteAfterUpload) {
+      const result = await MediaLibrary.deleteAssetsAsync([id]);
+      console.log("result :>> ", result);
+    }
+    console.log("Omitting", uri);
+    setUploads((prevUploads) => _.omit(prevUploads, uri));
   }
 
   const onDone = async (data) => {
@@ -61,7 +68,7 @@ export function ImageBrowserScreen({
             uri: p.uri,
             onError: handleOnError,
             onProgress: ({ percent }) => handleOnProgress(uri, percent),
-            onSuccess: () => handleOnSuccess(uri),
+            onSuccess: () => handleOnSuccess(uri, p.id),
           },
           {
             bodyshop: bodyshop,
@@ -72,7 +79,9 @@ export function ImageBrowserScreen({
         )
       );
     });
-    Promise.all(actions);
+    await Promise.all(actions);
+    forceRerender();
+    //navigation.goBack();
   };
 
   return (
@@ -81,7 +90,8 @@ export function ImageBrowserScreen({
       <UploadDeleteSwitch />
       {selectedCameraJobId && (
         <AssetsSelector
-          style={{ flex: 9 }}
+          style={{ flex: 1 }}
+          key={tick}
           options={{
             // manipulate: {
             //   //width: 512,
@@ -113,28 +123,23 @@ export function ImageBrowserScreen({
             },
             defaultTopNavigator: {
               continueText: t("mediabrowser.actions.upload"),
-              //goBackText: "Back",
+              goBackText: t("mediabrowser.actions.refresh"),
               buttonStyle: styles.buttonStyle,
               textStyle: styles.textStyle,
 
-              backFunction: (props) => {
-                console.log("Back Function", props);
+              backFunction: () => {
+                forceRerender();
               },
               doneFunction: onDone,
             },
             noAssets: {
               Component: function NoAsset() {
-                return (
-                  <View>
-                    <Text>Looks like nothing here</Text>
-                  </View>
-                );
+                return <Text>{`Looks like there's nothing here...`}</Text>;
               },
             },
           }}
         />
       )}
-
       <UploadProgress uploads={uploads} />
     </View>
   );