1
0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 01:39:44 +01:00

Scaffold new account view

This commit is contained in:
Dan Finlay 2016-11-04 12:00:56 -07:00
parent e3fb7fa7bb
commit 1bbe0ed9e8
9 changed files with 192 additions and 2 deletions

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,66 @@
{
"metamask": {
"isInitialized": true,
"isUnlocked": true,
"rpcTarget": "https://rawtestrpc.metamask.io/",
"identities": {
"0xa6ef573d60594731178b7f85d80da13cc2af52dd": {
"address": "0xa6ef573d60594731178b7f85d80da13cc2af52dd",
"name": "Dan! 1"
},
"0xf9f52e84ad2c9122caa87478d27041ddaa215666": {
"address": "0xf9f52e84ad2c9122caa87478d27041ddaa215666",
"name": "Account 2"
}
},
"unconfTxs": {},
"currentFiat": "USD",
"conversionRate": 10.92067835,
"conversionDate": 1478282884,
"network": null,
"accounts": {
"0xa6ef573d60594731178b7f85d80da13cc2af52dd": {
"balance": "0x00",
"nonce": "0x100000",
"code": "0x",
"address": "0xa6ef573d60594731178b7f85d80da13cc2af52dd"
},
"0xf9f52e84ad2c9122caa87478d27041ddaa215666": {
"balance": "0x00",
"nonce": "0x100000",
"code": "0x",
"address": "0xf9f52e84ad2c9122caa87478d27041ddaa215666"
}
},
"transactions": [],
"provider": {
"type": "testnet"
},
"selectedAccount": "0xa6ef573d60594731178b7f85d80da13cc2af52dd",
"isConfirmed": true,
"unconfMsgs": {},
"messages": [],
"selectedAddress": "0xa6ef573d60594731178b7f85d80da13cc2af52dd",
"shapeShiftTxList": [],
"keyringTypes": [
"Simple Key Pair",
"HD Key Tree"
]
},
"appState": {
"menuOpen": false,
"currentView": {
"name": "new-account"
},
"accountDetail": {
"subview": "transactions"
},
"transForward": true,
"isLoading": false,
"warning": null,
"forgottenPassword": null,
"detailView": {},
"scrollToBottom": false
},
"identities": {}
}

View File

