aboutsummaryrefslogtreecommitdiffstats
path: root/ui
diff options
context:
space:
mode:
Diffstat (limited to 'ui')
-rw-r--r--ui/app/accounts/account-list-item.js20
-rw-r--r--ui/app/accounts/index.js14
-rw-r--r--ui/app/actions.js74
-rw-r--r--ui/app/components/eth-balance.js4
-rw-r--r--ui/app/css/lib.css17
5 files changed, 74 insertions, 55 deletions
diff --git a/ui/app/accounts/account-list-item.js b/ui/app/accounts/account-list-item.js
index ef7b749e4..16019c88a 100644
--- a/ui/app/accounts/account-list-item.js
+++ b/ui/app/accounts/account-list-item.js
@@ -15,19 +15,21 @@ function AccountListItem () {
}
AccountListItem.prototype.render = function () {
- const identity = this.props.identity
- var isSelected = this.props.selectedAccount === identity.address
- var account = this.props.accounts[identity.address]
+ const { identity, selectedAccount, accounts, onShowDetail } = this.props
+
+ const isSelected = selectedAccount === identity.address
+ const account = accounts[identity.address]
const selectedClass = isSelected ? '.selected' : ''
return (
h(`.accounts-list-option.flex-row.flex-space-between.pointer.hover-white${selectedClass}`, {
key: `account-panel-${identity.address}`,
- onClick: (event) => this.props.onShowDetail(identity.address, event),
+ onClick: (event) => onShowDetail(identity.address, event),
}, [
h('.identicon-wrapper.flex-column.flex-center.select-none', [
this.pendingOrNot(),
+ this.indicateIfLoose(),
h(Identicon, {
address: identity.address,
imageify: true,
@@ -48,7 +50,7 @@ AccountListItem.prototype.render = function () {
},
}, ethUtil.toChecksumAddress(identity.address)),
h(EthBalance, {
- value: account.balance,
+ value: account && account.balance,
style: {
lineHeight: '7px',
marginTop: '10px',
@@ -70,6 +72,14 @@ AccountListItem.prototype.render = function () {
)
}
+AccountListItem.prototype.indicateIfLoose = function () {
+ try { // Sometimes keyrings aren't loaded yet:
+ const type = this.props.keyring.type
+ const isLoose = type !== 'HD Key Tree'
+ return isLoose ? h('.keyring-label', 'LOOSE') : null
+ } catch (e) { return }
+}
+
AccountListItem.prototype.pendingOrNot = function () {
const pending = this.props.pending
if (pending.length === 0) return null
diff --git a/ui/app/accounts/index.js b/ui/app/accounts/index.js
index fcb3a7b0f..edb15eafe 100644
--- a/ui/app/accounts/index.js
+++ b/ui/app/accounts/index.js
@@ -22,6 +22,7 @@ function mapStateToProps (state) {
selectedAccount: state.metamask.selectedAccount,
scrollToBottom: state.appState.scrollToBottom,
pending,
+ keyrings: state.metamask.keyrings,
}
}
@@ -31,9 +32,10 @@ function AccountsScreen () {
}
AccountsScreen.prototype.render = function () {
- var state = this.props
- var identityList = valuesFor(state.identities)
- var unconfTxList = valuesFor(state.unconfTxs)
+ const props = this.props
+ const { keyrings } = props
+ const identityList = valuesFor(props.identities)
+ const unconfTxList = valuesFor(props.unconfTxs)
return (
@@ -69,6 +71,11 @@ AccountsScreen.prototype.render = function () {
}
})
+ const simpleAddress = identity.address.substring(2).toLowerCase()
+ const keyring = keyrings.find((kr) => {
+ return kr.accounts.includes(simpleAddress)
+ })
+
return h(AccountListItem, {
key: `acct-panel-${identity.address}`,
identity,
@@ -76,6 +83,7 @@ AccountsScreen.prototype.render = function () {
accounts: this.props.accounts,
onShowDetail: this.onShowDetail.bind(this),
pending,
+ keyring,
})
}),
diff --git a/ui/app/actions.js b/ui/app/actions.js
index 606460314..d63d36f19 100644
--- a/ui/app/actions.js
+++ b/ui/app/actions.js
@@ -153,7 +153,7 @@ var actions = {
SHOW_NEW_KEYCHAIN: 'SHOW_NEW_KEYCHAIN',
showNewKeychain: showNewKeychain,
-
+ callBackgroundThenUpdate,
}
module.exports = actions
@@ -226,14 +226,7 @@ function createNewVaultAndRestore (password, seed) {
}
function createNewVaultAndKeychain (password) {
- return (dispatch) => {
- background.createNewVaultAndKeychain(password, (err, newState) => {
- if (err) {
- return dispatch(actions.showWarning(err.message))
- }
- dispatch(actions.updateMetamaskState(newState))
- })
- }
+ return callBackgroundThenUpdate(background.createNewVaultAndKeychain, password)
}
function revealSeedConfirmation () {
@@ -255,29 +248,12 @@ function requestRevealSeed (password) {
}
}
-
function addNewKeyring (type, opts) {
- return (dispatch) => {
- dispatch(actions.showLoadingIndication())
- background.addNewKeyring(type, opts, (err) => {
- dispatch(this.hideLoadingIndication())
- if (err) {
- return dispatch(actions.showWarning(err))
- }
- })
- }
+ return callBackgroundThenUpdate(background.addNewKeyring, type, opts)
}
function addNewAccount (ringNumber = 0) {
- return (dispatch) => {
- dispatch(actions.showLoadingIndication())
- background.addNewAccount(ringNumber, (err) => {
- dispatch(this.hideLoadingIndication())
- if (err) {
- return dispatch(actions.showWarning(err))
- }
- })
- }
+ return callBackgroundThenUpdate(background.addNewAccount, ringNumber)
}
function showInfoPage () {
@@ -475,15 +451,7 @@ function updateMetamaskState (newState) {
}
function lockMetamask () {
- return (dispatch) => {
- background.setLocked((err, newState) => {
- dispatch(actions.hideLoadingIndication())
- if (err) {
- return dispatch(actions.displayWarning(err.message))
- }
- dispatch(actions.updateMetamaskState(newState))
- })
- }
+ return callBackgroundThenUpdate(background.setLocked)
}
function showAccountDetail (address) {
@@ -565,7 +533,7 @@ function markNoticeRead (notice) {
background.markNoticeRead(notice, (err, notice) => {
dispatch(this.hideLoadingIndication())
if (err) {
- return dispatch(actions.showWarning(err))
+ return dispatch(actions.displayWarning(err))
}
if (notice) {
return dispatch(actions.showNotice(notice))
@@ -593,14 +561,7 @@ function clearNotices () {
}
function markAccountsFound() {
- return (dispatch) => {
- dispatch(this.showLoadingIndication())
- background.markAccountsFound((err, newState) => {
- dispatch(this.hideLoadingIndication())
- if (err) return dispatch(this.showWarning(err.message))
- dispatch(actions.updateMetamaskState(newState))
- })
- }
+ return callBackgroundThenUpdate(background.markAccountsFound)
}
//
@@ -857,3 +818,24 @@ function shapeShiftRequest (query, options, cb) {
return shapShiftReq.send()
}
}
+
+// Call Background Then Update
+//
+// A function generator for a common pattern wherein:
+// We show loading indication.
+// We call a background method.
+// We hide loading indication.
+// If it errored, we show a warning.
+// If it didn't, we update the state.
+function callBackgroundThenUpdate (method, ...args) {
+ return (dispatch) => {
+ dispatch(actions.showLoadingIndication())
+ method.call(background, ...args, (err, newState) => {
+ dispatch(actions.hideLoadingIndication())
+ if (err) {
+ return dispatch(actions.displayWarning(err.message))
+ }
+ dispatch(actions.updateMetamaskState(newState))
+ })
+ }
+}
diff --git a/ui/app/components/eth-balance.js b/ui/app/components/eth-balance.js
index 46127bed5..57ca84564 100644
--- a/ui/app/components/eth-balance.js
+++ b/ui/app/components/eth-balance.js
@@ -15,9 +15,10 @@ function EthBalanceComponent () {
EthBalanceComponent.prototype.render = function () {
var props = this.props
+ let { value } = props
var style = props.style
var needsParse = this.props.needsParse !== undefined ? this.props.needsParse : true
- const value = formatBalance(props.value, 6, needsParse)
+ value = value ? formatBalance(value, 6, needsParse) : '...'
var width = props.width
return (
@@ -38,6 +39,7 @@ EthBalanceComponent.prototype.render = function () {
EthBalanceComponent.prototype.renderBalance = function (value) {
var props = this.props
if (value === 'None') return value
+ if (value === '...') return value
var balanceObj = generateBalanceObject(value, props.shorten ? 1 : 3)
var balance
var splitBalance = value.split(' ')
diff --git a/ui/app/css/lib.css b/ui/app/css/lib.css
index f5f602729..abbf8667e 100644
--- a/ui/app/css/lib.css
+++ b/ui/app/css/lib.css
@@ -196,6 +196,23 @@ hr.horizontal-line {
align-items: center;
justify-content: center;
padding: 4px;
+ z-index: 1;
+}
+
+.keyring-label {
+ z-index: 1;
+ font-size: 11px;
+ background: rgba(255,0,0,0.8);
+ bottom: -47px;
+ color: white;
+ border-radius: 10px;
+ height: 20px;
+ min-width: 20px;
+ position: relative;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 4px;
}
.ether-balance {
generated by cgit v1.2.3 (git 2.25.1) at 2025-02-15 16:03:09 +0800