Fix display of failed-to-load image attachments in web UI (#34217)

This commit is contained in:
Eugen Rochko 2025-03-21 11:23:49 +01:00 committed by GitHub
parent a2981a0997
commit 1960aac90b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 23 additions and 2 deletions

View file

@ -26,11 +26,16 @@ export const MediaItem: React.FC<{
displayMedia === 'show_all',
);
const [loaded, setLoaded] = useState(false);
const [error, setError] = useState(false);
const handleImageLoad = useCallback(() => {
setLoaded(true);
}, [setLoaded]);
const handleImageError = useCallback(() => {
setError(true);
}, [setError]);
const handleMouseEnter = useCallback(
(e: React.MouseEvent<HTMLVideoElement>) => {
if (e.target instanceof HTMLVideoElement) {
@ -98,6 +103,7 @@ export const MediaItem: React.FC<{
alt={description}
lang={lang}
onLoad={handleImageLoad}
onError={handleImageError}
/>
<div className='media-gallery__item__overlay media-gallery__item__overlay--corner'>
@ -118,6 +124,7 @@ export const MediaItem: React.FC<{
lang={lang}
style={{ objectPosition: `${x}% ${y}%` }}
onLoad={handleImageLoad}
onError={handleImageError}
/>
);
} else if (['video', 'gifv'].includes(type)) {
@ -173,7 +180,11 @@ export const MediaItem: React.FC<{
}
return (
<div className='media-gallery__item media-gallery__item--square'>
<div
className={classNames('media-gallery__item media-gallery__item--square', {
'media-gallery__item--error': error,
})}
>
<Blurhash
hash={blurhash}
className={classNames('media-gallery__preview', {