Merge pull request #1118 from PintoGideon/pacs-query-with-oxidicom

Fix the bug with downloads and remove the token in the url param
FNNDSC · Mar 18, 2024 · c1afab3 · c1afab3
2 parents 11b7e49 + 27f6d04
commit c1afab3
Show file tree

Hide file tree

Showing 2 changed files with 63 additions and 52 deletions.
diff --git a/src/components/FeedOutputBrowser/FileBrowser.tsx b/src/components/FeedOutputBrowser/FileBrowser.tsx
@@ -51,6 +51,7 @@ const FileBrowser = (props: FileBrowserProps) => {
   const selectedFile = useTypedSelector((state) => state.explorer.selectedFile);
   const drawerState = useTypedSelector((state) => state.drawers);
   const feed = useTypedSelector((state) => state.feed.currentFeed.data);
+
   const dispatch = useDispatch();
   const [currentRowIndex, setCurrentRowIndex] = React.useState(0);
   const { files, folders, path } = pluginFilesPayload;
@@ -64,66 +65,60 @@ const FileBrowser = (props: FileBrowserProps) => {
   const pathSplit = path?.split(`/${plugin_name}_${id}/`);
   const breadcrumb = path ? pathSplit[1].split("/") : [];
 
+  const privateFeed = feed?.data.public === false ? true : false;
+
   const makeDataSourcePublic = async () => {
     // Implement logic to make the data source public
-    await feed?.put({ public: true });
+    await feed?.put({
+      //@ts-ignore
+      public: true,
+    });
   };
 
   const makeDataSourcePrivate = async () => {
+    console.log("Make it private again");
     // Implement logic to make the data source private again
-    await feed?.put({ public: false });
+    await feed?.put({
+      //@ts-ignore
+      public: false,
+    });
   };
 
   const handleDownloadClick = async (item: FeedFile) => {
     if (item) {
       try {
-        const extension = getFileExtension(item.data.fname);
         const fileName = getFileName(item.data.fname);
         const link = document.createElement("a");
-        if (["dcm", "png", "jpg", "json"].includes(extension)) {
-          // Triggering a browser download for these files can be inconsistent
-          try {
-            const blob = await item.getFileBlob();
-            if (!blob) {
-              throw new Error("Failed to fetch the file");
-            }
-            link.href = window.URL.createObjectURL(blob);
-            link.download = fileName;
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-            return item;
-          } catch (e) {
-            throw e;
-          }
-        } else {
-          const url = item.collection.items[0].links[0].href;
-          if (!url) {
-            throw new Error("Failed to construct the url");
-          }
-          const client = ChrisAPIClient.getClient();
-          const token = client.auth.token;
-          // This is highly inconsistent and needs to be investigated further
-          const authorizedUrl = `${url}?token=${token}`; // Add token as a query parameter
-          const privateFeed = feed?.data.public === false;
-          // Make the data source public
-          privateFeed && (await makeDataSourcePublic());
-
-          // Create an anchor element
-
-          link.href = authorizedUrl;
-          link.download = fileName; // Set the download attribute to specify the filename
-          // Append the anchor element to the document body
-          document.body.appendChild(link);
-          // Programmatically trigger the download
-          link.click();
-          // Remove the anchor element from the document body after the download is initiated
-          document.body.removeChild(link);
 
+        const url = item.collection.items[0].links[0].href;
+        if (!url) {
+          throw new Error("Failed to construct the url");
+        }
+
+        // This is highly inconsistent and needs to be investigated further
+        const authorizedUrl = `${url}`; // Add token as a query parameter
+
+        // Make the data source public
+        privateFeed && (await makeDataSourcePublic());
+
+        // Create an anchor element
+
+        link.href = authorizedUrl;
+        link.download = fileName; // Set the download attribute to specify the filename
+        // Append the anchor element to the document body
+        // Listen for the load event on the anchor element
+        link.onload = async () => {
           // Make the data source private again after the download is done
           privateFeed && (await makeDataSourcePrivate());
-          return item;
-        }
+        };
+
+        document.body.appendChild(link);
+        // Programmatically trigger the download
+        link.click();
+        // Remove the anchor element from the document body after the download is initiated
+        document.body.removeChild(link);
+
+        return item;
       } catch (e) {
         throw e;
       }
@@ -372,6 +367,7 @@ const FileBrowser = (props: FileBrowserProps) => {
                             variant="plain"
                             onClick={(e) => {
                               e.stopPropagation();
+                              e.preventDefault();
                               downloadMutation.mutate(item);
                             }}
                             icon={<DownloadIcon />}

diff --git a/src/components/IconContainer/index.tsx b/src/components/IconContainer/index.tsx
@@ -12,7 +12,7 @@ import {
   Tooltip,
 } from "@patternfly/react-core";
 import { useMutation, useQueryClient } from "@tanstack/react-query";
-import { Alert } from "antd";
+import { Alert, Spin } from "antd";
 import { cujs } from "chris-utility";
 import React, { ReactElement } from "react";
 import { useDispatch } from "react-redux";
@@ -169,18 +169,26 @@ const IconContainer = () => {
       const { bulkSelect, sharePublically, feedName } = data;
       for (const feed of bulkSelect) {
         try {
-          await feed.put({
-            //@ts-ignore
-            public: sharePublically ? sharePublically : feed.data.public,
-            owner: sharePublically ? feed.data.creator_username : feedName,
-          });
+          if (sharePublically) {
+            const currentState = feed.data.public;
+
+            await feed.put({
+              //@ts-ignore
+              public: !currentState,
+            });
+          } else {
+            await feed.put({
+              owner: feedName,
+            });
+          }
         } catch (error: any) {
           throw new Error(error);
         }
       }
     },
     onSuccess: () => {
       dispatch(setBulkSelect([], false));
+      invalidateQueries();
       handleModalToggle(false);
     },
     onError: (error) => {
@@ -304,6 +312,12 @@ const IconContainer = () => {
       handleDuplicateFeedMutation.mutate({ feedList: bulkSelect, feedName });
   };
 
+  const isPending =
+    shareFeedMutation.isPending ||
+    handleDownloadMutation.isPending ||
+    handleDuplicateFeedMutation.isPending ||
+    deleteFeedMutation.isPending;
+
   return (
     <ToggleGroup aria-label="Feed Action Bar">
       {["archive", "merge", "duplicate", "share", "delete"].map((action) => {
@@ -339,7 +353,8 @@ const IconContainer = () => {
             variant={currentAction === "delete" ? "danger" : "primary"}
             form="modal-with-form-form"
             onClick={handleSubmit}
-            isDisabled={bulkSelect.length === 0}
+            isDisabled={bulkSelect.length === 0 || isPending}
+            icon={isPending && <Spin />}
           >
             Confirm
           </Button>,
@@ -380,7 +395,7 @@ const IconContainer = () => {
                   <Checkbox
                     isChecked={modalState.sharePublically}
                     id="checked"
-                    label="Share this feed publically"
+                    label="This will make a private feed public and vice versa"
                     onChange={(_event, checked: boolean) => {
                       setModalState({
                         ...modalState,