1
0
mirror of https://github.com/ascribe/onion.git synced 2024-12-23 09:50:31 +01:00
onion/js/components/ascribe_modal/modal_wrapper.js

96 lines
2.6 KiB
JavaScript

'use strict';
import React from 'react';
import ReactAddons from 'react/addons';
import Modal from 'react-bootstrap/lib/Modal';
import OverlayTrigger from 'react-bootstrap/lib/OverlayTrigger';
import ModalTrigger from 'react-bootstrap/lib/ModalTrigger';
import Tooltip from 'react-bootstrap/lib/Tooltip';
import ModalMixin from '../../mixins/modal_mixin';
let ModalWrapper = React.createClass({
propTypes: {
title: React.PropTypes.string.isRequired,
onRequestHide: React.PropTypes.func,
handleSuccess: React.PropTypes.func.isRequired,
button: React.PropTypes.object.isRequired,
children: React.PropTypes.object,
tooltip: React.PropTypes.string
},
getModalTrigger() {
return (
<ModalTrigger modal={
<ModalBody
title={this.props.title}
handleSuccess={this.props.handleSuccess}>
{this.props.children}
</ModalBody>
}>
{this.props.button}
</ModalTrigger>
);
},
render() {
if(this.props.tooltip) {
return (
<OverlayTrigger
delay={500}
placement="left"
overlay={<Tooltip>{this.props.tooltip}</Tooltip>}>
{this.getModalTrigger()}
</OverlayTrigger>
);
} else {
return (
<span>
{/* This needs to be some kind of inline-block */}
{this.getModalTrigger()}
</span>
);
}
}
});
let ModalBody = React.createClass({
propTypes: {
onRequestHide: React.PropTypes.func,
handleSuccess: React.PropTypes.func,
children: React.PropTypes.object,
title: React.PropTypes.string.isRequired
},
mixins: [ModalMixin],
handleSuccess(response){
this.props.handleSuccess(response);
this.props.onRequestHide();
},
renderChildren() {
return ReactAddons.Children.map(this.props.children, (child) => {
return ReactAddons.addons.cloneWithProps(child, {
onRequestHide: this.props.onRequestHide,
handleSuccess: this.handleSuccess
});
});
},
render() {
return (
<Modal {...this.props} title={this.props.title}>
<div className="modal-body">
{this.renderChildren()}
</div>
</Modal>
);
}
});
export default ModalWrapper;