Merge branch 'next' into feature/FOUR-8522

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/screen-builder",
-  "version": "2.86.0",
+  "version": "2.89.0",
   "scripts": {
     "dev": "VITE_COVERAGE=true vite",
     "build": "vite build",
@@ -56,7 +56,7 @@
     "@fortawesome/fontawesome-free": "^5.6.1",
     "@originjs/vite-plugin-commonjs": "^1.0.3",
     "@panter/vue-i18next": "^0.15.2",
-    "@processmaker/vue-form-elements": "0.52.1",
+    "@processmaker/vue-form-elements": "0.55.0",
     "@processmaker/vue-multiselect": "2.3.0",
     "@storybook/addon-essentials": "^7.6.13",
     "@storybook/addon-interactions": "^7.6.13",
@@ -115,7 +115,7 @@
   },
   "peerDependencies": {
     "@panter/vue-i18next": "^0.15.0",
-    "@processmaker/vue-form-elements": "0.52.1",
+    "@processmaker/vue-form-elements": "0.55.0",
     "i18next": "^15.0.8",
     "vue": "^2.6.12",
     "vuex": "^3.1.1"

src/components/renderer/file-download.vue

@@ -212,7 +212,12 @@ export default {
       let { endpoint } = this;
 
       if (this.requestFiles) {
-        this.filesInfo.push(_.get(this.requestFiles, this.fileDataName, null));
+        const fileInfo = this.requestFiles?.[this.fileDataName];
+
+        if (fileInfo) {
+          this.filesInfo.push(fileInfo);
+        }
+
         return;
       }
 
@@ -229,20 +234,36 @@ export default {
         }
       }
 
-      this.$dataProvider.get(endpoint).then((response) => {
-        const fileInfo = response.data.data
-          ? _.get(response, "data.data.0", null)
-          : _.get(response, "data", null);
-        if (fileInfo) {
-          if (typeof this.value === "number" && this.filesInfo.length > 0) {
-            this.filesInfo[0] = fileInfo;
+      this.$dataProvider
+        .get(endpoint)
+        .then((response) => {
+          const fileInfo = response.data.data
+            ? _.get(response, "data.data.0", null)
+            : _.get(response, "data", null);
+          if (fileInfo) {
+            if (typeof this.value === "number" && this.filesInfo.length > 0) {
+              this.filesInfo[0] = fileInfo;
+            } else {
+              this.filesInfo.push(fileInfo);
+            }
           } else {
-            this.filesInfo.push(fileInfo);
+            console.log(this.$t("File ID does not exist"));
           }
-        } else {
-          console.log(this.$t("File ID does not exist"));
-        }
-      });
+        })
+        .catch((error) => {
+          const alert = document.querySelector(".alert-danger");
+          const defaultMessage = this.$t(
+            "Something went wrong and the file cannot be previewed or downloaded."
+          );
+          const message = error?.response?.data?.message || defaultMessage;
+
+          if (
+            !alert &&
+            (error?.response?.status === 404 || error?.response?.data?.message)
+          ) {
+            window.ProcessMaker.alert(message, "danger");
+          }
+        });
     },
     setFilesInfoFromCollectionValue() {
       const files = this.value