diff options
Diffstat (limited to 'web/react/components/post_body.jsx')
-rw-r--r-- | web/react/components/post_body.jsx | 71 |
1 files changed, 42 insertions, 29 deletions
diff --git a/web/react/components/post_body.jsx b/web/react/components/post_body.jsx index 860c96d84..e5ab5b624 100644 --- a/web/react/components/post_body.jsx +++ b/web/react/components/post_body.jsx @@ -4,15 +4,16 @@ var FileAttachmentList = require('./file_attachment_list.jsx'); var UserStore = require('../stores/user_store.jsx'); var utils = require('../utils/utils.jsx'); +var Constants = require('../utils/constants.jsx'); module.exports = React.createClass({ componentWillReceiveProps: function(nextProps) { var linkData = utils.extractLinks(nextProps.post.message); - this.setState({ links: linkData["links"], message: linkData["text"] }); + this.setState({links: linkData.links, message: linkData.text}); }, getInitialState: function() { var linkData = utils.extractLinks(this.props.post.message); - return { links: linkData["links"], message: linkData["text"] }; + return {links: linkData.links, message: linkData.text}; }, render: function() { var post = this.props.post; @@ -20,43 +21,52 @@ module.exports = React.createClass({ var parentPost = this.props.parentPost; var inner = utils.textToJsx(this.state.message); - var comment = ""; - var reply = ""; - var postClass = ""; + var comment = ''; + var reply = ''; + var postClass = ''; if (parentPost) { var profile = UserStore.getProfile(parentPost.user_id); - var apostrophe = ""; - var name = "..."; + var apostrophe = ''; + var name = '...'; if (profile != null) { if (profile.username.slice(-1) === 's') { - apostrophe = "'"; + apostrophe = '\''; } else { - apostrophe = "'s"; + apostrophe = '\'s'; } - name = <a className="theme" onClick={function(){ utils.searchForTerm(profile.username); }}>{profile.username}</a>; + name = <a className='theme' onClick={function searchName() { utils.searchForTerm(profile.username); }}>{profile.username}</a>; } - var message = "" - if(parentPost.message) { - message = utils.replaceHtmlEntities(parentPost.message) + var message = ''; + if (parentPost.message) { + message = utils.replaceHtmlEntities(parentPost.message); } else if (parentPost.filenames.length) { message = parentPost.filenames[0].split('/').pop(); if (parentPost.filenames.length === 2) { - message += " plus 1 other file"; + message += ' plus 1 other file'; } else if (parentPost.filenames.length > 2) { - message += " plus " + (parentPost.filenames.length - 1) + " other files"; + message += ' plus ' + (parentPost.filenames.length - 1) + ' other files'; } } comment = ( - <p className="post-link"> - <span>Commented on {name}{apostrophe} message: <a className="theme" onClick={this.props.handleCommentClick}>{message}</a></span> + <p className='post-link'> + <span>Commented on {name}{apostrophe} message: <a className='theme' onClick={this.props.handleCommentClick}>{message}</a></span> </p> ); - postClass += " post-comment"; + postClass += ' post-comment'; + } + + var loading; + if (post.state === Constants.POST_FAILED) { + postClass += ' post-fail'; + loading = <a className='theme post-retry pull-right' href='#' onClick={this.props.retryPost}>Retry</a>; + } else if (post.state === Constants.POST_LOADING) { + postClass += ' post-waiting'; + loading = <img className='post-loading-gif pull-right' src='/static/images/load.gif'/>; } var embed; @@ -64,18 +74,21 @@ module.exports = React.createClass({ embed = utils.getEmbed(this.state.links[0]); } + var fileAttachmentHolder = ''; + if (filenames && filenames.length > 0) { + fileAttachmentHolder = (<FileAttachmentList + filenames={filenames} + modalId={'view_image_modal_' + post.id} + channelId={post.channel_id} + userId={post.user_id} />); + } + return ( - <div className="post-body"> - { comment } - <p key={post.id+"_message"} className={postClass}><span>{inner}</span></p> - { filenames && filenames.length > 0 ? - <FileAttachmentList - filenames={filenames} - modalId={"view_image_modal_" + post.id} - channelId={post.channel_id} - userId={post.user_id} /> - : "" } - { embed } + <div className='post-body'> + {comment} + <p key={post.id + '_message'} className={postClass}>{loading}<span>{inner}</span></p> + {fileAttachmentHolder} + {embed} </div> ); } |