IO-3431 Fix Document in Drawer from Production Board

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

client/src/components/job-detail-cards/job-detail-cards.documents.component.jsx

@@ -1,13 +1,21 @@
 import { Carousel } from "antd";
+import { useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { HasFeatureAccess } from "../feature-wrapper/feature-wrapper.component";
-import { GenerateThumbUrl } from "../jobs-documents-gallery/job-documents.utility";
+import { fetchImgproxyThumbnails } from "../jobs-documents-imgproxy-gallery/jobs-documents-imgproxy-gallery.component";
 import UpsellComponent, { upsellEnum } from "../upsell/upsell.component";
 import CardTemplate from "./job-detail-cards.template.component";
 
 export default function JobDetailCardsDocumentsComponent({ loading, data, bodyshop }) {
   const { t } = useTranslation();
   const hasMediaAccess = HasFeatureAccess({ bodyshop, featureName: "media" });
+  const [thumbnails, setThumbnails] = useState([]);
+
+  useEffect(() => {
+    if (data?.id) {
+      fetchImgproxyThumbnails({ setStateCallback: setThumbnails, jobId: data.id, imagesOnly: true });
+    }
+  }, [data?.id]);
 
   if (!data)
     return (
@@ -22,18 +30,19 @@ export default function JobDetailCardsDocumentsComponent({ loading, data, bodysh
       title={t("jobs.labels.cards.documents")}
       extraLink={`/manage/jobs/${data.id}?tab=documents`}
     >
-      {!hasMediaAccess && (
-        <UpsellComponent disableMask upsell={upsellEnum().media.general}>
-          {data.documents.length > 0 ? (
+      {!hasMediaAccess && <UpsellComponent disableMask upsell={upsellEnum().media.general} />}
+      {hasMediaAccess && (
+        <>
+          {thumbnails.length > 0 ? (
             <Carousel autoplay>
-              {data.documents.map((item) => (
-                <img key={item.id} src={GenerateThumbUrl(item)} alt={item.name} />
+              {thumbnails.map((item) => (
+                <img key={item.id} src={item.src} alt={item.filename} />
               ))}
             </Carousel>
           ) : (
             <div>{t("documents.errors.nodocuments")}</div>
           )}
-        </UpsellComponent>
+        </>
       )}
     </CardTemplate>
   );