From f913f5ec32c17f579b68b2a1d81c05ae4dd7b1f8 Mon Sep 17 00:00:00 2001
From: schroda <50052685+schroda@users.noreply.github.com>
Date: Sun, 10 Mar 2024 14:33:55 +0100
Subject: [PATCH] Show image placeholder
Instead of trying to load invalid url
---
src/components/util/SpinnerImage.tsx | 40 ++++++++++++++++++++--------
1 file changed, 29 insertions(+), 11 deletions(-)
diff --git a/src/components/util/SpinnerImage.tsx b/src/components/util/SpinnerImage.tsx
index 0cda0f3c..569b9d08 100644
--- a/src/components/util/SpinnerImage.tsx
+++ b/src/components/util/SpinnerImage.tsx
@@ -14,6 +14,7 @@ import { Theme, SxProps, Stack, Button } from '@mui/material';
import BrokenImageIcon from '@mui/icons-material/BrokenImage';
import RefreshIcon from '@mui/icons-material/Refresh';
import { useTranslation } from 'react-i18next';
+import ImageIcon from '@mui/icons-material/Image';
import { requestManager } from '@/lib/requests/RequestManager.ts';
import { defaultPromiseErrorHandler } from '@/util/defaultPromiseErrorHandler.ts';
import { Priority } from '@/lib/Queue.ts';
@@ -33,6 +34,8 @@ export const SpinnerImage = forwardRef((props: IProps, imgRef: ForwardedRef(undefined);
@@ -48,6 +51,10 @@ export const SpinnerImage = forwardRef((props: IProps, imgRef: ForwardedRef {
+ if (showMissingImageIcon) {
+ return () => {};
+ }
+
let tmpImageSourceUrl: string;
const imageRequest = requestManager.requestImage(src, Priority.HIGH);
let cacheTimeout: NodeJS.Timeout;
@@ -121,17 +128,28 @@ export const SpinnerImage = forwardRef((props: IProps, imgRef: ForwardedRef
)}
- 
+ {showMissingImageIcon ? (
+ theme.palette.background.default }}
+ >
+
+
+ ) : (
+
+ )}
);
});