Merge branch 'master' into sophie-report-manager

2 files changed, 61 insertions, 9 deletions

diff --git a/src/client/views/pdf/GPTPopup/GPTPopup.scss b/src/client/views/pdf/GPTPopup/GPTPopup.scss
index 44413ede7..5d966395c 100644
--- a/src/client/views/pdf/GPTPopup/GPTPopup.scss
+++ b/src/client/views/pdf/GPTPopup/GPTPopup.scss
@@ -6,12 +6,6 @@ $button: #5b97ff;
 $highlightedText: #82e0ff;
 
 .summary-box {
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    background-color: #ffffff;
-    box-shadow: 0 2px 5px #7474748d;
-    color: $textgrey;
     position: fixed;
     bottom: 10px;
     right: 10px;
@@ -21,9 +15,16 @@ $highlightedText: #82e0ff;
     padding: 15px;
     padding-bottom: 0;
     z-index: 999;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    background-color: #ffffff;
+    box-shadow: 0 2px 5px #7474748d;
+    color: $textgrey;
 
     .summary-heading {
         display: flex;
+        justify-content: space-between;
         align-items: center;
         border-bottom: 1px solid $greyborder;
         padding-bottom: 5px;
@@ -110,6 +111,59 @@ $highlightedText: #82e0ff;
     }
 }
 
+.image-content-wrapper {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 8px;
+    padding-bottom: 16px;
+
+    .img-wrapper {
+        position: relative;
+        cursor: pointer;
+
+        .img-container {
+            pointer-events: none;
+            position: relative;
+
+            img {
+                pointer-events: all;
+                position: relative;
+            }
+        }
+
+        .img-container::after {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background-color: rgba(0, 0, 0, 0.5);
+            opacity: 0;
+            transition: opacity 0.3s ease;
+        }
+
+        .btn-container {
+            position: absolute;
+            right: 8px;
+            bottom: 8px;
+            opacity: 0;
+            transition: opacity 0.3s ease;
+        }
+
+        &:hover {
+            .img-container::after {
+                opacity: 1;
+            }
+
+            .btn-container {
+                opacity: 1;
+            }
+        }
+    }
+}
+
 // Typist CSS
 .Typist .Cursor {
     display: inline-block;
diff --git a/src/client/views/pdf/GPTPopup/GPTPopup.tsx b/src/client/views/pdf/GPTPopup/GPTPopup.tsx
index 9b754588a..038c45582 100644
--- a/src/client/views/pdf/GPTPopup/GPTPopup.tsx
+++ b/src/client/views/pdf/GPTPopup/GPTPopup.tsx
@@ -118,15 +118,13 @@ export class GPTPopup extends React.Component<GPTPopupProps> {
         try {
             let image_urls = await gptImageCall(this.imgDesc);
             if (image_urls && image_urls[0]) {
-                // need to fix this
                 const [result] = await Networking.PostToServer('/uploadRemoteImage', { sources: [image_urls[0]] });
-                console.log('Result', result);
-                console.log('Client', result.accessPaths.agnostic.client);
                 const source = Utils.prepend(result.accessPaths.agnostic.client);
                 this.setImgUrls([[image_urls[0], source]]);
             }
         } catch (err) {
             console.log(err);
+            return '';
         }
         GPTPopup.Instance.setLoading(false);
     };