From 24872e6c2a8a610b3f3cee9513288d01995a8a64 Mon Sep 17 00:00:00 2001
From: Deluan <deluan@navidrome.org>
Date: Mon, 27 Sep 2021 09:47:16 -0400
Subject: [PATCH] Fix biography word wrapping and requests for `undefined`
 resource

---
 ui/src/artist/ArtistShow.js | 26 +++++++++++++++-----------
 1 file changed, 15 insertions(+), 11 deletions(-)

diff --git a/ui/src/artist/ArtistShow.js b/ui/src/artist/ArtistShow.js
index 8f871eeaf..4945c1660 100644
--- a/ui/src/artist/ArtistShow.js
+++ b/ui/src/artist/ArtistShow.js
@@ -53,7 +53,7 @@ const useStyles = makeStyles(
       display: 'inline-block',
       marginTop: '1em',
       float: 'left',
-      wordBreak: 'break-all',
+      wordBreak: 'break-word',
       cursor: 'pointer',
     },
     link: {
@@ -185,11 +185,13 @@ const ArtistDetails = () => {
       <div className={classes.root}>
         <div className={classes.bgContainer}>
           <Card className={classes.martImage}>
-            <CardMedia
-              className={classes.cover}
-              image={`${artistInfo?.mediumImageUrl}`}
-              title={title}
-            />
+            {artistInfo && (
+              <CardMedia
+                className={classes.cover}
+                image={`${artistInfo.mediumImageUrl}`}
+                title={title}
+              />
+            )}
           </Card>
           <div className={classes.mdetails}>
             <Typography component="h5" variant="h5">
@@ -198,11 +200,13 @@ const ArtistDetails = () => {
           </div>
           <Card className={classes.artDetail}>
             <Card className={classes.artImage}>
-              <CardMedia
-                className={classes.cover}
-                image={`${artistInfo?.mediumImageUrl}`}
-                title={title}
-              />
+              {artistInfo && (
+                <CardMedia
+                  className={classes.cover}
+                  image={`${artistInfo.mediumImageUrl}`}
+                  title={title}
+                />
+              )}
             </Card>
             <div className={classes.details}>
               <CardContent className={classes.content}>