Merge pull request #1829 from dan1d/issue-1808

Differentiate between failed thumbnail url and emtpy url images.
This commit is contained in:
Shawn K 2018-07-30 18:03:20 -05:00 committed by GitHub
commit 944f74a287
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 10 additions and 4 deletions

View file

@ -18,6 +18,7 @@ type Props = {
type State = {
thumbnailError: boolean,
thumbnailErrorImage: string,
};
class SelectThumbnail extends React.PureComponent<Props, State> {
@ -26,6 +27,7 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
this.state = {
thumbnailError: false,
thumbnailErrorImage: 'no-thumbnail.png',
};
(this: any).handleThumbnailChange = this.handleThumbnailChange.bind(this);
@ -36,7 +38,7 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
const newThumbnail = e.target.value.replace(' ', '');
updatePublishForm({ thumbnail: newThumbnail });
this.setState({ thumbnailError: false });
this.setState({ thumbnailError: false, thumbnailErrorImage: 'no-thumbnail.png' });
}
render() {
@ -49,9 +51,9 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
thumbnailPath,
resetThumbnailStatus,
} = this.props;
const { thumbnailError } = this.state;
const { thumbnailError, thumbnailErrorImage } = this.state;
const thumbnailSrc =
!thumbnail || thumbnailError ? Native.imagePath('no-thumbnail.png') : thumbnail;
!thumbnail || thumbnailError ? Native.imagePath(thumbnailErrorImage) : thumbnail;
return (
<div className="card__content">
@ -62,7 +64,11 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
className="column__item thumbnail-preview"
alt={__('Thumbnail Preview')}
onError={() => {
this.setState({ thumbnailError: true });
this.setState({
thumbnailError: true,
thumbnailErrorImage:
thumbnail && thumbnail.length > 0 ? 'broken.png' : 'no-thumbnail.png',
});
}}
/>
<div className="column__item">

BIN
static/img/broken.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.5 KiB