2017-06-08_509bba0/509bba0_unpacked_with_node_modules/discord_app/components/PasswordConfirmModal.js
2022-07-26 10:06:20 -07:00

104 lines
2.6 KiB
JavaScript
Executable file

/* @flow */
import React, {PropTypes} from 'react';
import PureRenderMixin from 'react-addons-pure-render-mixin';
import i18n from '../i18n';
import className from 'classnames';
import SaveButton from './common/SaveButton';
const PASSWORD_REF = 'password';
const PasswordConfirmModal = React.createClass({
mixins: [PureRenderMixin],
statics: {
key: () => 'password-confirm-modal',
},
propTypes: {
onClose: PropTypes.func.isRequired,
handleSubmit: PropTypes.func.isRequired,
title: PropTypes.string.isRequired,
actionText: PropTypes.string.isRequired,
btnClass: PropTypes.string.isRequired,
children: PropTypes.any,
},
getDefaultProps() {
return {
btnClass: '',
};
},
getInitialState() {
return {
error: null,
isLoading: false,
};
},
render() {
const {title, actionText, children} = this.props;
const {error, isLoading} = this.state;
const childrenContainer = React.Children.count(children)
? <div className="change-nickname-warning">
{children}
</div>
: null;
return (
<form className="modal-content form" tabIndex="0" onSubmit={this.handleSubmit}>
<div className="form-header">
<header>{title}</header>
</div>
<div className="form-inner">
{childrenContainer}
<div className={className('control-group', {error})}>
<label htmlFor="password-confirm">
{i18n.Messages.FORM_LABEL_PASSWORD}
{error ? <span className="error"> ({error})</span> : null}
</label>
<input id="password-confirm" type="password" ref={PASSWORD_REF} autoComplete="off" autoFocus />
</div>
</div>
<div className="form-actions">
<button type="button" className="btn btn-default" onClick={isLoading ? null : this.handleCancel}>
{i18n.Messages.CANCEL}
</button>
<SaveButton className={`btn btn-primary ${this.props.btnClass}`} disabled={isLoading}>
{actionText || i18n.Messages.CONFIRM}
</SaveButton>
</div>
</form>
);
},
// Utils
handleSubmit(e: Event) {
e.preventDefault();
this.setState({isLoading: true});
this.props.handleSubmit(this.refs[PASSWORD_REF].value).then(
() => this.props.onClose(),
res => {
if (res.body && res.body.message) {
this.setState({error: res.body.message, isLoading: false});
}
}
);
},
handleCancel() {
this.props.onClose();
},
});
export default PasswordConfirmModal;
// WEBPACK FOOTER //
// ./discord_app/components/PasswordConfirmModal.js