95 строки
3.0 KiB
JavaScript
95 строки
3.0 KiB
JavaScript
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
|
|
// See License.txt for license information.
|
|
|
|
var UserStore = require('../stores/user_store.jsx');
|
|
var Popover = ReactBootstrap.Popover;
|
|
var OverlayTrigger = ReactBootstrap.OverlayTrigger;
|
|
|
|
export default class PopoverListMembers extends React.Component {
|
|
componentDidMount() {
|
|
const originalLeave = $.fn.popover.Constructor.prototype.leave;
|
|
$.fn.popover.Constructor.prototype.leave = function onLeave(obj) {
|
|
let selfObj;
|
|
if (obj instanceof this.constructor) {
|
|
selfObj = obj;
|
|
} else {
|
|
selfObj = $(obj.currentTarget)[this.type](this.getDelegateOptions()).data(`bs.${this.type}`);
|
|
}
|
|
originalLeave.call(this, obj);
|
|
|
|
if (obj.currentTarget && selfObj.$tip) {
|
|
selfObj.$tip.one('mouseenter', function onMouseEnter() {
|
|
clearTimeout(selfObj.timeout);
|
|
selfObj.$tip.one('mouseleave', function onMouseLeave() {
|
|
$.fn.popover.Constructor.prototype.leave.call(selfObj, selfObj);
|
|
});
|
|
});
|
|
}
|
|
};
|
|
}
|
|
render() {
|
|
let popoverHtml = [];
|
|
let count = 0;
|
|
let countText = '-';
|
|
const members = this.props.members;
|
|
const teamMembers = UserStore.getProfilesUsernameMap();
|
|
|
|
if (members && teamMembers) {
|
|
members.sort((a, b) => {
|
|
return a.username.localeCompare(b.username);
|
|
});
|
|
|
|
members.forEach((m, i) => {
|
|
if (teamMembers[m.username] && teamMembers[m.username].delete_at <= 0) {
|
|
popoverHtml.push(
|
|
<div
|
|
className='text--nowrap'
|
|
key={'popover-member-' + i}
|
|
>
|
|
{m.username}
|
|
</div>
|
|
);
|
|
count++;
|
|
}
|
|
});
|
|
|
|
if (count > 20) {
|
|
countText = '20+';
|
|
} else if (count > 0) {
|
|
countText = count.toString();
|
|
}
|
|
}
|
|
|
|
return (
|
|
<OverlayTrigger
|
|
trigger='click'
|
|
placement='bottom'
|
|
rootClose={true}
|
|
overlay={
|
|
<Popover
|
|
title='Members'
|
|
id='member-list-popover'
|
|
>
|
|
{popoverHtml}
|
|
</Popover>
|
|
}
|
|
>
|
|
<div id='member_popover'>
|
|
<div>
|
|
{countText}
|
|
<span
|
|
className='fa fa-user'
|
|
aria-hidden='true'
|
|
/>
|
|
</div>
|
|
</div>
|
|
</OverlayTrigger>
|
|
);
|
|
}
|
|
}
|
|
|
|
PopoverListMembers.propTypes = {
|
|
members: React.PropTypes.array.isRequired,
|
|
channelId: React.PropTypes.string.isRequired
|
|
};
|