diff options
author | hmhealey <harrisonmhealey@gmail.com> | 2015-10-29 17:49:38 -0400 |
---|---|---|
committer | hmhealey <harrisonmhealey@gmail.com> | 2015-11-02 15:10:14 -0500 |
commit | efa7b8252fff96e52cca82d332fbf812305049b3 (patch) | |
tree | b6c997df07ab96eeea14cee27b5a12f490c4663c /web/react/components/confirm_modal.jsx | |
parent | e52669c2da0bb78c225a5c87edebe472e4c7ac56 (diff) | |
download | chat-efa7b8252fff96e52cca82d332fbf812305049b3.tar.gz chat-efa7b8252fff96e52cca82d332fbf812305049b3.tar.bz2 chat-efa7b8252fff96e52cca82d332fbf812305049b3.zip |
Ported ConfirmModal and InviteMemberModal to React-Bootstrap
Diffstat (limited to 'web/react/components/confirm_modal.jsx')
-rw-r--r-- | web/react/components/confirm_modal.jsx | 82 |
1 files changed, 39 insertions, 43 deletions
diff --git a/web/react/components/confirm_modal.jsx b/web/react/components/confirm_modal.jsx index 12002f33f..60069b2b1 100644 --- a/web/react/components/confirm_modal.jsx +++ b/web/react/components/confirm_modal.jsx @@ -1,70 +1,66 @@ // Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. +const Modal = ReactBootstrap.Modal; + export default class ConfirmModal extends React.Component { constructor(props) { super(props); this.handleConfirm = this.handleConfirm.bind(this); - - this.state = {}; } + handleConfirm() { - $('#' + this.props.parent_id).attr('data-confirm', 'true'); - $('#' + this.props.parent_id).modal('hide'); - $('#' + this.props.id).modal('hide'); + if (this.props.onConfirm) { + this.props.onConfirm(); + } } + render() { return ( - <div - className='modal fade' - id={this.props.id} - tabIndex='-1' - role='dialog' - aria-hidden='true' + <Modal + className='modal-confirm' + show={this.props.show} + onHide={this.props.onCancel} + enforceFocus={false} > - <div className='modal-dialog'> - <div className='modal-content'> - <div className='modal-header'> - <h4 className='modal-title'>{this.props.title}</h4> - </div> - <div className='modal-body'> - {this.props.message} - </div> - <div className='modal-footer'> - <button - type='button' - className='btn btn-default' - data-dismiss='modal' - > - Cancel - </button> - <button - onClick={this.handleConfirm} - type='button' - className='btn btn-primary' - > - {this.props.confirm_button} - </button> - </div> - </div> - </div> - </div> + <Modal.Header closeButton={false}> + <Modal.Title>{this.props.title}</Modal.Title> + </Modal.Header> + <Modal.Body> + {this.props.message} + </Modal.Body> + <Modal.Footer> + <button + type='button' + className='btn btn-default' + onClick={this.props.onCancel} + > + {'Cancel'} + </button> + <button + type='button' + className='btn btn-primary' + onClick={this.props.onConfirm} + > + {this.props.confirm_button} + </button> + </Modal.Footer> + </Modal> ); } } ConfirmModal.defaultProps = { - parent_id: '', - id: '', title: '', message: '', confirm_button: '' }; ConfirmModal.propTypes = { - parent_id: React.PropTypes.string, - id: React.PropTypes.string, + show: React.PropTypes.bool.isRequired, title: React.PropTypes.string, message: React.PropTypes.string, - confirm_button: React.PropTypes.string + confirm_button: React.PropTypes.string, + onConfirm: React.PropTypes.func.isRequired, + onCancel: React.PropTypes.func.isRequired }; |