From 07451cbcdebd43eac0a92b240ee28d641d5dd0a5 Mon Sep 17 00:00:00 2001
From: Bogdan <mynameisbogdan@users.noreply.github.com>
Date: Tue, 27 Jun 2023 01:23:18 +0300
Subject: [PATCH] Fixed: Invalid image URL if Author/Book is missing background
 image

(cherry picked from commit dd096e0fda71b3afa9b09c2900abbf226d8a5204)

Closes #2625
---
 frontend/src/Author/Details/AuthorDetailsHeader.js | 9 ++++++---
 frontend/src/Book/Details/BookDetailsHeader.js     | 9 ++++++---
 2 files changed, 12 insertions(+), 6 deletions(-)

diff --git a/frontend/src/Author/Details/AuthorDetailsHeader.js b/frontend/src/Author/Details/AuthorDetailsHeader.js
index 870030ca4..2502e896a 100644
--- a/frontend/src/Author/Details/AuthorDetailsHeader.js
+++ b/frontend/src/Author/Details/AuthorDetailsHeader.js
@@ -92,6 +92,7 @@ class AuthorDetailsHeader extends Component {
       titleWidth
     } = this.state;
 
+    const fanartUrl = getFanartUrl(images);
     const marqueeWidth = titleWidth - (isSmallScreen ? 85 : 160);
 
     const continuing = status === 'continuing';
@@ -108,9 +109,11 @@ class AuthorDetailsHeader extends Component {
       <div className={styles.header} style={{ width }} >
         <div
           className={styles.backdrop}
-          style={{
-            backgroundImage: `url(${getFanartUrl(images)})`
-          }}
+          style={
+            fanartUrl ?
+              { backgroundImage: `url(${fanartUrl})` } :
+              null
+          }
         >
           <div className={styles.backdropOverlay} />
         </div>
diff --git a/frontend/src/Book/Details/BookDetailsHeader.js b/frontend/src/Book/Details/BookDetailsHeader.js
index a144a408a..868aff9a3 100644
--- a/frontend/src/Book/Details/BookDetailsHeader.js
+++ b/frontend/src/Book/Details/BookDetailsHeader.js
@@ -83,15 +83,18 @@ class BookDetailsHeader extends Component {
       titleWidth
     } = this.state;
 
+    const fanartUrl = getFanartUrl(author.images);
     const marqueeWidth = titleWidth - (isSmallScreen ? 85 : 160);
 
     return (
       <div className={styles.header} style={{ width }}>
         <div
           className={styles.backdrop}
-          style={{
-            backgroundImage: `url(${getFanartUrl(author.images)})`
-          }}
+          style={
+            fanartUrl ?
+              { backgroundImage: `url(${fanartUrl})` } :
+              null
+          }
         >
           <div className={styles.backdropOverlay} />
         </div>