import React, { Component } from 'react' import { connect } from 'react-redux' import PropTypes from 'prop-types' import classnames from 'classnames' import { requestRevealSeedWords } from '../../store/actions' import ExportTextContainer from '../../components/ui/export-text-container' import { getMostRecentOverviewPage } from '../../ducks/history/history' import Button from '../../components/ui/button' const PASSWORD_PROMPT_SCREEN = 'PASSWORD_PROMPT_SCREEN' const REVEAL_SEED_SCREEN = 'REVEAL_SEED_SCREEN' class RevealSeedPage extends Component { state = { screen: PASSWORD_PROMPT_SCREEN, password: '', seedWords: null, error: null, } componentDidMount() { const passwordBox = document.getElementById('password-box') if (passwordBox) { passwordBox.focus() } } handleSubmit(event) { event.preventDefault() this.setState({ seedWords: null, error: null }) this.props .requestRevealSeedWords(this.state.password) .then((seedWords) => this.setState({ seedWords, screen: REVEAL_SEED_SCREEN }), ) .catch((error) => this.setState({ error: error.message })) } renderWarning() { return (
{this.context.t('revealSeedWordsWarningTitle')}
{this.context.t('revealSeedWordsWarning')}
) } renderContent() { return this.state.screen === PASSWORD_PROMPT_SCREEN ? this.renderPasswordPromptContent() : this.renderRevealSeedContent() } renderPasswordPromptContent() { const { t } = this.context return (
this.handleSubmit(event)}>
this.setState({ password: event.target.value }) } className={classnames('form-control', { 'form-control--error': this.state.error, })} />
{this.state.error && (
{this.state.error}
)}
) } renderRevealSeedContent() { const { t } = this.context return (
) } renderFooter() { return this.state.screen === PASSWORD_PROMPT_SCREEN ? this.renderPasswordPromptFooter() : this.renderRevealSeedFooter() } renderPasswordPromptFooter() { return (
) } renderRevealSeedFooter() { return (
) } render() { return (
{this.context.t('revealSeedWordsTitle')}
{this.context.t('revealSeedWordsDescription')}
{this.renderWarning()}
{this.renderContent()}
{this.renderFooter()}
) } } RevealSeedPage.propTypes = { requestRevealSeedWords: PropTypes.func, history: PropTypes.object, mostRecentOverviewPage: PropTypes.string.isRequired, } RevealSeedPage.contextTypes = { t: PropTypes.func, } const mapStateToProps = (state) => { return { mostRecentOverviewPage: getMostRecentOverviewPage(state), } } const mapDispatchToProps = (dispatch) => { return { requestRevealSeedWords: (password) => dispatch(requestRevealSeedWords(password)), } } export default connect(mapStateToProps, mapDispatchToProps)(RevealSeedPage)