Differentiate between failed thumbnail url and emtpy url images.
This commit is contained in:
parent
884cad936f
commit
ad0c356c1e
1 changed files with 10 additions and 4 deletions
|
@ -18,6 +18,7 @@ type Props = {
|
||||||
|
|
||||||
type State = {
|
type State = {
|
||||||
thumbnailError: boolean,
|
thumbnailError: boolean,
|
||||||
|
thumbnailErrorImage: string,
|
||||||
};
|
};
|
||||||
|
|
||||||
class SelectThumbnail extends React.PureComponent<Props, State> {
|
class SelectThumbnail extends React.PureComponent<Props, State> {
|
||||||
|
@ -26,6 +27,7 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
|
||||||
|
|
||||||
this.state = {
|
this.state = {
|
||||||
thumbnailError: false,
|
thumbnailError: false,
|
||||||
|
thumbnailErrorImage: 'no-thumbnail.png',
|
||||||
};
|
};
|
||||||
|
|
||||||
(this: any).handleThumbnailChange = this.handleThumbnailChange.bind(this);
|
(this: any).handleThumbnailChange = this.handleThumbnailChange.bind(this);
|
||||||
|
@ -36,7 +38,7 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
|
||||||
const newThumbnail = e.target.value.replace(' ', '');
|
const newThumbnail = e.target.value.replace(' ', '');
|
||||||
|
|
||||||
updatePublishForm({ thumbnail: newThumbnail });
|
updatePublishForm({ thumbnail: newThumbnail });
|
||||||
this.setState({ thumbnailError: false });
|
this.setState({ thumbnailError: false, thumbnailErrorImage: 'no-thumbnail.png' });
|
||||||
}
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
|
@ -49,9 +51,9 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
|
||||||
thumbnailPath,
|
thumbnailPath,
|
||||||
resetThumbnailStatus,
|
resetThumbnailStatus,
|
||||||
} = this.props;
|
} = this.props;
|
||||||
const { thumbnailError } = this.state;
|
const { thumbnailError, thumbnailErrorImage } = this.state;
|
||||||
const thumbnailSrc =
|
const thumbnailSrc =
|
||||||
!thumbnail || thumbnailError ? Native.imagePath('no-thumbnail.png') : thumbnail;
|
!thumbnail || thumbnailError ? Native.imagePath(thumbnailErrorImage) : thumbnail;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="card__content">
|
<div className="card__content">
|
||||||
|
@ -62,7 +64,11 @@ class SelectThumbnail extends React.PureComponent<Props, State> {
|
||||||
className="column__item thumbnail-preview"
|
className="column__item thumbnail-preview"
|
||||||
alt={__('Thumbnail Preview')}
|
alt={__('Thumbnail Preview')}
|
||||||
onError={() => {
|
onError={() => {
|
||||||
this.setState({ thumbnailError: true });
|
this.setState({
|
||||||
|
thumbnailError: true,
|
||||||
|
thumbnailErrorImage:
|
||||||
|
thumbnail && thumbnail.length > 0 ? 'warning.png' : 'no-thumbnail.png',
|
||||||
|
});
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
<div className="column__item">
|
<div className="column__item">
|
||||||
|
|
Loading…
Reference in a new issue