diff --git a/ui/component/channelThumbnail/transparent_1x1.png b/ui/component/channelThumbnail/transparent_1x1.png new file mode 100644 index 000000000..fdf950d0d Binary files /dev/null and b/ui/component/channelThumbnail/transparent_1x1.png differ diff --git a/ui/component/channelThumbnail/view.jsx b/ui/component/channelThumbnail/view.jsx index bc0d56441..fa89e839f 100644 --- a/ui/component/channelThumbnail/view.jsx +++ b/ui/component/channelThumbnail/view.jsx @@ -3,6 +3,7 @@ import React from 'react'; import { parseURI } from 'lbry-redux'; import classnames from 'classnames'; import Gerbil from './gerbil.png'; +import Transparent from './transparent_1x1.png'; import FreezeframeWrapper from 'component/fileThumbnail/FreezeframeWrapper'; import ChannelStakedIndicator from 'component/channelStakedIndicator'; import { getThumbnailCdnUrl } from 'util/thumbnail'; @@ -100,6 +101,7 @@ function ChannelThumbnail(props: Props) { alt={__('Channel profile picture')} className="channel-thumbnail__default" data-src={!thumbError && url ? url : Gerbil} + src={Transparent} onError={() => setThumbError(true)} // if thumb fails (including due to https replace, show gerbil. /> )} @@ -113,6 +115,7 @@ function ChannelThumbnail(props: Props) { alt={__('Channel profile picture')} className="channel-thumbnail__custom" data-src={!thumbError && url ? url : Gerbil} + src={Transparent} onError={() => setThumbError(true)} // if thumb fails (including due to https replace, show gerbil. /> )}