@ -143,7 +143,7 @@ AccountsScreen.prototype.onShowDetail = function (address, event) {
} }
AccountsScreen.prototype.addNewAccount = function () { AccountsScreen.prototype.addNewAccount = function () {
this.props.dispatch(actions.addNewAccount(0)) this.props.dispatch(actions.navigateToNewAccountScreen())
} }
AccountsScreen.prototype.goHome = function () { AccountsScreen.prototype.goHome = function () {

60
ui/app/accounts/new.js Normal file
View File

@ -0,0 +1,60 @@
const inherits = require('util').inherits
const Component = require('react').Component
const h = require('react-hyperscript')
const connect = require('react-redux').connect
const TabBar = require('../components/tab-bar')
module.exports = connect(mapStateToProps)(NewAccountScreen)
function mapStateToProps (state) {
return {}
}
inherits(NewAccountScreen, Component)
function NewAccountScreen () {
Component.call(this)
}
NewAccountScreen.prototype.render = function () {
const props = this.props
const state = this.state || {}
const subview = state.subview || 'new'
return (
h('.flex-column', {
style: {
},
}, [
// title and nav
h('.flex-row.space-between', {
style: {
alignItems: 'center',
padding: '0px 20px',
}
}, [
h('i.fa.fa-arrow-left.fa-lg.cursor-pointer', {
onClick: this.goHome.bind(this),
}),
h('h2.page-subtitle', 'Add Account'),
h('i', { style: { width: '18px' } }),
]),
h(TabBar, {
tabs: [
{ content: 'Create New', key: 'new' },
{ content: 'Import', key: 'import' },
],
defaultTab: 'new',
tabSelected: (key) => {
console.log('selected ' + key)
}
}),
])
)
}
NewAccountScreen.prototype.goHome = function() {
this.props.dispatch(actions.showAccountPage())
}

View File

@ -28,6 +28,8 @@ var actions = {
createNewVaultInProgress: createNewVaultInProgress, createNewVaultInProgress: createNewVaultInProgress,
addNewKeyring, addNewKeyring,
addNewAccount, addNewAccount,
NEW_ACCOUNT_SCREEN: 'NEW_ACCOUNT_SCREEN',
navigateToNewAccountScreen,
showNewVaultSeed: showNewVaultSeed, showNewVaultSeed: showNewVaultSeed,
showInfoPage: showInfoPage, showInfoPage: showInfoPage,
// seed recovery actions // seed recovery actions
@ -250,6 +252,12 @@ function addNewKeyring (type, opts) {
} }
} }
function navigateToNewAccountScreen() {
return {
type: this.NEW_ACCOUNT_SCREEN
}
}
function addNewAccount (ringNumber = 0) { function addNewAccount (ringNumber = 0) {
return (dispatch) => { return (dispatch) => {
dispatch(actions.showLoadingIndication()) dispatch(actions.showLoadingIndication())

View File

@ -29,6 +29,7 @@ const QrView = require('./components/qr-code')
const HDCreateVaultComplete = require('./keychains/hd/create-vault-complete') const HDCreateVaultComplete = require('./keychains/hd/create-vault-complete')
const HDRestoreVaultScreen = require('./keychains/hd/restore-vault') const HDRestoreVaultScreen = require('./keychains/hd/restore-vault')
const RevealSeedConfirmation = require('./keychains/hd/recover-seed/confirmation') const RevealSeedConfirmation = require('./keychains/hd/recover-seed/confirmation')
const NewAccountScreen = require('./accounts/new')
module.exports = connect(mapStateToProps)(App) module.exports = connect(mapStateToProps)(App)
@ -400,6 +401,9 @@ App.prototype.renderPrimary = function () {
case 'accountDetail': case 'accountDetail':
return h(AccountDetailScreen, {key: 'account-detail'}) return h(AccountDetailScreen, {key: 'account-detail'})
case 'new-account':
return h(NewAccountScreen, {key: 'new-account'})
case 'sendTransaction': case 'sendTransaction':
return h(SendTransactionScreen, {key: 'send-transaction'}) return h(SendTransactionScreen, {key: 'send-transaction'})

View File

@ -0,0 +1,35 @@
const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits
module.exports = TabBar
inherits(TabBar, Component)
function TabBar () {
Component.call(this)
}
TabBar.prototype.render = function () {
const props = this.props
const state = this.state || {}
const { tabs = [], defaultTab, tabSelected } = props
const { subview = defaultTab } = state
return (
h('.flex-row.space-around.text-transform-uppercase', {
style: {
background: '#EBEBEB',
color: '#AEAEAE',
paddingTop: '4px',
},
}, tabs.map((tab) => {
const { key, content } = tab
return h(subview === key ? '.activeForm' : '.inactiveForm.pointer', {
onClick: () => {
this.setState({ subview: key })
tabSelected(key)
},
}, content)
}))
)
}

View File

@ -23,6 +23,14 @@
flex-direction: column; flex-direction: column;
} }
.space-between {
justify-content: space-between;
}
.space-around {
justify-content: space-around;
}
.flex-column-bottom { .flex-column-bottom {
display: flex; display: flex;
flex-direction: column-reverse; flex-direction: column-reverse;

View File

@ -106,6 +106,15 @@ function reduceApp (state, action) {
isLoading: false, isLoading: false,
}) })
case actions.NEW_ACCOUNT_SCREEN:
return extend(appState, {
currentView: {
name: 'new-account',
context: appState.currentView.context,
},
transForward: true,
})
case actions.SHOW_SEND_PAGE: case actions.SHOW_SEND_PAGE:
return extend(appState, { return extend(appState, {
currentView: { currentView: {