m/metamask-extension
1
0
Fork 0
mirror of https://github.com/kremalicious/metamask-extension.git synced 2024-12-23 09:52:26 +01:00
Code

account-panel combine panel into account-panel

Browse Source
This commit is contained in:
kumavis 2016-06-23 16:28:57 -07:00
parent e96a53385f
commit d293ef0494
2 changed files with 37 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

49
ui/app/components/account-panel.js
View File

@ -1,13 +1,13 @@
const inherits = require('util').inherits const inherits = require('util').inherits
const Component = require('react').Component const Component = require('react').Component
const h = require('react-hyperscript') const h = require('react-hyperscript')
const Identicon = require('./identicon')
const formatBalance = require('../util').formatBalance const formatBalance = require('../util').formatBalance
const addressSummary = require('../util').addressSummary const addressSummary = require('../util').addressSummary
const Panel = require('./panel')
module.exports = AccountPanel module.exports = AccountPanel
inherits(AccountPanel, Component) inherits(AccountPanel, Component)
function AccountPanel () { function AccountPanel () {
Component.call(this) Component.call(this)
@ -19,13 +19,8 @@ AccountPanel.prototype.render = function () {
var account = state.account || {} var account = state.account || {}
var isFauceting = state.isFauceting var isFauceting = state.isFauceting
var panelOpts = { var panelState = {
key: `accountPanel${identity.address}`, key: `accountPanel${identity.address}`,
onClick: (event) => {
if (state.onShowDetail) {
state.onShowDetail(identity.address, event)
}
},
identiconKey: identity.address, identiconKey: identity.address,
identiconLabel: identity.name, identiconLabel: identity.name,
attributes: [ attributes: [
@ -37,10 +32,40 @@ AccountPanel.prototype.render = function () {
], ],
} }
return h(Panel, panelOpts, return (
!state.onShowDetail ? null : h('.arrow-right.cursor-pointer', [
h('i.fa.fa-chevron-right.fa-lg'), h('.identity-panel.flex-row.flex-space-between', {
])) style: {
flex: '1 0 auto',
cursor: panelState.onClick ? 'pointer' : undefined,
},
onClick: panelState.onClick,
}, [
// account identicon
h('.identicon-wrapper.flex-column.select-none', [
h(Identicon, {
address: panelState.identiconKey,
}),
h('span.font-small', panelState.identiconLabel),
]),
// account address, balance
h('.identity-data.flex-column.flex-justify-center.flex-grow.select-none', [
panelState.attributes.map((attr) => {
return h('.flex-row.flex-space-between', {
key: '' + Math.round(Math.random() * 1000000),
}, [
h('label.font-small.no-select', attr.key),
h('span.font-small', attr.value),
])
}),
]),
])
)
} }
function balanceOrFaucetingIndication (account, isFauceting) { function balanceOrFaucetingIndication (account, isFauceting) {

54
ui/app/components/panel.js
View File

@ -1,54 +0,0 @@
const inherits = require('util').inherits
const Component = require('react').Component
const h = require('react-hyperscript')
const Identicon = require('./identicon')
module.exports = Panel
inherits(Panel, Component)
function Panel () {
Component.call(this)
}
Panel.prototype.render = function () {
var state = this.props
var style = {
flex: '1 0 auto',
}
if (state.onClick) style.cursor = 'pointer'
return (
h('.identity-panel.flex-row.flex-space-between', {
style,
onClick: state.onClick,
}, [
// account identicon
h('.identicon-wrapper.flex-column.select-none', [
h(Identicon, {
address: state.identiconKey,
}),
h('span.font-small', state.identiconLabel),
]),
// account address, balance
h('.identity-data.flex-column.flex-justify-center.flex-grow.select-none', [
state.attributes.map((attr) => {
return h('.flex-row.flex-space-between', {
key: '' + Math.round(Math.random() * 1000000),
}, [
h('label.font-small.no-select', attr.key),
h('span.font-small', attr.value),
])
}),
]),
// outlet for inserting additional stuff
state.children,
])
)
}