const inherits = require('util').inherits const Component = require('react').Component const connect = require('react-redux').connect const h = require('react-hyperscript') const actions = require('../actions') module.exports = connect(mapStateToProps)(RevealSeedConfirmatoin) inherits(RevealSeedConfirmatoin, Component) function RevealSeedConfirmatoin() { Component.call(this) } function mapStateToProps(state) { return { warning: state.appState.warning, } } RevealSeedConfirmatoin.prototype.confirmationPhrase = 'I understand' RevealSeedConfirmatoin.prototype.render = function() { const props = this.props const state = this.state return ( h('.initialize-screen.flex-column.flex-center.flex-grow', [ h('h3.flex-center.text-transform-uppercase', { style: { background: '#EBEBEB', color: '#AEAEAE', marginBottom: 24, width: '100%', fontSize: '20px', padding: 6, }, }, [ 'Reveal Seed Words', ]), h('.div', { style: { display: 'flex', flexDirection: 'column', padding: '20px', justifyContent: 'center', } }, [ h('h4', 'Do not recover your seed words in a public place! These words can be used to steal all your accounts.'), // confirmation h('input.large-input.letter-spacey', { type: 'password', id: 'password-box', placeholder: 'Enter your password to confirm', onKeyPress: this.checkConfirmation.bind(this), style: { width: 260, marginTop: '12px', }, }), h('h4', { style: { marginTop: '12px', color: state && state.confirmationWrong ? 'red' : 'black', } }, `Enter the phrase "I understand" to proceed.`), // confirm confirmation h('input.large-input.letter-spacey', { type: 'text', id: 'confirm-box', placeholder: this.confirmationPhrase, onKeyPress: this.checkConfirmation.bind(this), style: { width: 260, marginTop: 16, }, }), h('.flex-row.flex-space-between', { style: { marginTop: 30, width: '50%', }, }, [ // cancel h('button.primary', { onClick: this.goHome.bind(this), }, 'CANCEL'), // submit h('button.primary', { onClick: this.revealSeedWords.bind(this), }, 'OK'), ]), (props.warning) && ( h('span.error', { style: { margin: '20px', } }, props.warning.split('-')) ), props.inProgress && ( h('span.in-progress-notification', 'Generating Seed...') ), ]), ]) ) } RevealSeedConfirmatoin.prototype.componentDidMount = function(){ document.getElementById('password-box').focus() } RevealSeedConfirmatoin.prototype.goHome = function() { this.props.dispatch(actions.showConfigPage(false)) } // create vault RevealSeedConfirmatoin.prototype.checkConfirmation = function(event) { if (event.key === 'Enter') { event.preventDefault() this.revealSeedWords() } } RevealSeedConfirmatoin.prototype.revealSeedWords = function(){ this.setState({ confirmationWrong: false }) const confirmBox = document.getElementById('confirm-box') const confirmation = confirmBox.value if (confirmation !== this.confirmationPhrase) { confirmBox.value = '' return this.setState({ confirmationWrong: true }) } var password = document.getElementById('password-box').value this.props.dispatch(actions.requestRevealSeed(password)) }