From 18d135fd9cf7196d5ede94d8a32b3afdfd82a452 Mon Sep 17 00:00:00 2001
From: Franco Montenegro <franco.montenegro.ruke@gmail.com>
Date: Mon, 20 Jun 2022 12:25:41 -0300
Subject: [PATCH] Use a retry counter/limit to fetch thumbnails.

---
 ui/component/channelThumbnail/view.jsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/ui/component/channelThumbnail/view.jsx b/ui/component/channelThumbnail/view.jsx
index cc293a458..b1c8e8e1d 100644
--- a/ui/component/channelThumbnail/view.jsx
+++ b/ui/component/channelThumbnail/view.jsx
@@ -50,6 +50,7 @@ function ChannelThumbnail(props: Props) {
     setThumbUploadError,
     ThumbUploadError,
   } = props;
+  const [retries, setRetries] = React.useState(3);
   const [thumbLoadError, setThumbLoadError] = React.useState(ThumbUploadError);
   const shouldResolve = !isResolving && claim === undefined;
   const thumbnail = rawThumbnail && rawThumbnail.trim().replace(/^http:\/\//i, 'https://');
@@ -58,6 +59,15 @@ function ChannelThumbnail(props: Props) {
   const channelThumbnail = thumbnailPreview || thumbnail || defaultAvatar;
   const isGif = channelThumbnail && channelThumbnail.endsWith('gif');
   const showThumb = (!obscure && !!thumbnail) || thumbnailPreview;
+  const avatarSrc = React.useMemo(() => {
+    if (retries <= 0) {
+      return defaultAvatar;
+    }
+    if (!thumbLoadError) {
+      return channelThumbnail;
+    }
+    return defaultAvatar;
+  }, [retries, thumbLoadError, channelThumbnail, defaultAvatar]);
 
   // Generate a random color class based on the first letter of the channel name
   const { channelName } = parseURI(uri);
@@ -100,9 +110,10 @@ function ChannelThumbnail(props: Props) {
         <OptimizedImage
           alt={__('Channel profile picture')}
           className={!channelThumbnail ? 'channel-thumbnail__default' : 'channel-thumbnail__custom'}
-          src={(!thumbLoadError && channelThumbnail) || defaultAvatar}
+          src={avatarSrc}
           loading={noLazyLoad ? undefined : 'lazy'}
           onError={() => {
+            setRetries((retries) => retries - 1);
             if (setThumbUploadError) {
               setThumbUploadError(true);
             } else {
-- 
2.45.3