LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Refactor Modal component

Browse source
This commit is contained in:
Alex Liebowitz 2017-02-25 02:45:39 -05:00
parent 2b7c258cf3
commit ce33050fb3
1 changed files with 14 additions and 34 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

48
js/component/modal.js
View file

@ -23,41 +23,21 @@ var Modal = React.createClass({
};
},
render: function() {
var props = Object.assign({}, this.props);
if (typeof props.className == 'undefined') {
props.className = 'modal';
} else {
props.className += ' modal';
}
if (typeof props.overlayClassName == 'undefined') {
props.overlayClassName = 'modal-overlay';
} else {
props.overlayClassName += ' modal-overlay';
}
props.onCloseRequested = props.onAborted || props.onConfirmed;
if (this.props.type == 'custom') {
var buttons = null;
} else {
var buttons = (
<div className="modal__buttons">
{this.props.type == 'confirm'
? <Link button="alt" label={props.abortButtonLabel} className="modal__button" disabled={this.props.abortButtonDisabled} onClick={props.onAborted} />
: null}
<Link button="primary" label={props.confirmButtonLabel} className="modal__button" disabled={this.props.confirmButtonDisabled} onClick={props.onConfirmed} />
</div>
);
}
return (
<ReactModal {...props}>
<div>
{this.props.children}
</div>
{buttons}
<ReactModal onCloseRequested={this.props.onAborted || this.props.onConfirmed} {...this.props}
className={(this.props.className || '') + ' modal'}
overlayClassName={(this.props.overlayClassName || '') + ' modal-overlay'}>
<div>
{this.props.children}
</div>
{this.props.type == 'custom' // custom modals define their own buttons
? null
: <div className="modal__buttons">
{this.props.type == 'confirm'
? <Link button="alt" label={this.props.abortButtonLabel} className="modal__button" disabled={this.props.abortButtonDisabled} onClick={this.props.onAborted} />
: null}
<Link button="primary" label={this.props.confirmButtonLabel} className="modal__button" disabled={this.props.confirmButtonDisabled} onClick={this.props.onConfirmed} />
</div>}
</ReactModal>
);
}