auth0-extensions/auth0-sso-dashboard-extension

import React, { Component } from 'react';
import { Button, ButtonToolbar, Modal } from 'react-bootstrap';

class Confirm extends Component {
  renderCancel() {
    if (this.props.onCancel) {
      return (
        <Button disabled={this.props.loading} onClick={this.props.onCancel}>
          { this.props.cancelMessage || <span><i className="icon icon-budicon-501"></i> Cancel</span> }
        </Button>
      );
    }

    return null;
  }

  renderConfirm() {
    if (this.props.onConfirm) {
      return (
        <Button bsStyle={this.props.successClass||'success'} disabled={this.props.loading} onClick={this.props.onConfirm}>
          { this.props.confirmMessage || <span><i className="icon icon-budicon-499"></i> Confirm</span> }
        </Button>
      );
    }

    return null;
  }

  render() {
    return (
      <Modal dialogClassName={this.props.dialogClassName} show={this.props.show} onHide={this.props.onCancel}>
        <Modal.Header closeButton={!this.props.loading}>
          <Modal.Title>{this.props.title}</Modal.Title>
        </Modal.Header>
        <Modal.Body>
          {this.props.children}
        </Modal.Body>
        <Modal.Footer>
          {this.renderCancel()}
          {this.renderConfirm()}
        </Modal.Footer>
      </Modal>
    );
  }
}

Confirm.propTypes = {
  dialogClassName: React.PropTypes.string,
  confirmMessage: React.PropTypes.string,
  cancelMessage: React.PropTypes.string,
  successClass: React.PropTypes.string,
  loading: React.PropTypes.bool.isRequired,
  title: React.PropTypes.string.isRequired,
  show: React.PropTypes.bool.isRequired,
  onCancel: React.PropTypes.func.isRequired,
  onConfirm: React.PropTypes.func
};

export default Confirm;