From d5f243dad694d6746ec2b6560a81212a78d8c975 Mon Sep 17 00:00:00 2001 From: Corey Hulen Date: Wed, 6 Jul 2016 13:40:59 -0800 Subject: PLT-2863 adding remove user from team (#3429) * PLT-2863 adding remove user from team * PLT-2863 adding the client side UI * Fixing trailing space * Fixing reported issues * Adding documentatino * Switching to final javascript driver --- webapp/components/admin_console/team_users.jsx | 4 + webapp/components/admin_console/user_item.jsx | 35 +++++++- webapp/components/filtered_user_list.jsx | 15 +++- webapp/components/leave_team_modal.jsx | 115 +++++++++++++++++++++++++ webapp/components/navbar_dropdown.jsx | 14 +++ webapp/components/needs_team.jsx | 2 + webapp/components/team_members_dropdown.jsx | 36 +++++++- 7 files changed, 217 insertions(+), 4 deletions(-) create mode 100644 webapp/components/leave_team_modal.jsx (limited to 'webapp/components') diff --git a/webapp/components/admin_console/team_users.jsx b/webapp/components/admin_console/team_users.jsx index b6bba3182..3ec375627 100644 --- a/webapp/components/admin_console/team_users.jsx +++ b/webapp/components/admin_console/team_users.jsx @@ -186,6 +186,10 @@ export default class UserList extends React.Component { var memberList = this.state.users.map((user) => { var teamMember = this.getTeamMemberForUser(user.id); + if (teamMember.delete_at > 0) { + return null; + } + return ( { + this.props.refreshProfiles(); + }, + (err) => { + this.setState({serverError: err.message}); + } + ); + } + handleMakeActive(e) { e.preventDefault(); Client.updateActive(this.props.user.id, true, @@ -222,6 +236,7 @@ export default class UserItem extends React.Component { ); } + const me = UserStore.getCurrentUser(); const email = user.email; let showMakeMember = teamMember.roles === 'admin' || user.roles === 'system_admin'; let showMakeAdmin = teamMember.roles === '' && user.roles !== 'system_admin'; @@ -299,6 +314,24 @@ export default class UserItem extends React.Component { ); } + let removeFromTeam = null; + if (this.props.user.id !== me.id) { + removeFromTeam = ( +
  • + + + +
    • + ); + } + let makeActive = null; if (showMakeActive) { makeActive = ( @@ -428,7 +461,6 @@ export default class UserItem extends React.Component { passwordReset = null; } - const me = UserStore.getCurrentUser(); let makeDemoteModal = null; if (this.props.user.id === me.id) { const title = ( @@ -511,6 +543,7 @@ export default class UserItem extends React.Component { className='dropdown-menu member-menu' role='menu' > + {removeFromTeam} {makeAdmin} {makeMember} {makeActive} diff --git a/webapp/components/filtered_user_list.jsx b/webapp/components/filtered_user_list.jsx index b6d8f11f9..67d038fd9 100644 --- a/webapp/components/filtered_user_list.jsx +++ b/webapp/components/filtered_user_list.jsx @@ -39,17 +39,24 @@ class FilteredUserList extends React.Component { this.state = { filter: '', users: this.filterUsers(props.teamMembers, props.users), - selected: 'team' + selected: 'team', + teamMembers: props.teamMembers }; } - componentWillUpdate(nextProps) { + componentWillReceiveProps(nextProps) { // assume the user list is immutable if (this.props.users !== nextProps.users) { this.setState({ users: this.filterUsers(nextProps.teamMembers, nextProps.users) }); } + + if (this.props.teamMembers !== nextProps.teamMembers) { + this.setState({ + users: this.filterUsers(nextProps.teamMembers, nextProps.users) + }); + } } componentDidMount() { @@ -70,6 +77,10 @@ class FilteredUserList extends React.Component { var filteredUsers = users.filter((user) => { for (const index in teamMembers) { if (teamMembers.hasOwnProperty(index) && teamMembers[index].user_id === user.id) { + if (teamMembers[index].delete_at > 0) { + return false; + } + return true; } } diff --git a/webapp/components/leave_team_modal.jsx b/webapp/components/leave_team_modal.jsx new file mode 100644 index 000000000..7263f23d4 --- /dev/null +++ b/webapp/components/leave_team_modal.jsx @@ -0,0 +1,115 @@ +// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import Constants from 'utils/constants.jsx'; +const ActionTypes = Constants.ActionTypes; +import * as GlobalActions from 'actions/global_actions.jsx'; +import ModalStore from 'stores/modal_store.jsx'; +import UserStore from 'stores/user_store.jsx'; + +import {intlShape, injectIntl, FormattedMessage} from 'react-intl'; + +import {Modal} from 'react-bootstrap'; + +import React from 'react'; + +class LeaveTeamModal extends React.Component { + constructor(props) { + super(props); + + this.handleToggle = this.handleToggle.bind(this); + this.handleSubmit = this.handleSubmit.bind(this); + this.handleHide = this.handleHide.bind(this); + + this.state = { + show: false + }; + } + + componentDidMount() { + ModalStore.addModalListener(ActionTypes.TOGGLE_LEAVE_TEAM_MODAL, this.handleToggle); + } + + componentWillUnmount() { + ModalStore.removeModalListener(ActionTypes.TOGGLE_LEAVE_TEAM_MODAL, this.handleToggle); + } + + handleToggle(value) { + this.setState({ + show: value + }); + } + + handleSubmit() { + GlobalActions.emitLeaveTeam(); + + this.setState({ + show: false + }); + } + + handleHide() { + this.setState({ + show: false + }); + } + + render() { + var currentUser = UserStore.getCurrentUser(); + + if (currentUser != null) { + return ( + + + + + + + + + + + + + + + ); + } + + return null; + } +} + +LeaveTeamModal.propTypes = { + intl: intlShape.isRequired +}; + +export default injectIntl(LeaveTeamModal); diff --git a/webapp/components/navbar_dropdown.jsx b/webapp/components/navbar_dropdown.jsx index ab228dcb3..c660bc164 100644 --- a/webapp/components/navbar_dropdown.jsx +++ b/webapp/components/navbar_dropdown.jsx @@ -236,6 +236,20 @@ export default class NavbarDropdown extends React.Component { ); } + teams.push( +
  • + + + +
    • + ); + if (this.state.teamMembers && this.state.teamMembers.length > 1) { teams.push(
  • + diff --git a/webapp/components/team_members_dropdown.jsx b/webapp/components/team_members_dropdown.jsx index 2b40da9cf..43449635d 100644 --- a/webapp/components/team_members_dropdown.jsx +++ b/webapp/components/team_members_dropdown.jsx @@ -19,6 +19,7 @@ export default class TeamMembersDropdown extends React.Component { super(props); this.handleMakeMember = this.handleMakeMember.bind(this); + this.handleRemoveFromTeam = this.handleRemoveFromTeam.bind(this); this.handleMakeActive = this.handleMakeActive.bind(this); this.handleMakeNotActive = this.handleMakeNotActive.bind(this); this.handleMakeAdmin = this.handleMakeAdmin.bind(this); @@ -52,6 +53,19 @@ export default class TeamMembersDropdown extends React.Component { ); } } + handleRemoveFromTeam() { + Client.removeUserFromTeam( + '', + this.props.user.id, + () => { + AsyncClient.getTeamMembers(TeamStore.getCurrentId()); + AsyncClient.getProfiles(); + }, + (err) => { + this.setState({serverError: err.message}); + } + ); + } handleMakeActive() { Client.updateActive(this.props.user.id, true, () => { @@ -171,6 +185,7 @@ export default class TeamMembersDropdown extends React.Component { ); } + const me = UserStore.getCurrentUser(); let showMakeMember = teamMember.roles === 'admin' || user.roles === 'system_admin'; let showMakeAdmin = teamMember.roles === '' && user.roles !== 'system_admin'; let showMakeActive = false; @@ -225,6 +240,24 @@ export default class TeamMembersDropdown extends React.Component { ); } + let removeFromTeam = null; + if (this.props.user.id !== me.id) { + removeFromTeam = ( +
  • + + + +
    • + ); + } + let makeActive = null; if (showMakeActive) { // makeActive = ( @@ -260,7 +293,7 @@ export default class TeamMembersDropdown extends React.Component { // // ); } - const me = UserStore.getCurrentUser(); + let makeDemoteModal = null; if (this.props.user.id === me.id) { const title = ( @@ -321,6 +354,7 @@ export default class TeamMembersDropdown extends React.Component { className='dropdown-menu member-menu' role='menu' > + {removeFromTeam} {makeAdmin} {makeMember} {makeActive} -- cgit v1.2.3-1-g7c22