hide identicon img on error

This commit is contained in:
Martti Malmi 2023-02-11 17:23:16 +02:00
parent ed7e3a8d9a
commit c0198b136a
2 changed files with 10 additions and 3 deletions

View File

@ -21,6 +21,7 @@ type State = {
name: string | null; name: string | null;
activity: string | null; activity: string | null;
identicon: string | null; identicon: string | null;
hasError: boolean;
}; };
const IdenticonContainer = styled.div` const IdenticonContainer = styled.div`
@ -85,12 +86,19 @@ class MyIdenticon extends Component<Props, State> {
['online', 'active'].indexOf(this.state.activity ?? '') > -1 ? this.state.activity : ''; ['online', 'active'].indexOf(this.state.activity ?? '') > -1 ? this.state.activity : '';
const hasPicture = const hasPicture =
this.state.picture && this.state.picture &&
!this.state.hasError &&
!this.props.hidePicture && !this.props.hidePicture &&
!Nostr.blockedUsers.has(this.props.str as string); !Nostr.blockedUsers.has(this.props.str as string);
const hasPictureStyle = hasPicture ? 'has-picture' : ''; const hasPictureStyle = hasPicture ? 'has-picture' : '';
const showTooltip = this.props.showTooltip ? 'tooltip' : ''; const showTooltip = this.props.showTooltip ? 'tooltip' : '';
const pictureElement = <SafeImg src={this.state.picture} width={width} />; const pictureElement = (
<SafeImg
src={this.state.picture}
width={width}
onError={() => this.setState({ hasError: true })}
/>
);
return ( return (
<IdenticonContainer <IdenticonContainer

View File

@ -1,9 +1,8 @@
import { useState } from 'react';
type Props = { type Props = {
src: string; src: string;
class?: string; class?: string;
width?: number; width?: number;
onError?: () => void;
}; };
// need to have trailing slash, otherwise you could do https://imgur.com.myevilwebsite.com/image.png // need to have trailing slash, otherwise you could do https://imgur.com.myevilwebsite.com/image.png