summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
-rw-r--r--webapp/components/post_view/components/post_body_additional_content.jsx29
-rw-r--r--webapp/components/post_view/components/post_image.jsx6
2 files changed, 25 insertions, 10 deletions
diff --git a/webapp/components/post_view/components/post_body_additional_content.jsx b/webapp/components/post_view/components/post_body_additional_content.jsx
index a65b608d7..e6c1f3b06 100644
--- a/webapp/components/post_view/components/post_body_additional_content.jsx
+++ b/webapp/components/post_view/components/post_body_additional_content.jsx
@@ -22,17 +22,20 @@ export default class PostBodyAdditionalContent extends React.Component {
this.generateStaticEmbed = this.generateStaticEmbed.bind(this);
this.toggleEmbedVisibility = this.toggleEmbedVisibility.bind(this);
this.isLinkToggleable = this.isLinkToggleable.bind(this);
+ this.handleLinkLoadError = this.handleLinkLoadError.bind(this);
this.state = {
embedVisible: props.previewCollapsed.startsWith('false'),
- link: Utils.extractFirstLink(props.post.message)
+ link: Utils.extractFirstLink(props.post.message),
+ linkLoadError: false
};
}
componentWillReceiveProps(nextProps) {
this.setState({
embedVisible: nextProps.previewCollapsed.startsWith('false'),
- link: Utils.extractFirstLink(nextProps.post.message)
+ link: Utils.extractFirstLink(nextProps.post.message),
+ linkLoadError: false
});
}
@@ -46,6 +49,9 @@ export default class PostBodyAdditionalContent extends React.Component {
if (nextState.embedVisible !== this.state.embedVisible) {
return true;
}
+ if (nextState.linkLoadError !== this.state.linkLoadError) {
+ return true;
+ }
return false;
}
@@ -79,12 +85,10 @@ export default class PostBodyAdditionalContent extends React.Component {
}
isLinkImage(link) {
- for (let i = 0; i < Constants.IMAGE_TYPES.length; i++) {
- const imageType = Constants.IMAGE_TYPES[i];
- const suffix = link.substring(link.length - (imageType.length + 1));
- if (suffix === '.' + imageType || suffix === '=' + imageType) {
- return true;
- }
+ const regex = /.+\/(.+\.(?:jpg|gif|bmp|png|jpeg))(?:\?.*)?$/i;
+ const match = link.match(regex);
+ if (match && match[1]) {
+ return true;
}
return false;
@@ -107,6 +111,12 @@ export default class PostBodyAdditionalContent extends React.Component {
return false;
}
+ handleLinkLoadError() {
+ this.setState({
+ linkLoadError: true
+ });
+ }
+
generateToggleableEmbed() {
const link = this.state.link;
if (!link) {
@@ -128,6 +138,7 @@ export default class PostBodyAdditionalContent extends React.Component {
<PostImage
channelId={this.props.post.channel_id}
link={link}
+ onLinkLoadError={this.handleLinkLoadError}
/>
);
}
@@ -173,7 +184,7 @@ export default class PostBodyAdditionalContent extends React.Component {
);
}
- if (this.isLinkToggleable()) {
+ if (this.isLinkToggleable() && !this.state.linkLoadError) {
const messageWithToggle = [];
// if message has only one line and starts with a link place toggle in this only line
diff --git a/webapp/components/post_view/components/post_image.jsx b/webapp/components/post_view/components/post_image.jsx
index d1d1a6c7a..9a761bfca 100644
--- a/webapp/components/post_view/components/post_image.jsx
+++ b/webapp/components/post_view/components/post_image.jsx
@@ -53,6 +53,9 @@ export default class PostImageEmbed extends React.Component {
errored: true,
loaded: true
});
+ if (this.props.onLinkLoadError) {
+ this.props.onLinkLoadError();
+ }
}
render() {
@@ -79,5 +82,6 @@ export default class PostImageEmbed extends React.Component {
}
PostImageEmbed.propTypes = {
- link: React.PropTypes.string.isRequired
+ link: React.PropTypes.string.isRequired,
+ onLinkLoadError: React.PropTypes.func
};