// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. import * as Utils from 'utils/utils.jsx'; import UserStore from 'stores/user_store.jsx'; import WebrtcStore from 'stores/webrtc_store.jsx'; import * as GlobalActions from 'actions/global_actions.jsx'; import * as WebrtcActions from 'actions/webrtc_actions.jsx'; import Constants from 'utils/constants.jsx'; const UserStatuses = Constants.UserStatuses; const PreReleaseFeatures = Constants.PRE_RELEASE_FEATURES; import {Popover, OverlayTrigger, Tooltip} from 'react-bootstrap'; import {FormattedMessage} from 'react-intl'; import React from 'react'; export default class ProfilePopover extends React.Component { constructor(props) { super(props); this.initWebrtc = this.initWebrtc.bind(this); this.state = { currentUserId: UserStore.getCurrentId() }; } shouldComponentUpdate(nextProps) { if (!Utils.areObjectsEqual(nextProps.user, this.props.user)) { return true; } if (nextProps.src !== this.props.src) { return true; } if (nextProps.status !== this.props.status) { return true; } if (nextProps.isBusy !== this.props.isBusy) { return true; } // React-Bootstrap Forwarded Props from OverlayTrigger to Popover if (nextProps.arrowOffsetLeft !== this.props.arrowOffsetLeft) { return true; } if (nextProps.arrowOffsetTop !== this.props.arrowOffsetTop) { return true; } if (nextProps.positionLeft !== this.props.positionLeft) { return true; } if (nextProps.positionTop !== this.props.positionTop) { return true; } return false; } initWebrtc() { if (this.props.status !== UserStatuses.OFFLINE && !WebrtcStore.isBusy()) { GlobalActions.emitCloseRightHandSide(); WebrtcActions.initWebrtc(this.props.user.id, true); } } render() { const popoverProps = Object.assign({}, this.props); delete popoverProps.user; delete popoverProps.src; delete popoverProps.status; delete popoverProps.isBusy; let webrtc; const userMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia; const webrtcEnabled = global.mm_config.EnableWebrtc === 'true' && userMedia && Utils.isFeatureEnabled(PreReleaseFeatures.WEBRTC_PREVIEW); if (webrtcEnabled && this.props.user.id !== this.state.currentUserId) { const isOnline = this.props.status !== UserStatuses.OFFLINE; let webrtcMessage; let circleClass = 'offline'; if (isOnline && !this.props.isBusy) { circleClass = ''; webrtcMessage = ( ); } else if (this.props.isBusy) { webrtcMessage = ( ); } else { webrtcMessage = ( ); } const webrtcTooltip = ( {webrtcMessage} ); webrtc = (
this.initWebrtc()} disabled={!isOnline} >
); } var dataContent = []; dataContent.push( ); const fullname = Utils.getFullName(this.props.user); if (fullname) { dataContent.push(

{fullname}

); } if (this.props.user.position) { const position = this.props.user.position.substring(0, Constants.MAX_POSITION_LENGTH); dataContent.push(

{position}

); } dataContent.push(webrtc); const email = this.props.user.email; if (global.window.mm_config.ShowEmailAddress === 'true' || UserStore.isSystemAdminForCurrentUser() || this.props.user === UserStore.getCurrentUser()) { dataContent.push(
{email}
); } return ( {dataContent} ); } } ProfilePopover.propTypes = Object.assign({ src: React.PropTypes.string.isRequired, user: React.PropTypes.object.isRequired, status: React.PropTypes.string.isRequired, isBusy: React.PropTypes.bool.isRequired }, Popover.propTypes); delete ProfilePopover.propTypes.id;