From 3b7b54b24354f8c2d070184e9e22fe1d4948f9d3 Mon Sep 17 00:00:00 2001
From: Alexander Harding <noreply@harding.dev>
Date: Sat, 7 Dec 2024 14:17:00 -0600
Subject: [PATCH] feat: fallback community icon on error (#1767)

---
 src/features/labels/img/ItemIcon.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/features/labels/img/ItemIcon.tsx b/src/features/labels/img/ItemIcon.tsx
index d5605c596f..7fec3b322d 100644
--- a/src/features/labels/img/ItemIcon.tsx
+++ b/src/features/labels/img/ItemIcon.tsx
@@ -1,4 +1,5 @@
 import { Community, Person } from "lemmy-js-client";
+import { useState } from "react";
 
 import FakeIcon from "#/features/shared/FakeIcon";
 import { cx } from "#/helpers/css";
@@ -19,6 +20,8 @@ export default function ItemIcon({
   className,
   slot,
 }: ItemIconProps) {
+  const [failed, setFailed] = useState(false);
+
   size = size ?? 28;
 
   if (typeof item === "string")
@@ -28,13 +31,16 @@ export default function ItemIcon({
 
   const icon = "posting_restricted_to_mods" in item ? item.icon : item.avatar;
 
-  if (icon)
+  if (icon && !failed)
     return (
       <img
         style={{ width: `${size}px`, height: `${size}px` }}
         src={getImageSrc(icon, {
           size,
         })}
+        onError={() => {
+          setFailed(true);
+        }}
         className={cx(styles.subImgIcon, className)}
         slot={slot}
       />