diff options
author | Corey Hulen <corey@hulen.com> | 2015-09-02 12:41:16 -0700 |
---|---|---|
committer | Corey Hulen <corey@hulen.com> | 2015-09-02 12:41:16 -0700 |
commit | 833f6b7df123f25d5aa6bee6aee0c90c82b74c38 (patch) | |
tree | 191b16707373caa2aeecb77d40af64ffe05815db /web/react/components/mention.jsx | |
parent | eaeab0d645ca69efb4a0b47b802db750a6f54136 (diff) | |
parent | aac83dcedc644dfc23fc46366e54c65e0c86c5b9 (diff) | |
download | chat-833f6b7df123f25d5aa6bee6aee0c90c82b74c38.tar.gz chat-833f6b7df123f25d5aa6bee6aee0c90c82b74c38.tar.bz2 chat-833f6b7df123f25d5aa6bee6aee0c90c82b74c38.zip |
Merge pull request #539 from rgarmsen2295/reformat_part_one
MM-2063 Cosmetic Refactoring
Diffstat (limited to 'web/react/components/mention.jsx')
-rw-r--r-- | web/react/components/mention.jsx | 61 |
1 files changed, 44 insertions, 17 deletions
diff --git a/web/react/components/mention.jsx b/web/react/components/mention.jsx index 114dc183f..72a2a6251 100644 --- a/web/react/components/mention.jsx +++ b/web/react/components/mention.jsx @@ -1,30 +1,57 @@ // Copyright (c) 2015 Spinpunch, Inc. All Rights Reserved. // See License.txt for license information. -var UserStore = require("../stores/user_store.jsx"); +var UserStore = require('../stores/user_store.jsx'); -module.exports = React.createClass({ - handleClick: function() { +export default class Mention extends React.Component { + constructor(props) { + super(props); + + this.handleClick = this.handleClick.bind(this); + + this.state = null; + } + handleClick() { this.props.handleClick(this.props.username); - }, - getInitialState: function() { - return null; - }, - render: function() { - var self = this; + } + render() { var icon; var timestamp = UserStore.getCurrentUser().update_at; - if (this.props.id === "allmention" || this.props.id === "channelmention") { - icon = <span><i className="mention-img fa fa-users fa-2x"></i></span>; + if (this.props.id === 'allmention' || this.props.id === 'channelmention') { + icon = <span><i className='mention-img fa fa-users fa-2x'></i></span>; } else if (this.props.id != null) { - icon = <span><img className="mention-img" src={"/api/v1/users/" + this.props.id + "/image?time=" + timestamp}/></span>; + icon = (<span><img + className='mention-img' + src={'/api/v1/users/' + this.props.id + '/image?time=' + timestamp} + /> + </span>); } else { - icon = <span><i className="mention-img fa fa-users fa-2x"></i></span>; + icon = <span><i className='mention-img fa fa-users fa-2x'></i></span>; } return ( - <div className={"mentions-name " + this.props.isFocused} id={this.props.id + "_mentions"} onClick={this.handleClick} onMouseEnter={this.props.handleMouseEnter}> - <div className="pull-left">{icon}</div> - <div className="pull-left mention-align"><span>@{this.props.username}</span><span className="mention-fullname">{this.props.secondary_text}</span></div> + <div + className={'mentions-name ' + this.props.isFocused} + id={this.props.id + '_mentions'} + onClick={this.handleClick} + onMouseEnter={this.props.handleMouseEnter} + > + <div className='pull-left'>{icon}</div> + <div className='pull-left mention-align'><span>@{this.props.username}</span><span className='mention-fullname'>{this.props.secondary_text}</span></div> </div> ); } -}); +} + +Mention.defaultProps = { + username: '', + id: '', + isFocused: '', + secondary_text: '' +}; +Mention.propTypes = { + handleClick: React.PropTypes.func.isRequired, + handleMouseEnter: React.PropTypes.func.isRequired, + username: React.PropTypes.string, + id: React.PropTypes.string, + isFocused: React.PropTypes.string, + secondary_text: React.PropTypes.string +}; |