diff options
fix conflicts
Diffstat (limited to 'ui/app/components/modals/confirm-reset-account')
3 files changed, 24 insertions, 38 deletions
diff --git a/ui/app/components/modals/confirm-reset-account/confirm-reset-account.component.js b/ui/app/components/modals/confirm-reset-account/confirm-reset-account.component.js index 14a4da62a..f1a4542ac 100644 --- a/ui/app/components/modals/confirm-reset-account/confirm-reset-account.component.js +++ b/ui/app/components/modals/confirm-reset-account/confirm-reset-account.component.js @@ -1,8 +1,8 @@ -import React, { Component } from 'react' +import React, { PureComponent } from 'react' import PropTypes from 'prop-types' -import Button from '../../button' +import Modal, { ModalContent } from '../../modal' -class ConfirmResetAccount extends Component { +export default class ConfirmResetAccount extends PureComponent { static propTypes = { hideModal: PropTypes.func.isRequired, resetAccount: PropTypes.func.isRequired, @@ -12,7 +12,7 @@ class ConfirmResetAccount extends Component { t: PropTypes.func, } - handleReset () { + handleReset = () => { this.props.resetAccount() .then(() => this.props.hideModal()) } @@ -21,34 +21,18 @@ class ConfirmResetAccount extends Component { const { t } = this.context return ( - <div className="modal-container"> - <div className="modal-container__content"> - <div className="modal-container__title"> - { `${t('resetAccount')}?` } - </div> - <div className="modal-container__description"> - { t('resetAccountDescription') } - </div> - </div> - <div className="modal-container__footer"> - <Button - type="default" - className="modal-container__footer-button" - onClick={() => this.props.hideModal()} - > - { t('nevermind') } - </Button> - <Button - type="secondary" - className="modal-container__footer-button" - onClick={() => this.handleReset()} - > - { t('reset') } - </Button> - </div> - </div> + <Modal + onSubmit={this.handleReset} + onCancel={() => this.props.hideModal()} + submitText={t('reset')} + cancelText={t('nevermind')} + submitType="secondary" + > + <ModalContent + title={`${t('resetAccount')}?`} + description={t('resetAccountDescription')} + /> + </Modal> ) } } - -export default ConfirmResetAccount diff --git a/ui/app/components/modals/confirm-reset-account/confirm-reset-account.container.js b/ui/app/components/modals/confirm-reset-account/confirm-reset-account.container.js index 9630a5593..c8a7b8478 100644 --- a/ui/app/components/modals/confirm-reset-account/confirm-reset-account.container.js +++ b/ui/app/components/modals/confirm-reset-account/confirm-reset-account.container.js @@ -1,13 +1,16 @@ import { connect } from 'react-redux' +import { compose } from 'recompose' +import withModalProps from '../../../higher-order-components/with-modal-props' import ConfirmResetAccount from './confirm-reset-account.component' - -const { hideModal, resetAccount } = require('../../../actions') +import { resetAccount } from '../../../actions' const mapDispatchToProps = dispatch => { return { - hideModal: () => dispatch(hideModal()), resetAccount: () => dispatch(resetAccount()), } } -export default connect(null, mapDispatchToProps)(ConfirmResetAccount) +export default compose( + withModalProps, + connect(null, mapDispatchToProps) +)(ConfirmResetAccount) diff --git a/ui/app/components/modals/confirm-reset-account/index.js b/ui/app/components/modals/confirm-reset-account/index.js index c812ffc55..ca4d9c5bf 100644 --- a/ui/app/components/modals/confirm-reset-account/index.js +++ b/ui/app/components/modals/confirm-reset-account/index.js @@ -1,2 +1 @@ -import ConfirmResetAccount from './confirm-reset-account.container' -module.exports = ConfirmResetAccount +export { default } from './confirm-reset-account.container' |