summaryrefslogtreecommitdiffstats
path: root/web/react/components
diff options
context:
space:
mode:
Diffstat (limited to 'web/react/components')
-rw-r--r--web/react/components/confirm_modal.jsx10
-rw-r--r--web/react/components/member_list_team.jsx21
-rw-r--r--web/react/components/team_members_dropdown.jsx (renamed from web/react/components/member_list_team_item.jsx)124
-rw-r--r--web/react/components/team_members_modal.jsx13
4 files changed, 75 insertions, 93 deletions
diff --git a/web/react/components/confirm_modal.jsx b/web/react/components/confirm_modal.jsx
index 987649f38..bb3576684 100644
--- a/web/react/components/confirm_modal.jsx
+++ b/web/react/components/confirm_modal.jsx
@@ -44,7 +44,7 @@ export default class ConfirmModal extends React.Component {
className='btn btn-primary'
onClick={this.props.onConfirm}
>
- {this.props.confirm_button}
+ {this.props.confirmButton}
</button>
</Modal.Footer>
</Modal>
@@ -55,13 +55,13 @@ export default class ConfirmModal extends React.Component {
ConfirmModal.defaultProps = {
title: '',
message: '',
- confirm_button: ''
+ confirmButton: ''
};
ConfirmModal.propTypes = {
show: React.PropTypes.bool.isRequired,
- title: React.PropTypes.string,
- message: React.PropTypes.string,
- confirm_button: React.PropTypes.string,
+ title: React.PropTypes.node,
+ message: React.PropTypes.node,
+ confirmButton: React.PropTypes.node,
onConfirm: React.PropTypes.func.isRequired,
onCancel: React.PropTypes.func.isRequired
};
diff --git a/web/react/components/member_list_team.jsx b/web/react/components/member_list_team.jsx
index f1c31131f..0787bf8d8 100644
--- a/web/react/components/member_list_team.jsx
+++ b/web/react/components/member_list_team.jsx
@@ -1,7 +1,8 @@
// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved.
// See License.txt for license information.
-import MemberListTeamItem from './member_list_team_item.jsx';
+import FilteredUserList from './filtered_user_list.jsx';
+import TeamMembersDropdown from './team_members_dropdown.jsx';
import UserStore from '../stores/user_store.jsx';
export default class MemberListTeam extends React.Component {
@@ -44,21 +45,11 @@ export default class MemberListTeam extends React.Component {
}
render() {
- const memberList = this.state.users.map((user) => {
- return (
- <MemberListTeamItem
- key={user.id}
- user={user}
- />
- );
- });
-
return (
- <table className='table more-table member-list-holder'>
- <tbody>
- {memberList}
- </tbody>
- </table>
+ <FilteredUserList
+ users={this.state.users}
+ actions={[TeamMembersDropdown]}
+ />
);
}
}
diff --git a/web/react/components/member_list_team_item.jsx b/web/react/components/team_members_dropdown.jsx
index 23bc10781..35ec66519 100644
--- a/web/react/components/member_list_team_item.jsx
+++ b/web/react/components/team_members_dropdown.jsx
@@ -9,28 +9,9 @@ import * as Utils from '../utils/utils.jsx';
import ConfirmModal from './confirm_modal.jsx';
import TeamStore from '../stores/team_store.jsx';
-import {injectIntl, intlShape, defineMessages, FormattedMessage} from 'mm-intl';
+import {FormattedMessage} from 'mm-intl';
-var holders = defineMessages({
- confirmDemoteRoleTitle: {
- id: 'member_team_item.confirmDemoteRoleTitle',
- defaultMessage: 'Confirm demotion from System Admin role'
- },
- confirmDemotion: {
- id: 'member_team_item.confirmDemotion',
- defaultMessage: 'Confirm Demotion'
- },
- confirmDemoteDescription: {
- id: 'member_team_item.confirmDemoteDescription',
- defaultMessage: 'If you demote yourself from the System Admin role and there is not another user with System Admin privileges, you\'ll need to re-assign a System Admin by accessing the Mattermost server through a terminal and running the following command.'
- },
- confirmDemotionCmd: {
- id: 'member_team_item.confirmDemotionCmd',
- defaultMessage: 'platform -assign_role -team_name="yourteam" -email="name@yourcompany.com" -role="system_admin"'
- }
-});
-
-export default class MemberListTeamItem extends React.Component {
+export default class TeamMembersDropdown extends React.Component {
constructor(props) {
super(props);
@@ -163,7 +144,6 @@ export default class MemberListTeamItem extends React.Component {
defaultMessage='Member'
/>
);
- const timestamp = UserStore.getCurrentUser().update_at;
if (user.roles.length > 0) {
if (Utils.isSystemAdmin(user.roles)) {
@@ -185,7 +165,6 @@ export default class MemberListTeamItem extends React.Component {
}
}
- const email = user.email;
let showMakeMember = user.roles === 'admin' || user.roles === 'system_admin';
let showMakeAdmin = user.roles === '' || user.roles === 'system_admin';
let showMakeActive = false;
@@ -276,15 +255,43 @@ export default class MemberListTeamItem extends React.Component {
);
}
const me = UserStore.getCurrentUser();
- const {formatMessage} = this.props.intl;
let makeDemoteModal = null;
if (this.props.user.id === me.id) {
+ const title = (
+ <FormattedMessage
+ id='member_team_item.confirmDemoteRoleTitle'
+ defaultMessage='Confirm demotion from System Admin role'
+ />
+ );
+ const message = (
+ <div>
+ <FormattedMessage
+ id='member_team_item.confirmDemoteDescription'
+ defaultMessage="If you demote yourself from the System Admin role and there is not another user with System Admin privileges, you'll need to re-assign a System Admin by accessing the Mattermost server through a terminal and running the following command."
+ />
+ <br/>
+ <br/>
+ <FormattedMessage
+ id='member_team_item.confirmDemotionCmd'
+ defaultMessage='platform -assign_role -team_name="yourteam" -email="name@yourcompany.com" -role="system_admin"'
+ />
+ {serverError}
+ </div>
+ );
+
+ const confirmButton = (
+ <FormattedMessage
+ id='member_team_item.confirmDemotion'
+ defaultMessage='Confirm Demotion'
+ />
+ );
+
makeDemoteModal = (
<ConfirmModal
show={this.state.showDemoteModal}
- title={formatMessage(holders.confirmDemoteRoleTitle)}
- message={[formatMessage(holders.confirmDemoteDescription), React.createElement('br'), React.createElement('br'), formatMessage(holders.confirmDemotionCmd), serverError]}
- confirm_button={formatMessage(holders.confirmDemotion)}
+ title={title}
+ message={message}
+ confirmButton={confirmButton}
onConfirm={this.handleDemoteSubmit}
onCancel={this.handleDemoteCancel}
/>
@@ -292,48 +299,33 @@ export default class MemberListTeamItem extends React.Component {
}
return (
- <tr>
- <td className='row member-div'>
- <img
- className='post-profile-img pull-left'
- src={`/api/v1/users/${user.id}/image?time=${timestamp}&${Utils.getSessionIndex()}`}
- height='36'
- width='36'
- />
- <span className='more-name'>{Utils.displayUsername(user.id)}</span>
- <span className='more-description'>{email}</span>
- <div className='dropdown member-drop'>
- <a
- href='#'
- className='dropdown-toggle theme'
- type='button'
- data-toggle='dropdown'
- aria-expanded='true'
- >
- <span className='fa fa-pencil'></span>
- <span>{currentRoles} </span>
- </a>
- <ul
- className='dropdown-menu member-menu'
- role='menu'
- >
- {makeAdmin}
- {makeMember}
- {makeActive}
- {makeNotActive}
- </ul>
- </div>
- {makeDemoteModal}
- {serverError}
- </td>
- </tr>
+ <div className='dropdown member-drop'>
+ <a
+ href='#'
+ className='dropdown-toggle theme'
+ type='button'
+ data-toggle='dropdown'
+ aria-expanded='true'
+ >
+ <span className='fa fa-pencil'></span>
+ <span>{currentRoles} </span>
+ </a>
+ <ul
+ className='dropdown-menu member-menu'
+ role='menu'
+ >
+ {makeAdmin}
+ {makeMember}
+ {makeActive}
+ {makeNotActive}
+ </ul>
+ {makeDemoteModal}
+ {serverError}
+ </div>
);
}
}
-MemberListTeamItem.propTypes = {
- intl: intlShape.isRequired,
+TeamMembersDropdown.propTypes = {
user: React.PropTypes.object.isRequired
};
-
-export default injectIntl(MemberListTeamItem);
diff --git a/web/react/components/team_members_modal.jsx b/web/react/components/team_members_modal.jsx
index 8ac435742..dfd48b614 100644
--- a/web/react/components/team_members_modal.jsx
+++ b/web/react/components/team_members_modal.jsx
@@ -28,12 +28,13 @@ export default class TeamMembersModal extends React.Component {
}
onShow() {
- if ($(window).width() > 768) {
+ // TODO ugh
+ /*if ($(window).width() > 768) {
$(ReactDOM.findDOMNode(this.refs.modalBody)).perfectScrollbar();
$(ReactDOM.findDOMNode(this.refs.modalBody)).css('max-height', $(window).height() - 200);
} else {
$(ReactDOM.findDOMNode(this.refs.modalBody)).css('max-height', $(window).height() - 150);
- }
+ }*/
}
render() {
@@ -41,7 +42,7 @@ export default class TeamMembersModal extends React.Component {
return (
<Modal
- dialogClassName='team-members-modal'
+ dialogClassName='more-modal'
show={this.props.show}
onHide={this.props.onHide}
>
@@ -54,10 +55,8 @@ export default class TeamMembersModal extends React.Component {
}}
/>
</Modal.Header>
- <Modal.Body ref='modalBody'>
- <div className='team-member-list'>
- <MemberListTeam/>
- </div>
+ <Modal.Body>
+ <MemberListTeam/>
</Modal.Body>
<Modal.Footer>
<button
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-10-30 17:19:10 +0000