Merge pull request #1098 from PintoGideon/Update-Pacs

Show loading spinners for statuses that are waiting
FNNDSC · Mar 7, 2024 · e4284e4 · e4284e4
2 parents e4481e0 + ee0e006
commit e4284e4
Show file tree

Hide file tree

Showing 4 changed files with 67 additions and 47 deletions.
diff --git a/src/components/Feeds/Feeds.css b/src/components/Feeds/Feeds.css
@@ -30,8 +30,6 @@
   display: block;
 }
 
-
-
-  .chart.dark tspan {
+ .chart.dark tspan {
     fill: white !important;
   }
diff --git a/src/components/Pacs/components/SeriesCard.tsx b/src/components/Pacs/components/SeriesCard.tsx
@@ -102,6 +102,8 @@ const SeriesCard = ({ series }: { series: any }) => {
 
         if (fileItems && fileItems.length > 0) {
           setCubeFilePreview(fileItems[0]);
+        } else {
+          setError("Failed to locate the dataset in the cube backend");
         }
       } catch {
         setError("Could not fetch this file from storage");
@@ -241,6 +243,11 @@ const SeriesCard = ({ series }: { series: any }) => {
                 ...requestCounter,
                 [currentStep]: 1,
               });
+            } else if (requestCounter[currentStep] === 1) {
+              setRequestCounter({
+                ...requestCounter,
+                [currentStep]: requestCounter[currentStep] + 1,
+              });
             }
 
             if (
@@ -270,7 +277,7 @@ const SeriesCard = ({ series }: { series: any }) => {
         }
       }
     },
-    fetchNextStatus && pullStudy ? 5000 : fetchNextStatus ? 3000 : null,
+    fetchNextStatus && pullStudy ? 5000 : fetchNextStatus ? 1000 : null,
   );
 
   let nextQueryStage = "";
