From 2ae03b0ee5af41bd1f393ce247e1d92d03de6e45 Mon Sep 17 00:00:00 2001
From: Gaagul Gigi <gaagulgigi@gmail.com>
Date: Thu, 5 Oct 2023 00:06:04 +0530
Subject: [PATCH] Added custom logic to download attachments

---
 package.json                              |  1 -
 src/apis/file_download.js                 |  9 +++++++++
 src/components/Attachments/Attachment.jsx | 13 +++++-------
 src/components/Attachments/Preview.jsx    |  7 +++----
 src/components/Attachments/utils.js       | 24 +++++++++++++++++++++++
 yarn.lock                                 |  5 -----
 6 files changed, 41 insertions(+), 18 deletions(-)
 create mode 100644 src/apis/file_download.js

diff --git a/package.json b/package.json
index e02d106b..8203ccf1 100644
--- a/package.json
+++ b/package.json
@@ -108,7 +108,6 @@
     "eslint-plugin-react-hooks": "4.5.0",
     "eslint-plugin-unused-imports": "2.0.0",
     "express": "^4.18.2",
-    "file-saver": "2.0.5",
     "formik": "2.2.9",
     "fuse.js": "6.6.2",
     "husky": "8.0.1",
diff --git a/src/apis/file_download.js b/src/apis/file_download.js
new file mode 100644
index 00000000..85aa960e
--- /dev/null
+++ b/src/apis/file_download.js
@@ -0,0 +1,9 @@
+import axios from "axios";
+
+const newAxiosInstance = axios.create();
+
+const getFile = url => newAxiosInstance.get(url, { responseType: "blob" });
+
+const fileDownloadApi = { getFile };
+
+export default fileDownloadApi;
diff --git a/src/components/Attachments/Attachment.jsx b/src/components/Attachments/Attachment.jsx
index c713d429..aae5595d 100644
--- a/src/components/Attachments/Attachment.jsx
+++ b/src/components/Attachments/Attachment.jsx
@@ -1,6 +1,5 @@
 import React, { useState } from "react";
 
-import saveAs from "file-saver";
 import { removeBy } from "neetocommons/pure";
 import { withEventTargetValue } from "neetocommons/utils";
 import { MenuVertical, Close } from "neetoicons";
@@ -20,6 +19,7 @@ import directUploadsApi from "apis/direct_uploads";
 
 import { ATTACHMENT_OPTIONS } from "./constants";
 import FileIcon from "./FileIcon";
+import { downloadFile } from "./utils";
 
 const { Menu, MenuItem } = Dropdown;
 
@@ -38,16 +38,13 @@ const Attachment = ({
   const [isDeleting, setIsDeleting] = useState(false);
   const [newFilename, setNewFilename] = useState("");
 
-  const handleDownload = () => {
-    saveAs(attachment.url, attachment.filename);
-  };
+  const handleDownload = () =>
+    downloadFile(attachment.url, attachment.filename);
 
   const handleRename = async () => {
     try {
       const { signedId } = attachment;
-      const payload = {
-        blob: { filename: newFilename },
-      };
+      const payload = { blob: { filename: newFilename } };
 
       const {
         blob: { filename },
@@ -169,7 +166,7 @@ const Attachment = ({
               <Dropdown
                 buttonSize="small"
                 buttonStyle="text"
-                disabled={disabled}
+                {...{ disabled }}
                 icon={MenuVertical}
               >
                 <Menu>
diff --git a/src/components/Attachments/Preview.jsx b/src/components/Attachments/Preview.jsx
index 1a422ac8..04f38a8a 100644
--- a/src/components/Attachments/Preview.jsx
+++ b/src/components/Attachments/Preview.jsx
@@ -1,12 +1,13 @@
 import React, { useRef } from "react";
 
-import saveAs from "file-saver";
 import { findIndexBy } from "neetocommons/pure";
 import { Download, Left, Right } from "neetoicons";
 import { Modal, Typography, Button } from "neetoui";
 import { isEmpty } from "ramda";
 import { Trans, useTranslation } from "react-i18next";
 
+import { downloadFile } from "./utils";
+
 const Preview = ({
   onClose,
   attachments,
@@ -46,9 +47,7 @@ const Preview = ({
     }
   };
 
-  const handleDownload = () => {
-    saveAs(url, filename);
-  };
+  const handleDownload = () => downloadFile(url, filename);
 
   const setPreview = () => {
     switch (contentType.split("/")[0]) {
diff --git a/src/components/Attachments/utils.js b/src/components/Attachments/utils.js
index 6ec37f0d..98e356ce 100644
--- a/src/components/Attachments/utils.js
+++ b/src/components/Attachments/utils.js
@@ -2,6 +2,8 @@ import i18n from "i18next";
 import { Toastr } from "neetoui";
 import { mergeRight } from "ramda";
 
+import fileDownloadApi from "apis/file_download";
+
 import { DEFAULT_UPPY_CONFIG } from "./constants";
 
 const { t } = i18n;
@@ -56,3 +58,25 @@ export const handleDrop = ({ uppy, config, previousAttachmentsCount }) => {
 
   return true;
 };
+
+export const downloadFile = async (fileUrl, filename) => {
+  try {
+    const response = await fileDownloadApi.getFile(fileUrl);
+    const blob = new Blob([response.data]);
+    const url = URL.createObjectURL(blob);
+
+    const a = document.createElement("a");
+    a.href = url;
+    a.setAttribute("download", filename);
+
+    a.style.display = "none";
+    document.body.appendChild(a);
+
+    a.click();
+
+    URL.revokeObjectURL(url);
+    document.body.removeChild(a);
+  } catch (error) {
+    Toastr.error(error);
+  }
+};
diff --git a/yarn.lock b/yarn.lock
index a9eb7057..8469c290 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7827,11 +7827,6 @@ file-loader@^6.2.0:
     loader-utils "^2.0.0"
     schema-utils "^3.0.0"
 
-file-saver@2.0.5:
-  version "2.0.5"
-  resolved "https://registry.yarnpkg.com/file-saver/-/file-saver-2.0.5.tgz#d61cfe2ce059f414d899e9dd6d4107ee25670c38"
-  integrity sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA==
-
 file-system-cache@^1.0.5:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/file-system-cache/-/file-system-cache-1.1.0.tgz#984de17b976b75a77a27e08d6828137c1aa80fa1"