From e1a0c4d2dbe49caea0de15663f61b67709d7cc40 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Tue, 21 Mar 2023 15:52:26 +0800
Subject: [PATCH] Don't do anything to "missing" avatars

---
 src/components/avatar.jsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/components/avatar.jsx b/src/components/avatar.jsx
index c2aed8ab..c8b7a962 100644
--- a/src/components/avatar.jsx
+++ b/src/components/avatar.jsx
@@ -16,6 +16,7 @@ const alphaCache = {};
 function Avatar({ url, size, alt = '', ...props }) {
   size = SIZES[size] || size || SIZES.m;
   const avatarRef = useRef();
+  const isMissing = /missing\.png$/.test(url);
   return (
     <span
       ref={avatarRef}
@@ -34,7 +35,11 @@ function Avatar({ url, size, alt = '', ...props }) {
           height={size}
           alt={alt}
           loading="lazy"
-          crossOrigin={alphaCache[url] === undefined ? 'anonymous' : undefined}
+          crossOrigin={
+            alphaCache[url] === undefined && !isMissing
+              ? 'anonymous'
+              : undefined
+          }
           onError={(e) => {
             if (e.target.crossOrigin) {
               e.target.crossOrigin = null;
@@ -44,6 +49,7 @@ function Avatar({ url, size, alt = '', ...props }) {
           onLoad={(e) => {
             if (avatarRef.current) avatarRef.current.dataset.loaded = true;
             if (alphaCache[url] !== undefined) return;
+            if (isMissing) return;
             try {
               // Check if image has alpha channel
               const canvas = document.createElement('canvas');