diff options
Diffstat (limited to 'ui/app/components/pages/create-account/import-account/index.js')
-rw-r--r-- | ui/app/components/pages/create-account/import-account/index.js | 96 |
1 files changed, 96 insertions, 0 deletions
diff --git a/ui/app/components/pages/create-account/import-account/index.js b/ui/app/components/pages/create-account/import-account/index.js new file mode 100644 index 000000000..fc9031a65 --- /dev/null +++ b/ui/app/components/pages/create-account/import-account/index.js @@ -0,0 +1,96 @@ +const inherits = require('util').inherits +const Component = require('react').Component +const h = require('react-hyperscript') +const connect = require('react-redux').connect +const t = require('../../../i18n') +import Select from 'react-select' + +// Subviews +const JsonImportView = require('./json.js') +const PrivateKeyImportView = require('./private-key.js') + +const menuItems = [ + t('privateKey'), + t('jsonFile'), +] + +module.exports = connect(mapStateToProps)(AccountImportSubview) + +function mapStateToProps (state) { + return { + menuItems, + } +} + +inherits(AccountImportSubview, Component) +function AccountImportSubview () { + Component.call(this) +} + +AccountImportSubview.prototype.render = function () { + const props = this.props + const state = this.state || {} + const { menuItems } = props + const { type } = state + + return ( + h('div.new-account-import-form', [ + + h('.new-account-import-disclaimer', [ + h('span', t('importAccountMsg')), + h('span', { + style: { + cursor: 'pointer', + textDecoration: 'underline', + }, + onClick: () => { + global.platform.openWindow({ + url: 'https://metamask.helpscoutdocs.com/article/17-what-are-loose-accounts', + }) + }, + }, t('here')), + ]), + + h('div.new-account-import-form__select-section', [ + + h('div.new-account-import-form__select-label', t('selectType')), + + h(Select, { + className: 'new-account-import-form__select', + name: 'import-type-select', + clearable: false, + value: type || menuItems[0], + options: menuItems.map((type) => { + return { + value: type, + label: type, + } + }), + onChange: (opt) => { + this.setState({ type: opt.value }) + }, + }), + + ]), + + this.renderImportView(), + ]) + ) +} + +AccountImportSubview.prototype.renderImportView = function () { + const props = this.props + const state = this.state || {} + const { type } = state + const { menuItems } = props + const current = type || menuItems[0] + + switch (current) { + case t('privateKey'): + return h(PrivateKeyImportView) + case t('jsonFile'): + return h(JsonImportView) + default: + return h(JsonImportView) + } +} |