Web: Files: fixed files loader when api crashed, added display toast for delete operation

products/ASC.Files/Client/src/store/FilesActionsStore.js

@@ -70,13 +70,17 @@ class FilesActionStore {
   deleteAction = async (translations, newSelection = null) => {
     const { isRecycleBinFolder, isPrivacyFolder } = this.treeFoldersStore;
     const { addActiveItems } = this.filesStore;
-
-    const selection = newSelection ? newSelection : this.filesStore.selection;
-
+    const {
+      secondaryProgressDataStore,
+      loopFilesOperations,
+      clearActiveOperations,
+    } = this.uploadDataStore;
     const {
       setSecondaryProgressBarData,
       clearSecondaryProgressData,
-    } = this.uploadDataStore.secondaryProgressDataStore;
+    } = secondaryProgressDataStore;
+
+    const selection = newSelection ? newSelection : this.filesStore.selection;
 
     setSecondaryProgressBarData({
       icon: "trash",
@@ -111,21 +115,18 @@ class FilesActionStore {
       try {
         await removeFiles(folderIds, fileIds, deleteAfter, immediately).then(
           async (res) => {
+            if (res[0]?.error) return Promise.reject(res[0].error);
             const data = res[0] ? res[0] : null;
             const pbData = {
               icon: "trash",
               label: translations.deleteOperation,
             };
-            await this.uploadDataStore.loopFilesOperations(
-              data,
-              pbData,
-              fileIds,
-              folderIds
-            );
+            await loopFilesOperations(data, pbData, fileIds, folderIds);
             this.updateCurrentFolder();
           }
         );
       } catch (err) {
+        clearActiveOperations(fileIds, folderIds);
         setSecondaryProgressBarData({
           visible: true,
           alert: true,
@@ -152,6 +153,7 @@ class FilesActionStore {
 
     try {
       await emptyTrash().then(async (res) => {
+        if (res[0]?.error) return Promise.reject(res[0].error);
         const data = res[0] ? res[0] : null;
         const pbData = {
           icon: "trash",
@@ -303,10 +305,14 @@ class FilesActionStore {
   };
 
   deleteItemAction = async (itemId, translations, isFile, isThirdParty) => {
+    const {
+      secondaryProgressDataStore,
+      clearActiveOperations,
+    } = this.uploadDataStore;
     const {
       setSecondaryProgressBarData,
       clearSecondaryProgressData,
-    } = this.uploadDataStore.secondaryProgressDataStore;
+    } = secondaryProgressDataStore;
     if (
       this.settingsStore.confirmDelete ||
       this.treeFoldersStore.isPrivacyFolder ||
@@ -325,6 +331,7 @@ class FilesActionStore {
       try {
         await this.deleteItemOperation(isFile, itemId, translations);
       } catch (err) {
+        clearActiveOperations(isFile && [itemId], !isFile && [itemId]);
         setSecondaryProgressBarData({
           visible: true,
           alert: true,
@@ -348,6 +355,7 @@ class FilesActionStore {
       this.isMediaOpen();
       return deleteFile(itemId)
         .then(async (res) => {
+          if (res[0]?.error) return Promise.reject(res[0].error);
           const data = res[0] ? res[0] : null;
           await this.uploadDataStore.loopFilesOperations(data, pbData, [
             itemId,
@@ -359,6 +367,7 @@ class FilesActionStore {
       addActiveItems(null, [itemId]);
       return deleteFolder(itemId)
         .then(async (res) => {
+          if (res[0]?.error) return Promise.reject(res[0].error);
           const data = res[0] ? res[0] : null;
           await this.uploadDataStore.loopFilesOperations(data, pbData, null, [
             itemId,
@@ -400,6 +409,7 @@ class FilesActionStore {
       setSecondaryProgressBarData,
     } = this.uploadDataStore.secondaryProgressDataStore;
 
+    //TODO: duplicate for folders?
     const folderIds = [];
     const fileIds = [];
     item.fileExst ? fileIds.push(item.id) : folderIds.push(item.id);
@@ -414,6 +424,8 @@ class FilesActionStore {
       alert: false,
     });
 
+    this.filesStore.addActiveItems(fileIds, folderIds);
+
     return this.uploadDataStore.copyToAction(
       this.selectedFolderStore.id,
       folderIds,

products/ASC.Files/Client/src/store/UploadDataStore.js

@@ -765,15 +765,19 @@ class UploadDataStore {
 
         const data = res[0] ? res[0] : null;
         const pbData = { icon: "duplicate" };
-        return this.loopFilesOperations(data, pbData).then(() =>
-          this.moveToCopyTo(destFolderId, pbData, true)
-        );
+        return this.loopFilesOperations(
+          data,
+          pbData,
+          fileIds,
+          folderIds
+        ).then(() => this.moveToCopyTo(destFolderId, pbData, true));
       })
       .catch((err) => {
         setSecondaryProgressBarData({
           visible: true,
           alert: true,
         });
+        this.clearActiveOperations(fileIds, folderIds);
         setTimeout(() => clearSecondaryProgressData(), TIMEOUT);
         return Promise.reject(err);
       });
@@ -801,15 +805,19 @@ class UploadDataStore {
       .then((res) => {
         const data = res[0] ? res[0] : null;
         const pbData = { icon: "move" };
-        return this.loopFilesOperations(data, pbData).then(() =>
-          this.moveToCopyTo(destFolderId, pbData, false)
-        );
+        return this.loopFilesOperations(
+          data,
+          pbData,
+          fileIds,
+          folderIds
+        ).then(() => this.moveToCopyTo(destFolderId, pbData, false));
       })
       .catch((err) => {
         setSecondaryProgressBarData({
           visible: true,
           alert: true,
         });
+        this.clearActiveOperations(fileIds, folderIds);
         setTimeout(() => clearSecondaryProgressData(), TIMEOUT);
         return Promise.reject(err);
       });
@@ -854,12 +862,6 @@ class UploadDataStore {
   };
 
   loopFilesOperations = async (data, pbData, fileIds, folderIds) => {
-    const label = this.secondaryProgressDataStore.label;
-
-    const {
-      clearSecondaryProgressData,
-      setSecondaryProgressBarData,
-    } = this.secondaryProgressDataStore;
     const {
       activeFiles,
       activeFolders,
@@ -867,6 +869,12 @@ class UploadDataStore {
       setActiveFolders,
     } = this.filesStore;
 
+    const {
+      clearSecondaryProgressData,
+      setSecondaryProgressBarData,
+    } = this.secondaryProgressDataStore;
+
+    const label = this.secondaryProgressDataStore.label;
     let progress = data.progress;
 
     if (!data) {
@@ -892,7 +900,10 @@ class UploadDataStore {
       });
     }
 
-    if (operationItem.files || operationItem.folders) {
+    if (
+      !operationItem.error &&
+      (operationItem.files || operationItem.folders)
+    ) {
       const newActiveFiles = activeFiles.filter(
         (x) => !operationItem.files.find((y) => y.id === x)
       );
@@ -905,15 +916,7 @@ class UploadDataStore {
         setActiveFolders(newActiveFolders);
       }, TIMEOUT);
     } else if (fileIds || folderIds) {
-      const newActiveFiles = activeFiles.filter((el) => !fileIds.includes(el));
-      const newActiveFolders = activeFolders.filter(
-        (el) => !folderIds.includes(el)
-      );
-
-      setTimeout(() => {
-        setActiveFiles(newActiveFiles);
-        setActiveFolders(newActiveFolders);
-      }, TIMEOUT);
+      this.clearActiveOperations(fileIds, folderIds);
     }
 
     return operationItem;
@@ -974,6 +977,25 @@ class UploadDataStore {
     });
     return promise;
   };
+
+  clearActiveOperations = (fileIds, folderIds) => {
+    const {
+      activeFiles,
+      activeFolders,
+      setActiveFiles,
+      setActiveFolders,
+    } = this.filesStore;
+
+    const newActiveFiles = activeFiles.filter((el) => !fileIds.includes(el));
+    const newActiveFolders = activeFolders.filter(
+      (el) => !folderIds.includes(el)
+    );
+
+    setTimeout(() => {
+      setActiveFiles(newActiveFiles);
+      setActiveFolders(newActiveFolders);
+    }, TIMEOUT);
+  };
 }
 
 export default UploadDataStore;