IO-3452 Documents Adjustments

Signed-off-by: Allan Carr <allan@imexsystems.ca>

client/src/components/jobs-documents-imgproxy-gallery/jobs-document-imgproxy-gallery.download.component.jsx

@@ -35,16 +35,14 @@ export function JobsDocumentsImgproxyDownloadButton({ galleryImages, identifier,
     ...galleryImages.other.filter((image) => image.isSelected)
   ];
 
-  function downloadProgress(progressEvent) {
-    setDownload((currentDownloadState) => {
-      return {
-        downloaded: progressEvent.loaded || 0,
-        speed: (progressEvent.loaded || 0) - ((currentDownloadState && currentDownloadState.downloaded) || 0)
-      };
-    });
-  }
+  const downloadProgress = ({ loaded }) => {
+    setDownload((currentDownloadState) => ({
+      downloaded: loaded ?? 0,
+      speed: (loaded ?? 0) - (currentDownloadState?.downloaded ?? 0)
+    }));
+  };
 
-  function standardMediaDownload(bufferData) {
+  const standardMediaDownload = (bufferData) => {
     try {
       const a = document.createElement("a");
       const url = window.URL.createObjectURL(new Blob([bufferData]));
@@ -55,29 +53,26 @@ export function JobsDocumentsImgproxyDownloadButton({ galleryImages, identifier,
       setLoading(false);
       setDownload(null);
     }
-  }
+  };
 
   const handleDownload = async () => {
     logImEXEvent("jobs_documents_download");
     setLoading(true);
     try {
-      const response = await axios({
+      const { data } = await axios({
         url: "/media/imgproxy/download",
         method: "POST",
         responseType: "blob",
         data: { jobId, documentids: imagesToDownload.map((_) => _.id) },
         onDownloadProgress: downloadProgress
       });
-
-      setLoading(false);
-      setDownload(null);
-
       // Use the response data (Blob) to trigger download
-      standardMediaDownload(response.data);
+      standardMediaDownload(data);
     } catch {
+      // handle error (optional)
+    } finally {
       setLoading(false);
       setDownload(null);
-      // handle error (optional)
     }
   };
 

client/src/components/jobs-documents-imgproxy-gallery/jobs-documents-imgproxy-gallery.component.jsx

@@ -76,14 +76,14 @@ function JobsDocumentsImgproxyComponent({
               <SyncOutlined />
             </Button>
             <JobsDocumentsGallerySelectAllComponent galleryImages={galleryImages} setGalleryImages={setGalleryImages} />
+            {!billId && (
+              <JobsDocumentsGalleryReassign galleryImages={galleryImages} callback={fetchThumbnails || refetch} />
+            )}
             <JobsDocumentsDownloadButton galleryImages={galleryImages} identifier={downloadIdentifier} jobId={jobId} />
             <JobsDocumentsDeleteButton
               galleryImages={galleryImages}
               deletionCallback={billsCallback || fetchThumbnails || refetch}
             />
-            {!billId && (
-              <JobsDocumentsGalleryReassign galleryImages={galleryImages} callback={fetchThumbnails || refetch} />
-            )}
           </Space>
         </Col>
         {!hasMediaAccess && (

client/src/components/jobs-documents-imgproxy-gallery/jobs-documents-imgproxy-gallery.delete.component.jsx

@@ -67,7 +67,7 @@ export default function JobsDocumentsImgproxyDeleteButton({ galleryImages, delet
       okButtonProps={{ danger: true }}
       cancelText={t("general.actions.cancel")}
     >
-      <Button disabled={imagesToDelete.length < 1} loading={loading}>
+      <Button danger disabled={imagesToDelete.length < 1} loading={loading}>
         {t("documents.actions.delete")}
       </Button>
     </Popconfirm>

client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.container.jsx

@@ -107,8 +107,8 @@ export function JobsDocumentsLocalGallery({
             <a href={CreateExplorerLinkForJob({ jobid: job.id })}>
               <Button>{t("documents.labels.openinexplorer")}</Button>
             </a>
-            <JobsDocumentsLocalGalleryReassign jobid={job.id} />
             <JobsDocumentsLocalGallerySelectAllComponent jobid={job.id} />
+            <JobsDocumentsLocalGalleryReassign jobid={job.id} />
             <JobsLocalGalleryDownloadButton job={job} />
             <JobsDocumentsLocalDeleteButton jobid={job.id} />
           </Space>

client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.delete.component.jsx

@@ -28,6 +28,8 @@ export function JobsDocumentsLocalDeleteButton({ bodyshop, getJobMedia, allMedia
 
   const [loading, setLoading] = useState(false);
 
+  const imagesToDelete = (allMedia?.[jobid] || []).filter((i) => i.isSelected);
+
   const handleDelete = async () => {
     logImEXEvent("job_documents_delete");
     setLoading(true);
@@ -36,7 +38,7 @@ export function JobsDocumentsLocalDeleteButton({ bodyshop, getJobMedia, allMedia
       `${bodyshop.localmediaserverhttp}/jobs/delete`,
       {
         jobid: jobid,
-        files: (allMedia?.[jobid] || []).filter((i) => i.isSelected).map((i) => i.filename)
+        files: imagesToDelete.map((i) => i.filename)
       },
       { headers: { ims_token: bodyshop.localmediatoken } }
     );
@@ -60,14 +62,17 @@ export function JobsDocumentsLocalDeleteButton({ bodyshop, getJobMedia, allMedia
 
   return (
     <Popconfirm
+      disabled={imagesToDelete.length < 1}
       icon={<QuestionCircleOutlined style={{ color: "red" }} />}
       onConfirm={handleDelete}
       title={t("documents.labels.confirmdelete")}
       okText={t("general.actions.delete")}
-      okButtonProps={{ type: "danger" }}
+      okButtonProps={{ danger: true }}
       cancelText={t("general.actions.cancel")}
     >
-      <Button loading={loading}>{t("documents.actions.delete")}</Button>
+      <Button danger disabled={imagesToDelete.length < 1} loading={loading}>
+        {t("documents.actions.delete")}
+      </Button>
     </Popconfirm>
   );
 }

client/src/components/jobs-documents-local-gallery/jobs-documents-local-gallery.download.jsx

@@ -1,8 +1,8 @@
-import { Button } from "antd";
+import { Button, Space } from "antd";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
 import cleanAxios from "../../utils/CleanAxios";
-
+import formatBytes from "../../utils/formatbytes";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
 import { selectAllMedia } from "../../redux/media/media.selectors";
@@ -19,45 +19,63 @@ export default connect(mapStateToProps, mapDispatchToProps)(JobsLocalGalleryDown
 
 export function JobsLocalGalleryDownloadButton({ bodyshop, allMedia, job }) {
   const { t } = useTranslation();
-  const [download, setDownload] = useState(null);
+  const [loading, setLoading] = useState(false);
+  const [download, setDownload] = useState(false);
 
-  function downloadProgress(progressEvent) {
-    setDownload((currentDownloadState) => {
-      return {
-        downloaded: progressEvent.loaded || 0,
-        speed: (progressEvent.loaded || 0) - (currentDownloadState?.downloaded || 0)
-      };
-    });
-  }
+  const imagesToDownload = (allMedia?.[job.id] || []).filter((i) => i.isSelected);
+
+  const downloadProgress = ({ loaded }) => {
+    setDownload((currentDownloadState) => ({
+      downloaded: loaded || 0,
+      speed: (loaded || 0) - (currentDownloadState?.downloaded || 0)
+    }));
+  };
+
+  const standardMediaDownload = (bufferData, filename) => {
+    try {
+      const a = document.createElement("a");
+      const url = window.URL.createObjectURL(new Blob([bufferData]));
+      a.href = url;
+      a.download = `${filename}.zip`;
+      a.click();
+    } catch {
+      setLoading(false);
+      setDownload(null);
+    }
+  };
 
   const handleDownload = async () => {
-    const theDownloadedZip = await cleanAxios.post(
-      `${bodyshop.localmediaserverhttp}/jobs/download`,
-      {
-        jobid: job.id,
-        files: (allMedia?.[job.id] || []).filter((i) => i.isSelected).map((i) => i.filename)
-      },
-      {
-        headers: { ims_token: bodyshop.localmediatoken },
-        responseType: "arraybuffer",
-        onDownloadProgress: downloadProgress
-      }
-    );
-    setDownload(null);
-    standardMediaDownload(theDownloadedZip.data, job.ro_number);
+    const { localmediaserverhttp, localmediatoken } = bodyshop;
+    const { id, ro_number } = job;
+    setLoading(true);
+    try {
+      const response = await cleanAxios.post(
+        `${localmediaserverhttp}/jobs/download`,
+        {
+          jobid: id,
+          files: imagesToDownload.map((i) => i.filename)
+        },
+        {
+          headers: { ims_token: localmediatoken },
+          responseType: "arraybuffer",
+          onDownloadProgress: downloadProgress
+        }
+      );
+      standardMediaDownload(response.data, ro_number);
+    } catch {
+      // handle error (optional)
+    } finally {
+      setLoading(false);
+      setDownload(null);
+    }
   };
 
   return (
-    <Button loading={!!download} onClick={handleDownload}>
-      {t("documents.actions.download")}
+    <Button disabled={imagesToDownload < 1} loading={download || loading} onClick={handleDownload}>
+      <Space>
+        <span>{t("documents.actions.download")}</span>
+        {download && <span>{`(${formatBytes(download.downloaded)} @ ${formatBytes(download.speed)} / second)`}</span>}
+      </Space>
     </Button>
   );
 }
-
-function standardMediaDownload(bufferData, filename) {
-  const a = document.createElement("a");
-  const url = window.URL.createObjectURL(new Blob([bufferData]));
-  a.href = url;
-  a.download = `${filename}.zip`;
-  a.click();
-}

client/src/redux/user/user.sagas.js

@@ -50,7 +50,7 @@ import {
 } from "./user.actions";
 import UserActionTypes from "./user.types";
 //import * as amplitude from '@amplitude/analytics-browser';
-import posthog from "posthog-js";
+import posthog from 'posthog-js';
 
 const fpPromise = FingerprintJS.load();
 
@@ -269,11 +269,11 @@ export function* signInSuccessSaga({ payload }) {
         instanceSeg,
         ...(isParts
           ? [
-              InstanceRenderManager({
-                imex: "ImexPartsManagement",
-                rome: "RomePartsManagement"
-              })
-            ]
+            InstanceRenderManager({
+              imex: "ImexPartsManagement",
+              rome: "RomePartsManagement"
+            })
+          ]
           : [])
       ];
       window.$crisp.push(["set", "session:segments", [segs]]);
@@ -375,31 +375,17 @@ export function* SetAuthLevelFromShopDetails({ payload }) {
       const isParts = yield select((state) => state.application.isPartsEntry === true);
       const instanceSeg = InstanceRenderManager({ imex: "imex", rome: "rome" });
 
-      const featureSegments =
-        payload.features?.allAccess === true
-          ? ["allAccess"]
-          : [
-              "basic",
-              ...Object.keys(payload.features).filter(
-                (key) =>
-                  payload.features[key] === true ||
-                  (typeof payload.features[key] === "string" && !isNaN(Date.parse(payload.features[key])))
-              )
-            ];
-
-      const additionalSegments = [
-        payload.cdk_dealerid && "CDK",
-        payload.pbs_serialnumber && "PBS",
-        // payload.rr_dealerid && "Reynolds",
-        payload.accountingconfig.qbo === true && "QBO",
-        payload.accountingconfig.qbo === false &&
-          !payload.cdk_dealerid &&
-          !payload.pbs_serialnumber &&
-          // !payload.rr_dealerid &&
-          "QBD"
-      ].filter(Boolean);
-
-      featureSegments.push(...additionalSegments);
+      let featureSegments;
+      if (payload.features?.allAccess === true) {
+        featureSegments = ["allAccess"];
+      } else {
+        const featureKeys = Object.keys(payload.features).filter(
+          (key) =>
+            payload.features[key] === true ||
+            (typeof payload.features[key] === "string" && !isNaN(Date.parse(payload.features[key])))
+        );
+        featureSegments = ["basic", ...featureKeys];
+      }
 
       const regionSeg = payload.region_config ? `region:${payload.region_config}` : null;
       const segments = [instanceSeg, ...(regionSeg ? [regionSeg] : []), ...featureSegments];

server/notifications/scenarioBuilders.js

@@ -81,8 +81,8 @@ const alternateTransportChangedBuilder = (data) => {
  * @returns {{app: {jobId, jobRoNumber: *, bodyShopId: *, key: string, body: string, variables: Object, recipients: *[]}, email: {jobId, jobRoNumber: *, bodyShopName: *, body: string, recipients: *[]}, fcm: {recipients: *[]}}}
  */
 const billPostedBuilder = (data) => {
-  const facing = data?.data?.isinhouse ? "An In House" : "A Vendor";
-  const body = `${facing} ${data?.data?.is_credit_memo ? "credit memo" : "bill"} has been posted.`.trim();
+  const facing = data?.data?.isinhouse ? "in-house" : "vendor";
+  const body = `An ${facing} ${data?.data?.is_credit_memo ? "credit memo" : "bill"} has been posted.`.trim();
 
   return buildNotification(data, "notifications.job.billPosted", body, {
     isInHouse: data?.data?.isinhouse,