diff --git a/news/91.bugfix b/news/91.bugfix new file mode 100644 index 0000000..0489d46 --- /dev/null +++ b/news/91.bugfix @@ -0,0 +1 @@ +Fix teaser Image Override when there is a custom Image component. @davisagli diff --git a/src/components/Teaser/DefaultBody.jsx b/src/components/Teaser/DefaultBody.jsx index 49fa5a4..e9c9e9c 100644 --- a/src/components/Teaser/DefaultBody.jsx +++ b/src/components/Teaser/DefaultBody.jsx @@ -18,20 +18,30 @@ const messages = defineMessages({ }, }); -const DefaultImage = (props) => {props.alt; - const TeaserDefaultTemplate = (props) => { const { className, data, isEditMode } = props; const intl = useIntl(); const href = data.href?.[0]; - const image = data.preview_image?.[0]; + const imageOverride = data.preview_image?.[0]; const align = data?.styles?.align; - - const hasImageComponent = config.getComponent('Image').component; - const Image = config.getComponent('Image').component || DefaultImage; const { openExternalLinkInNewTab } = config.settings; - const defaultImageSrc = - href && flattenToAppURL(getTeaserImageURL({ href, image, align })); + + let renderedImage = null; + if (href && (imageOverride || href.hasPreviewImage || href.image_field)) { + let Image = config.getComponent('Image').component; + if (Image) { + // custom image component expects item summary as src + renderedImage = ( + + ); + } else { + // default img expects string src + const src = flattenToAppURL( + getTeaserImageURL({ href, imageOverride, align }), + ); + renderedImage = ; + } + } return (
@@ -57,14 +67,8 @@ const TeaserDefaultTemplate = (props) => { } >
- {(href.hasPreviewImage || href.image_field || image) && ( -
- -
+ {renderedImage && ( +
{renderedImage}
)}
{data?.head_title && (