@@ -462,8 +469,7 @@ const SeriesCard = ({ series }: { series: any }) => {
       {error && (
         <Alert
           type="error"
-          message="An Error was found"
-          description={error}
+          message={error}
           closable
           onClose={() => setError("")}
         />

diff --git a/src/components/Pacs/index.tsx b/src/components/Pacs/index.tsx
@@ -1,30 +1,30 @@
-import * as React from "react";
 import {
-  Split,
-  SplitItem,
-  TextInput,
+  Button,
   Dropdown,
   DropdownItem,
   DropdownList,
-  MenuToggle,
-  Button,
   Grid,
   GridItem,
+  MenuToggle,
   PageSection,
+  Split,
+  SplitItem,
+  TextInput,
 } from "@patternfly/react-core";
-import { useDispatch } from "react-redux";
 import SearchIcon from "@patternfly/react-icons/dist/esm/icons/search-icon";
-import WrapperConnect from "../Wrapper";
-import { EmptyStateComponent, SpinContainer } from "../Common";
-import PatientCard from "./components/PatientCard";
-import { setSidebarActive } from "../../store/ui/actions";
-import { PacsQueryContext, PacsQueryProvider, Types } from "./context";
-import PfdcmClient from "./pfdcmClient";
+import { Alert } from "antd";
+import * as React from "react";
+import { useDispatch } from "react-redux";
 import { useNavigate } from "react-router";
 import { useSearchParams } from "react-router-dom";
-import { Alert } from "antd";
 import { pluralize } from "../../api/common";
+import { setSidebarActive } from "../../store/ui/actions";
+import { EmptyStateComponent, SpinContainer } from "../Common";
+import WrapperConnect from "../Wrapper";
+import PatientCard from "./components/PatientCard";
+import { PacsQueryContext, PacsQueryProvider, Types } from "./context";
 import "./pacs-copy.css";
+import PfdcmClient from "./pfdcmClient";
 
 const dropdownMatch: { [key: string]: string } = {
   PatientID: "Patient MRN",

diff --git a/src/components/Pacs/pfdcmClient.tsx b/src/components/Pacs/pfdcmClient.tsx
@@ -220,6 +220,7 @@ class PfdcmClient {
         };
       }
     >();
+
     const progressMap = new Map<string, { imagestatus: any; images: any }>();
 
     for (const study of studies) {
@@ -266,73 +267,88 @@ class PfdcmClient {
       let currentStep = "none";
       let currentProgress = 0;
       const newImageStatus: ImageStatusType[] = [
-        { title: "Request", description: "", status: "wait" },
         { title: "Retrieve", description: "", status: "wait" },
         { title: "Push", description: "", status: "wait" },
         { title: "Register", description: "", status: "wait" },
       ];
 
       const { imagestatus, images } = seriesData;
 
-      if (!imagestatus.request && retrieve) {
+      const pluralize = requestedFiles === 1 ? " files" : " files";
+
+      if (retrieve) {
+        // retrieving for the first time
         newImageStatus[0].icon = <Spin />;
         newImageStatus[0].description = requestedFiles
-          ? `Requesting ${requestedFiles} ${
-              requestedFiles === 1 ? " file" : " files"
-            }`
-          : "Requesting files";
-      }
-
-      if (imagestatus.request) {
-        currentStep = "request";
-        newImageStatus[0].description = `${images.requested} of ${
-          requestedFiles ? requestedFiles : images.requested
-        }`;
-        newImageStatus[0].status = "finish";
+          ? `Retrieving ${requestedFiles} ${pluralize}`
+          : "Retrieving files";
       }
 
       if (imagestatus.pack) {
         currentStep = "retrieve";
-        newImageStatus[1].description = `${images.packed} of ${images.requested}`;
-        newImageStatus[1].status =
+        newImageStatus[0].description = `${images.packed} of ${images.requested}`;
+        newImageStatus[0].status =
           images.packed < images.requested
             ? "process"
             : images.packed === images.requested
               ? "finish"
               : "wait";
         currentProgress = images.packed / images.requested;
-        newImageStatus[1].icon = newImageStatus[1].status === "process" && (
+        newImageStatus[0].icon = newImageStatus[0].status === "process" && (
           <Spin />
         );
       }
 
+      const showPushDetails =
+        !imagestatus.push &&
+        images.pushed === 0 &&
+        requestedFiles &&
+        images.packed === +requestedFiles;
+
+      newImageStatus[1].icon = showPushDetails && <Spin />;
+      newImageStatus[1].description = showPushDetails
+        ? `Pushing ${requestedFiles} ${pluralize}`
+        : "";
+
       if (imagestatus.push) {
         currentStep = "push";
-        newImageStatus[2].description = `${images.pushed} of ${images.requested}`;
-        newImageStatus[2].status =
+        newImageStatus[1].description = `${images.pushed} of ${images.requested}`;
+        newImageStatus[1].status =
           images.pushed < images.requested
             ? "process"
             : images.pushed === images.requested
               ? "finish"
               : "wait";
         currentProgress = images.pushed / images.requested;
-        newImageStatus[2].icon = imagestatus.pack &&
-          !imagestatus.push &&
-          !imagestatus.register && <Spin />;
+        newImageStatus[1].icon = newImageStatus[1].status === "process" && (
+          <Spin />
+        );
       }
 
+      const showRegisterDetails =
+        requestedFiles &&
+        images.pushed === +requestedFiles &&
+        !imagestatus.register &&
+        images.registered === 0;
+
+      newImageStatus[2].icon = showRegisterDetails && <Spin />;
+      newImageStatus[2].description = showRegisterDetails
+        ? `Registering ${requestedFiles} ${pluralize}`
+        : "";
+
       if (imagestatus.register) {
         if (images.registered === images.requested) {
           currentStep = "completed";
-          newImageStatus[3].description = `${images.registered} of ${images.requested}`;
-          newImageStatus[3].status = "finish";
+          newImageStatus[2].description = `${images.registered} of ${images.requested}`;
+          newImageStatus[2].status = "finish";
           currentProgress = 1;
         } else {
           currentStep = "register";
-          newImageStatus[3].description = `${images.registered} of ${images.requested}`;
-          newImageStatus[3].status = "process";
+          newImageStatus[2].description = `${images.registered} of ${images.requested}`;
+          newImageStatus[2].status =
+            images.registered < images.requested ? "process" : "wait";
           currentProgress = images.registered / images.requested;
-          newImageStatus[3].icon = newImageStatus[3].status === "process" && (
+          newImageStatus[2].icon = newImageStatus[2].status === "process" && (
             <Spin />
           );
         }