[Glitch] Fix display of failed-to-load image attachments in web UI

Port changes from 1960aac90b to glitch-soc

Signed-off-by: Claire <claire.github-309c@sitedethib.com>
This commit is contained in:
Eugen Rochko
2025-03-21 11:23:49 +01:00
committed by Claire
parent e63d474eb8
commit afb0294826
3 changed files with 23 additions and 2 deletions

View File

@@ -39,6 +39,7 @@ class Item extends PureComponent {
state = {
loaded: false,
error: false,
};
handleMouseEnter = (e) => {
@@ -82,6 +83,10 @@ class Item extends PureComponent {
this.setState({ loaded: true });
};
handleImageError = () => {
this.setState({ error: true });
};
render () {
const { attachment, lang, index, size, standalone, letterbox, displayWidth, visible } = this.props;
@@ -150,6 +155,7 @@ class Item extends PureComponent {
lang={lang}
style={{ objectPosition: letterbox ? null : `${x}% ${y}%` }}
onLoad={this.handleImageLoad}
onError={this.handleImageError}
/>
</a>
);
@@ -185,7 +191,7 @@ class Item extends PureComponent {
}
return (
<div className={classNames('media-gallery__item', { standalone, letterbox, 'media-gallery__item--tall': height === 100, 'media-gallery__item--wide': width === 100 })} key={attachment.get('id')}>
<div className={classNames('media-gallery__item', { standalone, letterbox, 'media-gallery__item--error': this.state.error, 'media-gallery__item--tall': height === 100, 'media-gallery__item--wide': width === 100 })} key={attachment.get('id')}>
<Blurhash
hash={attachment.get('blurhash')}
dummy={!useBlurhash}