From b8d2e207cdefd018824229975ac0f5ac0bdb8d0c Mon Sep 17 00:00:00 2001
From: Sara Bianchi <43245702+SaraBianchi@users.noreply.github.com>
Date: Tue, 31 Oct 2023 10:15:36 +0100
Subject: [PATCH] fix: fixed image url in Photogallery listing popup (#383)

* fix: fixed image url in Photogallery listing popup

* chore: updated checkUrlImage condition
---
 .../Blocks/Listing/PhotogalleryTemplate.jsx      | 16 ++++++++--------
 .../GalleryPreview/GalleryPreview.jsx            | 11 ++++++-----
 2 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx b/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx
index 1bd3f0819..950c6feee 100644
--- a/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx
+++ b/src/components/ItaliaTheme/Blocks/Listing/PhotogalleryTemplate.jsx
@@ -10,8 +10,6 @@ import {
 } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import React, { useRef, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-
-import DefaultImageSVG from '@plone/volto/components/manage/Blocks/Listing/default-image.svg';
 import { GalleryPreview } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import { Icon } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import PropTypes from 'prop-types';
@@ -139,12 +137,14 @@ const PhotogalleryTemplate = ({
 
   const getCaption = (item) => item.description ?? item.rights ?? null;
 
-  const figure = (image, item) => (
-    <figure className="img-wrapper">
-      {image ? <>{image}</> : <img src={DefaultImageSVG} alt="" />}
-      {getCaption(item) && <figcaption>{getCaption(item)}</figcaption>}
-    </figure>
-  );
+  const figure = (image, item) => {
+    return (
+      <figure className="img-wrapper">
+        {image}
+        {getCaption(item) && <figcaption>{getCaption(item)}</figcaption>}
+      </figure>
+    );
+  };
 
   return (
     <div className="photogallery">
diff --git a/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx b/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx
index 78a950fd0..a6a618578 100644
--- a/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx
+++ b/src/components/ItaliaTheme/GalleryPreview/GalleryPreview.jsx
@@ -3,7 +3,6 @@ import { defineMessages, useIntl } from 'react-intl';
 import { flattenToAppURL } from '@plone/volto/helpers';
 
 import PropTypes from 'prop-types';
-
 import { Modal, ModalBody, Button, ModalHeader } from 'design-react-kit';
 import { Icon } from 'design-comuni-plone-theme/components/ItaliaTheme';
 import DefaultImageSVG from '@plone/volto/components/manage/Blocks/Listing/default-image.svg';
@@ -34,6 +33,10 @@ const GalleryPreview = ({ id, viewIndex, setViewIndex, items }) => {
   const intl = useIntl();
   const [modalIsOpen, setModalIsOpen] = useState(false);
 
+  const checkUrlImage =
+    items[viewIndex]?.image?.scales?.larger?.download ||
+    items[viewIndex]?.image_scales?.image[0]?.scales?.larger?.download;
+
   const closeModal = () => {
     setViewIndex(null);
   };
@@ -92,11 +95,9 @@ const GalleryPreview = ({ id, viewIndex, setViewIndex, items }) => {
                 </Button>
               )}
               <div className="image">
-                {items[viewIndex].image ? (
+                {checkUrlImage ? (
                   <img
-                    src={flattenToAppURL(
-                      items[viewIndex].image.scales.larger.download,
-                    )}
+                    src={flattenToAppURL(checkUrlImage)}
                     loading="lazy"
                     alt={items[viewIndex].title}
                   />