diff options
author | Christopher Speller <crspeller@gmail.com> | 2016-03-03 15:15:56 -0500 |
---|---|---|
committer | Christopher Speller <crspeller@gmail.com> | 2016-03-03 15:15:56 -0500 |
commit | a413c8ffa684b72840f116380c04a61f1d9cf524 (patch) | |
tree | 287e855db2906058928f1916cbd3fa84857fdcc3 /web/react/components/channel_invite_modal.jsx | |
parent | bc2768fd254e82b6ca39a916436ab4747898578e (diff) | |
parent | 449f1000e999c409f754724cb998f0b9f90cdd59 (diff) | |
download | chat-a413c8ffa684b72840f116380c04a61f1d9cf524.tar.gz chat-a413c8ffa684b72840f116380c04a61f1d9cf524.tar.bz2 chat-a413c8ffa684b72840f116380c04a61f1d9cf524.zip |
Merge pull request #2318 from hmhealey/plt1090
PLT-1090 Refactored modals that display users
Diffstat (limited to 'web/react/components/channel_invite_modal.jsx')
-rw-r--r-- | web/react/components/channel_invite_modal.jsx | 65 |
1 files changed, 34 insertions, 31 deletions
diff --git a/web/react/components/channel_invite_modal.jsx b/web/react/components/channel_invite_modal.jsx index c9fe871d0..6c8d51abb 100644 --- a/web/react/components/channel_invite_modal.jsx +++ b/web/react/components/channel_invite_modal.jsx @@ -1,7 +1,7 @@ // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. -import MemberList from './member_list.jsx'; +import FilteredUserList from './filtered_user_list.jsx'; import LoadingScreen from './loading_screen.jsx'; import UserStore from '../stores/user_store.jsx'; @@ -22,8 +22,12 @@ export default class ChannelInviteModal extends React.Component { this.onListenerChange = this.onListenerChange.bind(this); this.handleInvite = this.handleInvite.bind(this); + this.createInviteButton = this.createInviteButton.bind(this); + // the state gets populated when the modal is shown - this.state = {}; + this.state = { + loading: true + }; } shouldComponentUpdate(nextProps, nextState) { if (!this.props.show && !nextProps.show) { @@ -77,19 +81,6 @@ export default class ChannelInviteModal extends React.Component { loading: false }; } - onShow() { - 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); - } - } - componentDidUpdate(prevProps) { - if (this.props.show && !prevProps.show) { - this.onShow(); - } - } componentWillReceiveProps(nextProps) { if (!this.props.show && nextProps.show) { ChannelStore.addExtraInfoChangeListener(this.onListenerChange); @@ -108,9 +99,10 @@ export default class ChannelInviteModal extends React.Component { this.setState(newState); } } - handleInvite(userId) { - var data = {}; - data.user_id = userId; + handleInvite(user) { + const data = { + user_id: user.id + }; Client.addChannelMember( this.props.channel.id, @@ -124,27 +116,40 @@ export default class ChannelInviteModal extends React.Component { } ); } + createInviteButton({user}) { + return ( + <a + onClick={this.handleInvite.bind(this, user)} + className='btn btn-sm btn-primary' + > + <i className='glyphicon glyphicon-envelope'/> + <FormattedMessage + id='channel_invite.add' + defaultMessage=' Add' + /> + </a> + ); + } render() { var inviteError = null; if (this.state.inviteError) { inviteError = (<label className='has-error control-label'>{this.state.inviteError}</label>); } - var currentMember = ChannelStore.getCurrentMember(); - var isAdmin = false; - if (currentMember) { - isAdmin = Utils.isAdmin(currentMember.roles) || Utils.isAdmin(UserStore.getCurrentUser().roles); - } - var content; if (this.state.loading) { content = (<LoadingScreen/>); } else { + let maxHeight = 1000; + if (Utils.windowHeight() <= 1200) { + maxHeight = Utils.windowHeight() - 300; + } + content = ( - <MemberList - memberList={this.state.nonmembers} - isAdmin={isAdmin} - handleInvite={this.handleInvite} + <FilteredUserList + style={{maxHeight}} + users={this.state.nonmembers} + actions={[this.createInviteButton]} /> ); } @@ -164,9 +169,7 @@ export default class ChannelInviteModal extends React.Component { <span className='name'>{this.props.channel.display_name}</span> </Modal.Title> </Modal.Header> - <Modal.Body - ref='modalBody' - > + <Modal.Body> {inviteError} {content} </Modal.Body> |