From 970138318a9cdd9b9976f7cccb283b624f09a725 Mon Sep 17 00:00:00 2001
From: Richard Hand <pid90611@adobe.com>
Date: Mon, 29 Jul 2024 13:57:48 +0200
Subject: [PATCH] MWPW-155065 PartnerCards fallback for invalid thumbnail
 images

- checks news card background image on first updated
- replace with a default
---
 eds/components/NewsCard.js | 23 ++++++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/eds/components/NewsCard.js b/eds/components/NewsCard.js
index 362fe88..71ae5f1 100644
--- a/eds/components/NewsCard.js
+++ b/eds/components/NewsCard.js
@@ -1,9 +1,11 @@
 import { newsCardStyles } from './PartnerCardsStyles.js';
-import { formatDate, getLibs } from '../scripts/utils.js';
+import { formatDate, getLibs, prodHosts } from '../scripts/utils.js';
 
 const miloLibs = getLibs();
 const { html, LitElement } = await import(`${miloLibs}/deps/lit-all.min.js`);
 
+const DEFAULT_BACKGROUND_IMAGE_PATH = '/content/dam/solution/en/images/card-collection/sample_default.png';
+
 class NewsCard extends LitElement {
   static properties = { data: { type: Object } };
 
@@ -23,6 +25,25 @@ class NewsCard extends LitElement {
     return newUrl;
   }
 
+  checkBackgroundImage(element) {
+    const url = this.data.styles?.backgroundImage;
+    const img = new Image();
+
+    const isProd = prodHosts.includes(window.location.host);
+    const defaultBackgroundImageOrigin = `https://partners.${isProd ? '' : 'stage.'}adobe.com`;
+    const defaultBackgroundImageUrl = `${defaultBackgroundImageOrigin}${DEFAULT_BACKGROUND_IMAGE_PATH}`;
+
+    img.onerror = () => {
+      element.style.backgroundImage = `url(${defaultBackgroundImageUrl})`;
+    };
+
+    img.src = url;
+  }
+
+  firstUpdated() {
+    this.checkBackgroundImage(this.shadowRoot.querySelector('.card-header'));
+  }
+
   render() {
     return html`
       <div class="news-card">