diff options
Diffstat (limited to 'webapp/components/user_profile.jsx')
-rw-r--r-- | webapp/components/user_profile.jsx | 122 |
1 files changed, 122 insertions, 0 deletions
diff --git a/webapp/components/user_profile.jsx b/webapp/components/user_profile.jsx new file mode 100644 index 000000000..d83ab7454 --- /dev/null +++ b/webapp/components/user_profile.jsx @@ -0,0 +1,122 @@ +// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import * as Utils from 'utils/utils.jsx'; + +import {FormattedMessage} from 'react-intl'; + +import {Popover, OverlayTrigger} from 'react-bootstrap'; + +var id = 0; + +function nextId() { + id = id + 1; + return id; +} + +import React from 'react'; + +export default class UserProfile extends React.Component { + constructor(props) { + super(props); + this.uniqueId = nextId(); + } + render() { + let name = '...'; + let email = ''; + let profileImg = ''; + if (this.props.user) { + name = Utils.displayUsername(this.props.user.id); + email = this.props.user.email; + profileImg = '/api/v1/users/' + this.props.user.id + '/image?time=' + this.props.user.update_at; + } + + if (this.props.overwriteName) { + name = this.props.overwriteName; + } + + if (this.props.overwriteImage) { + profileImg = this.props.overwriteImage; + } + + if (this.props.disablePopover) { + return <div>{name}</div>; + } + + var dataContent = []; + dataContent.push( + <img + className='user-popover__image' + src={profileImg} + height='128' + width='128' + key='user-popover-image' + /> + ); + + if (!global.window.mm_config.ShowEmailAddress === 'true') { + dataContent.push( + <div + className='text-nowrap' + key='user-popover-no-email' + > + <FormattedMessage + id='user_profile.notShared' + defaultMessage='Email not shared' + /> + </div> + ); + } else { + dataContent.push( + <div + data-toggle='tooltip' + title={email} + key='user-popover-email' + > + <a + href={'mailto:' + email} + className='text-nowrap text-lowercase user-popover__email' + > + {email} + </a> + </div> + ); + } + + return ( + <OverlayTrigger + trigger='click' + placement='right' + rootClose={true} + overlay={ + <Popover + title={name} + id='user-profile-popover' + > + {dataContent} + </Popover> + } + > + <div + className='user-popover' + id={'profile_' + this.uniqueId} + > + {name} + </div> + </OverlayTrigger> + ); + } +} + +UserProfile.defaultProps = { + user: {}, + overwriteName: '', + overwriteImage: '', + disablePopover: false +}; +UserProfile.propTypes = { + user: React.PropTypes.object, + overwriteName: React.PropTypes.string, + overwriteImage: React.PropTypes.string, + disablePopover: React.PropTypes.bool +}; |