From eb4b22a265925d4d5f49e2689aecaa8a04f66677 Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Wed, 15 Mar 2023 15:48:26 +0800
Subject: [PATCH] Make sure at least 10% has alpha

---
 src/components/avatar.jsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/components/avatar.jsx b/src/components/avatar.jsx
index d4e63dbf..a9c2d9c4 100644
--- a/src/components/avatar.jsx
+++ b/src/components/avatar.jsx
@@ -56,9 +56,12 @@ function Avatar({ url, size, alt = '', ...props }) {
                 canvas.width,
                 canvas.height,
               );
-              const hasAlpha = allPixels.data.some((pixel, i) => {
-                return i % 4 === 3 && pixel <= 128;
-              });
+              // At least 10% of pixels have alpha <= 128
+              const hasAlpha =
+                allPixels.data.filter((pixel, i) => i % 4 === 3 && pixel <= 128)
+                  .length /
+                  (allPixels.data.length / 4) >
+                0.1;
               if (hasAlpha) {
                 // console.log('hasAlpha', hasAlpha, allPixels.data);
                 avatarRef.current.classList.add('has-alpha');