From bbc3bbabca9fbab717b9e848ec7e7741a9881e7a Mon Sep 17 00:00:00 2001
From: SleeplessOne1917 <28871516+SleeplessOne1917@users.noreply.github.com>
Date: Sat, 20 Apr 2024 14:11:01 -0400
Subject: [PATCH] Add fallback image for broken images

---
 src/assets/images/broken-image-fallback.png   | Bin 0 -> 8399 bytes
 src/assets/symbols.svg                        |   7 +++-
 src/shared/components/common/pictrs-image.tsx |  36 +++++++++++++++---
 3 files changed, 35 insertions(+), 8 deletions(-)
 create mode 100644 src/assets/images/broken-image-fallback.png

diff --git a/src/assets/images/broken-image-fallback.png b/src/assets/images/broken-image-fallback.png
new file mode 100644
index 0000000000000000000000000000000000000000..84e828fbf71b6c024de45c64a08df31f27ccd180
GIT binary patch
literal 8399
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
M2m`IEKOLU^53*)PTmS$7

literal 0
HcmV?d00001

diff --git a/src/assets/symbols.svg b/src/assets/symbols.svg
index 87d63361..c9fda729 100644
--- a/src/assets/symbols.svg
+++ b/src/assets/symbols.svg
@@ -170,8 +170,11 @@
     <symbol id="icon-message-square" viewBox="0 0 24 24">
       <path d="M22 15v-10c0-0.828-0.337-1.58-0.879-2.121s-1.293-0.879-2.121-0.879h-14c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v16c0 0.256 0.098 0.512 0.293 0.707 0.391 0.391 1.024 0.391 1.414 0l3.707-3.707h11.586c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121zM20 15c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293h-12c-0.276 0-0.526 0.112-0.707 0.293l-2.293 2.293v-13.586c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h14c0.276 0 0.525 0.111 0.707 0.293s0.293 0.431 0.293 0.707z"/>
     </symbol>
-    <symbol id="icon-image" viewBox="0 0 24 24">
-      <path d="M5 2c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v14c0 0.828 0.337 1.58 0.879 2.121s1.293 0.879 2.121 0.879h14c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121v-14c0-0.828-0.337-1.58-0.879-2.121s-1.293-0.879-2.121-0.879zM11 8.5c0-0.69-0.281-1.316-0.732-1.768s-1.078-0.732-1.768-0.732-1.316 0.281-1.768 0.732-0.732 1.078-0.732 1.768 0.281 1.316 0.732 1.768 1.078 0.732 1.768 0.732 1.316-0.281 1.768-0.732 0.732-1.078 0.732-1.768zM9 8.5c0 0.138-0.055 0.262-0.146 0.354s-0.216 0.146-0.354 0.146-0.262-0.055-0.354-0.146-0.146-0.216-0.146-0.354 0.055-0.262 0.146-0.354 0.216-0.146 0.354-0.146 0.262 0.055 0.354 0.146 0.146 0.216 0.146 0.354zM7.414 20l8.586-8.586 4 4v3.586c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293zM20 12.586l-3.293-3.293c-0.391-0.391-1.024-0.391-1.414 0l-10.644 10.644c-0.135-0.050-0.255-0.129-0.356-0.23-0.182-0.182-0.293-0.431-0.293-0.707v-14c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h14c0.276 0 0.525 0.111 0.707 0.293s0.293 0.431 0.293 0.707z"/>
+    <symbol id="icon-image" viewBox="0 0 256 256">
+      <path d="M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40Zm0,16V158.75l-26.07-26.06a16,16,0,0,0-22.63,0l-20,20-44-44a16,16,0,0,0-22.62,0L40,149.37V56ZM40,172l52-52,80,80H40Zm176,28H194.63l-36-36,20-20L216,181.38V200ZM144,100a12,12,0,1,1,12,12A12,12,0,0,1,144,100Z" />
+    </symbol>
+    <symbol id="icon-image-broken" viewBox="0 0 256 256">
+      <path d="M216,40H40A16,16,0,0,0,24,56V200a16,16,0,0,0,16,16h64a8,8,0,0,0,7.59-5.47l14.83-44.48L163,151.43a8.07,8.07,0,0,0,4.46-4.46l14.62-36.55,44.48-14.83A8,8,0,0,0,232,88V56A16,16,0,0,0,216,40ZM112.41,157.47,98.23,200H40V172l52-52,30.42,30.42L117,152.57A8,8,0,0,0,112.41,157.47ZM216,82.23,173.47,96.41a8,8,0,0,0-4.9,4.62l-14.72,36.82L138.58,144l-35.27-35.27a16,16,0,0,0-22.62,0L40,149.37V56H216Zm12.68,33a8,8,0,0,0-7.21-1.1l-23.8,7.94a8,8,0,0,0-4.9,4.61l-14.31,35.77-35.77,14.31a8,8,0,0,0-4.61,4.9l-7.94,23.8A8,8,0,0,0,137.73,216H216a16,16,0,0,0,16-16V121.73A8,8,0,0,0,228.68,115.24ZM216,200H148.83l3.25-9.75,35.51-14.2a8.07,8.07,0,0,0,4.46-4.46l14.2-35.51,9.75-3.25Z" />
     </symbol>
     <symbol id="icon-external-link" viewBox="0 0 24 24">
       <path d="M17 13v6c0 0.276-0.111 0.525-0.293 0.707s-0.431 0.293-0.707 0.293h-11c-0.276 0-0.525-0.111-0.707-0.293s-0.293-0.431-0.293-0.707v-11c0-0.276 0.111-0.525 0.293-0.707s0.431-0.293 0.707-0.293h6c0.552 0 1-0.448 1-1s-0.448-1-1-1h-6c-0.828 0-1.58 0.337-2.121 0.879s-0.879 1.293-0.879 2.121v11c0 0.828 0.337 1.58 0.879 2.121s1.293 0.879 2.121 0.879h11c0.828 0 1.58-0.337 2.121-0.879s0.879-1.293 0.879-2.121v-6c0-0.552-0.448-1-1-1s-1 0.448-1 1zM10.707 14.707l9.293-9.293v3.586c0 0.552 0.448 1 1 1s1-0.448 1-1v-6c0-0.136-0.027-0.265-0.076-0.383s-0.121-0.228-0.216-0.323c-0.001-0.001-0.001-0.001-0.002-0.002-0.092-0.092-0.202-0.166-0.323-0.216-0.118-0.049-0.247-0.076-0.383-0.076h-6c-0.552 0-1 0.448-1 1s0.448 1 1 1h3.586l-9.293 9.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0z"/>
diff --git a/src/shared/components/common/pictrs-image.tsx b/src/shared/components/common/pictrs-image.tsx
index 9a5f450e..d942aba6 100644
--- a/src/shared/components/common/pictrs-image.tsx
+++ b/src/shared/components/common/pictrs-image.tsx
@@ -1,9 +1,10 @@
 import classNames from "classnames";
-import { Component } from "inferno";
+import { Component, linkEvent } from "inferno";
 
 import { UserService } from "../../services";
 import { setIsoData } from "@utils/app";
 import { IsoData } from "../../interfaces";
+import { getStaticDir } from "@utils/env";
 
 const iconThumbnailSize = 96;
 const thumbnailSize = 256;
@@ -20,13 +21,35 @@ interface PictrsImageProps {
   cardTop?: boolean;
 }
 
-export class PictrsImage extends Component<PictrsImageProps, any> {
+interface PictrsImageState {
+  src: string;
+}
+
+function handleImgLoadError(i: PictrsImage) {
+  i.setState({
+    src: `${getStaticDir()}/assets/images/broken-image-fallback.png`,
+  });
+}
+
+export class PictrsImage extends Component<PictrsImageProps, PictrsImageState> {
   private readonly isoData: IsoData = setIsoData(this.context);
 
+  state: PictrsImageState = {
+    src: this.props.src,
+  };
+
+  componentDidUpdate(prevProps: PictrsImageProps) {
+    if (prevProps.src !== this.props.src) {
+      this.setState({ src: this.props.src });
+    }
+  }
+
   render() {
-    const { src, icon, iconOverlay, banner, thumbnail, nsfw, pushup, cardTop } =
+    const { icon, iconOverlay, banner, thumbnail, nsfw, pushup, cardTop } =
       this.props;
 
+    const { src } = this.state;
+
     const blurImage =
       nsfw &&
       (UserService.Instance.myUserInfo?.local_user_view.local_user.blur_nsfw ??
@@ -58,6 +81,7 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
               "avatar-pushup": pushup,
               "card-img-top": cardTop,
             })}
+            onError={linkEvent(this, handleImgLoadError)}
           />
         </picture>
       )
@@ -70,14 +94,14 @@ export class PictrsImage extends Component<PictrsImageProps, any> {
 
     let url: URL | undefined;
     try {
-      url = new URL(this.props.src);
+      url = new URL(this.state.src);
     } catch {
-      return this.props.src;
+      return this.state.src;
     }
 
     // If there's no match, then it's not a pictrs image
     if (!url.pathname.includes("/pictrs/image/")) {
-      return this.props.src;
+      return this.state.src;
     }
 
     // Keeps original search params. Could probably do `url.search = ""` here.