From 410ca6cb772ff9e42050316543893ff16c32e0de Mon Sep 17 00:00:00 2001
From: Richard Hand <pid90611@adobe.com>
Date: Thu, 25 Jul 2024 17:24:53 +0200
Subject: [PATCH 1/4] MWPW-155065 PartnerCards fallback for invalid thumbnail
 images

- checks news card background image on first updated
- replace with a hardcoded default image path
- changes the background color of the card header to prevent FOUC
---
 edsdme/components/NewsCard.js           | 24 +++++++++++++++++++++++-
 edsdme/components/PartnerCardsStyles.js |  2 +-
 2 files changed, 24 insertions(+), 2 deletions(-)

diff --git a/edsdme/components/NewsCard.js b/edsdme/components/NewsCard.js
index ac8afaf..07c5657 100644
--- a/edsdme/components/NewsCard.js
+++ b/edsdme/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 } };
 
@@ -24,6 +26,26 @@ class NewsCard extends LitElement {
     return newUrl;
   }
 
+  checkBackgroundImage(element) {
+    const style = window.getComputedStyle(element);
+    const url = style.backgroundImage.slice(5, -2);
+    const img = new Image();
+
+    const isProd = prodHosts.includes(window.location.host);
+    const defaultBackgroundImageOrigin = `https://solutionpartners.${isProd ? '' : 'stage2.'}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">
diff --git a/edsdme/components/PartnerCardsStyles.js b/edsdme/components/PartnerCardsStyles.js
index 5a5a975..14cf9a7 100644
--- a/edsdme/components/PartnerCardsStyles.js
+++ b/edsdme/components/PartnerCardsStyles.js
@@ -999,7 +999,7 @@ export const newsCardStyles = css`
   .news-card .card-header {
     min-height: 192px;
     max-height: 192px;
-    background-color: #323232;
+    background-color: #f5f5F5;
     background-repeat: no-repeat;
     background-position: 50% 50%;
     background-size: cover;

From dd1134dfadda172aa7acdd69d1425a533a98b085 Mon Sep 17 00:00:00 2001
From: Richard Hand <pid90611@adobe.com>
Date: Thu, 25 Jul 2024 17:58:17 +0200
Subject: [PATCH 2/4] MWPW-155065 PartnerCards fallback for invalid thumbnail
 images

- reverts change in default background color for thumbnails
---
 edsdme/components/PartnerCardsStyles.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/edsdme/components/PartnerCardsStyles.js b/edsdme/components/PartnerCardsStyles.js
index 14cf9a7..5a5a975 100644
--- a/edsdme/components/PartnerCardsStyles.js
+++ b/edsdme/components/PartnerCardsStyles.js
@@ -999,7 +999,7 @@ export const newsCardStyles = css`
   .news-card .card-header {
     min-height: 192px;
     max-height: 192px;
-    background-color: #f5f5F5;
+    background-color: #323232;
     background-repeat: no-repeat;
     background-position: 50% 50%;
     background-size: cover;

From 9d2fc90a0bcd73748636d393d180093c575b13be Mon Sep 17 00:00:00 2001
From: Ben Zahler <ben@hitthecode.com>
Date: Thu, 25 Jul 2024 18:22:07 +0200
Subject: [PATCH 3/4] tiny fix to use the domain used for TPP and for MILO

---
 edsdme/components/NewsCard.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/edsdme/components/NewsCard.js b/edsdme/components/NewsCard.js
index 07c5657..e7c2bb8 100644
--- a/edsdme/components/NewsCard.js
+++ b/edsdme/components/NewsCard.js
@@ -32,7 +32,7 @@ class NewsCard extends LitElement {
     const img = new Image();
 
     const isProd = prodHosts.includes(window.location.host);
-    const defaultBackgroundImageOrigin = `https://solutionpartners.${isProd ? '' : 'stage2.'}adobe.com`;
+    const defaultBackgroundImageOrigin = `https://partners.${isProd ? '' : 'stage.'}adobe.com`;
     const defaultBackgroundImageUrl = `${defaultBackgroundImageOrigin}${DEFAULT_BACKGROUND_IMAGE_PATH}`;
 
     img.onerror = () => {

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

- PR feedback, use styles to read background image urls
---
 edsdme/components/NewsCard.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/edsdme/components/NewsCard.js b/edsdme/components/NewsCard.js
index e7c2bb8..c7a2952 100644
--- a/edsdme/components/NewsCard.js
+++ b/edsdme/components/NewsCard.js
@@ -27,8 +27,7 @@ class NewsCard extends LitElement {
   }
 
   checkBackgroundImage(element) {
-    const style = window.getComputedStyle(element);
-    const url = style.backgroundImage.slice(5, -2);
+    const url = this.data.styles?.backgroundImage;
     const img = new Image();
 
     const isProd = prodHosts.includes(window.location.host);