1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
|
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
import ProfilePicture from 'components/profile_picture.jsx';
import UserStore from 'stores/user_store.jsx';
import PreferenceStore from 'stores/preference_store.jsx';
import Constants from 'utils/constants.jsx';
import * as Utils from 'utils/utils.jsx';
import Client from 'client/web_client.jsx';
import React from 'react';
import {FormattedHTMLMessage} from 'react-intl';
export default function UserListRow({user, extraInfo, actions, actionProps, actionUserProps}) {
const nameFormat = PreferenceStore.get(Constants.Preferences.CATEGORY_DISPLAY_SETTINGS, 'name_format', '');
let name = user.username;
if (user.nickname && nameFormat === Constants.Preferences.DISPLAY_PREFER_NICKNAME) {
name = `${user.nickname} (@${user.username})`;
} else if ((user.first_name || user.last_name) && (nameFormat === Constants.Preferences.DISPLAY_PREFER_NICKNAME || nameFormat === Constants.Preferences.DISPLAY_PREFER_FULL_NAME)) {
name = `${Utils.getFullName(user)} (@${user.username})`;
}
let buttons = null;
if (actions) {
buttons = actions.map((Action, index) => {
return (
<Action
key={index.toString()}
user={user}
{...actionProps}
{...actionUserProps}
/>
);
});
}
// QUICK HACK, NEEDS A PROP FOR TOGGLING STATUS
let email = user.email;
let emailStyle = 'more-modal__description';
let status;
if (extraInfo && extraInfo.length > 0) {
email = (
<FormattedHTMLMessage
id='admin.user_item.emailTitle'
defaultMessage='<strong>Email:</strong> {email}'
values={{
email: user.email
}}
/>
);
emailStyle = '';
} else if (user.status) {
status = user.status;
} else {
status = UserStore.getStatus(user.id);
}
return (
<div
key={user.id}
className='more-modal__row'
>
<ProfilePicture
src={`${Client.getUsersRoute()}/${user.id}/image?time=${user.last_picture_update}`}
status={status}
width='32'
height='32'
/>
<div
className='more-modal__details'
>
<div className='more-modal__name'>
{name}
</div>
<div className={emailStyle}>
{email}
</div>
{extraInfo}
</div>
<div
className='more-modal__actions'
>
{buttons}
</div>
</div>
);
}
UserListRow.defaultProps = {
extraInfo: [],
actions: [],
actionProps: {},
actionUserProps: {}
};
UserListRow.propTypes = {
user: React.PropTypes.object.isRequired,
extraInfo: React.PropTypes.arrayOf(React.PropTypes.object),
actions: React.PropTypes.arrayOf(React.PropTypes.func),
actionProps: React.PropTypes.object,
actionUserProps: React.PropTypes.object
};
|