Remove unused InitializeMenuScreen component (#6075)
Whymarrh Whitby
6 years ago
committed by
GitHub
parent
79cd40b979
commit
b2813d1113
@ -1,224 +0,0 @@ |
|||||||
const { EventEmitter } = require('events') |
|
||||||
const { Component } = require('react') |
|
||||||
const PropTypes = require('prop-types') |
|
||||||
const connect = require('react-redux').connect |
|
||||||
const h = require('react-hyperscript') |
|
||||||
const Mascot = require('../components/mascot') |
|
||||||
const actions = require('../actions') |
|
||||||
const Tooltip = require('../components/tooltip') |
|
||||||
const getCaretCoordinates = require('textarea-caret') |
|
||||||
const { RESTORE_VAULT_ROUTE, DEFAULT_ROUTE } = require('../routes') |
|
||||||
const { getEnvironmentType } = require('../../../app/scripts/lib/util') |
|
||||||
const { ENVIRONMENT_TYPE_POPUP } = require('../../../app/scripts/lib/enums') |
|
||||||
|
|
||||||
class InitializeMenuScreen extends Component { |
|
||||||
constructor (props) { |
|
||||||
super(props) |
|
||||||
|
|
||||||
this.animationEventEmitter = new EventEmitter() |
|
||||||
this.state = { |
|
||||||
warning: null, |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
componentWillMount () { |
|
||||||
const { isInitialized, isUnlocked, history } = this.props |
|
||||||
if (isInitialized || isUnlocked) { |
|
||||||
history.push(DEFAULT_ROUTE) |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
componentDidMount () { |
|
||||||
document.getElementById('password-box').focus() |
|
||||||
} |
|
||||||
|
|
||||||
render () { |
|
||||||
const { warning } = this.state |
|
||||||
|
|
||||||
return ( |
|
||||||
h('.initialize-screen.flex-column.flex-center', [ |
|
||||||
|
|
||||||
h(Mascot, { |
|
||||||
animationEventEmitter: this.animationEventEmitter, |
|
||||||
}), |
|
||||||
|
|
||||||
h('h1', { |
|
||||||
style: { |
|
||||||
fontSize: '1.3em', |
|
||||||
textTransform: 'uppercase', |
|
||||||
color: '#7F8082', |
|
||||||
marginBottom: 10, |
|
||||||
}, |
|
||||||
}, this.context.t('appName')), |
|
||||||
|
|
||||||
h('div', [ |
|
||||||
h('h3', { |
|
||||||
style: { |
|
||||||
fontSize: '0.8em', |
|
||||||
color: '#7F8082', |
|
||||||
display: 'inline', |
|
||||||
}, |
|
||||||
}, this.context.t('encryptNewDen')), |
|
||||||
|
|
||||||
h(Tooltip, { |
|
||||||
title: this.context.t('denExplainer'), |
|
||||||
}, [ |
|
||||||
h('i.fa.fa-question-circle.pointer', { |
|
||||||
style: { |
|
||||||
fontSize: '18px', |
|
||||||
position: 'relative', |
|
||||||
color: 'rgb(247, 134, 28)', |
|
||||||
top: '2px', |
|
||||||
marginLeft: '4px', |
|
||||||
}, |
|
||||||
}), |
|
||||||
]), |
|
||||||
]), |
|
||||||
|
|
||||||
h('span.error.in-progress-notification', warning), |
|
||||||
|
|
||||||
// password
|
|
||||||
h('input.large-input.letter-spacey', { |
|
||||||
type: 'password', |
|
||||||
id: 'password-box', |
|
||||||
placeholder: this.context.t('newPassword'), |
|
||||||
onInput: this.inputChanged.bind(this), |
|
||||||
style: { |
|
||||||
width: 260, |
|
||||||
marginTop: 12, |
|
||||||
}, |
|
||||||
}), |
|
||||||
|
|
||||||
// confirm password
|
|
||||||
h('input.large-input.letter-spacey', { |
|
||||||
type: 'password', |
|
||||||
id: 'password-box-confirm', |
|
||||||
placeholder: this.context.t('confirmPassword'), |
|
||||||
onKeyPress: this.createVaultOnEnter.bind(this), |
|
||||||
onInput: this.inputChanged.bind(this), |
|
||||||
style: { |
|
||||||
width: 260, |
|
||||||
marginTop: 16, |
|
||||||
}, |
|
||||||
}), |
|
||||||
|
|
||||||
|
|
||||||
h('button.primary', { |
|
||||||
onClick: this.createNewVaultAndKeychain.bind(this), |
|
||||||
style: { |
|
||||||
margin: 12, |
|
||||||
}, |
|
||||||
}, this.context.t('createDen')), |
|
||||||
|
|
||||||
h('.flex-row.flex-center.flex-grow', [ |
|
||||||
h('p.pointer', { |
|
||||||
onClick: () => this.showRestoreVault(), |
|
||||||
style: { |
|
||||||
fontSize: '0.8em', |
|
||||||
color: 'rgb(247, 134, 28)', |
|
||||||
textDecoration: 'underline', |
|
||||||
}, |
|
||||||
}, this.context.t('importDen')), |
|
||||||
]), |
|
||||||
|
|
||||||
h('.flex-row.flex-center.flex-grow', [ |
|
||||||
h('p.pointer', { |
|
||||||
onClick: this.showOldUI.bind(this), |
|
||||||
style: { |
|
||||||
fontSize: '0.8em', |
|
||||||
color: '#aeaeae', |
|
||||||
textDecoration: 'underline', |
|
||||||
marginTop: '32px', |
|
||||||
}, |
|
||||||
}, this.context.t('classicInterface')), |
|
||||||
]), |
|
||||||
|
|
||||||
]) |
|
||||||
) |
|
||||||
} |
|
||||||
|
|
||||||
createVaultOnEnter (event) { |
|
||||||
if (event.key === 'Enter') { |
|
||||||
event.preventDefault() |
|
||||||
this.createNewVaultAndKeychain() |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
createNewVaultAndKeychain () { |
|
||||||
const { history } = this.props |
|
||||||
var passwordBox = document.getElementById('password-box') |
|
||||||
var password = passwordBox.value |
|
||||||
var passwordConfirmBox = document.getElementById('password-box-confirm') |
|
||||||
var passwordConfirm = passwordConfirmBox.value |
|
||||||
|
|
||||||
this.setState({ warning: null }) |
|
||||||
|
|
||||||
if (password.length < 8) { |
|
||||||
this.setState({ warning: this.context.t('passwordShort') }) |
|
||||||
return |
|
||||||
} |
|
||||||
|
|
||||||
if (password !== passwordConfirm) { |
|
||||||
this.setState({ warning: this.context.t('passwordMismatch') }) |
|
||||||
return |
|
||||||
} |
|
||||||
|
|
||||||
this.props.createNewVaultAndKeychain(password) |
|
||||||
.then(() => history.push(DEFAULT_ROUTE)) |
|
||||||
} |
|
||||||
|
|
||||||
inputChanged (event) { |
|
||||||
// tell mascot to look at page action
|
|
||||||
var element = event.target |
|
||||||
var boundingRect = element.getBoundingClientRect() |
|
||||||
var coordinates = getCaretCoordinates(element, element.selectionEnd) |
|
||||||
this.animationEventEmitter.emit('point', { |
|
||||||
x: boundingRect.left + coordinates.left - element.scrollLeft, |
|
||||||
y: boundingRect.top + coordinates.top - element.scrollTop, |
|
||||||
}) |
|
||||||
} |
|
||||||
|
|
||||||
showRestoreVault () { |
|
||||||
this.props.markPasswordForgotten() |
|
||||||
if (getEnvironmentType(window.location.href) === ENVIRONMENT_TYPE_POPUP) { |
|
||||||
global.platform.openExtensionInBrowser() |
|
||||||
} |
|
||||||
|
|
||||||
this.props.history.push(RESTORE_VAULT_ROUTE) |
|
||||||
} |
|
||||||
|
|
||||||
showOldUI () { |
|
||||||
this.props.dispatch(actions.setFeatureFlag('betaUI', false, 'OLD_UI_NOTIFICATION_MODAL')) |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
InitializeMenuScreen.propTypes = { |
|
||||||
history: PropTypes.object, |
|
||||||
isInitialized: PropTypes.bool, |
|
||||||
isUnlocked: PropTypes.bool, |
|
||||||
createNewVaultAndKeychain: PropTypes.func, |
|
||||||
markPasswordForgotten: PropTypes.func, |
|
||||||
dispatch: PropTypes.func, |
|
||||||
} |
|
||||||
|
|
||||||
InitializeMenuScreen.contextTypes = { |
|
||||||
t: PropTypes.func, |
|
||||||
} |
|
||||||
|
|
||||||
const mapStateToProps = state => { |
|
||||||
const { metamask: { isInitialized, isUnlocked } } = state |
|
||||||
|
|
||||||
return { |
|
||||||
isInitialized, |
|
||||||
isUnlocked, |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
const mapDispatchToProps = dispatch => { |
|
||||||
return { |
|
||||||
createNewVaultAndKeychain: password => dispatch(actions.createNewVaultAndKeychain(password)), |
|
||||||
markPasswordForgotten: () => dispatch(actions.markPasswordForgotten()), |
|
||||||
} |
|
||||||
} |
|
||||||
|
|
||||||
module.exports = connect(mapStateToProps, mapDispatchToProps)(InitializeMenuScreen) |
|
||||||
Loading…
Reference in new issue