diff options
author | Dan Finlay <dan@danfinlay.com> | 2016-05-26 07:54:43 +0800 |
---|---|---|
committer | Dan Finlay <dan@danfinlay.com> | 2016-05-26 07:54:43 +0800 |
commit | 5669f44300fc0493ce2c1221f0c5531eb3850882 (patch) | |
tree | 07d36638c98cf0c8a6a450cdf0d1b05d0d442236 /ui | |
parent | 294b16a275d35983eb9f0e720a84ef95e0fad186 (diff) | |
download | tangerine-wallet-browser-5669f44300fc0493ce2c1221f0c5531eb3850882.tar tangerine-wallet-browser-5669f44300fc0493ce2c1221f0c5531eb3850882.tar.gz tangerine-wallet-browser-5669f44300fc0493ce2c1221f0c5531eb3850882.tar.bz2 tangerine-wallet-browser-5669f44300fc0493ce2c1221f0c5531eb3850882.tar.lz tangerine-wallet-browser-5669f44300fc0493ce2c1221f0c5531eb3850882.tar.xz tangerine-wallet-browser-5669f44300fc0493ce2c1221f0c5531eb3850882.tar.zst tangerine-wallet-browser-5669f44300fc0493ce2c1221f0c5531eb3850882.zip |
Add number indicating pending txs to account list
Diffstat (limited to 'ui')
-rw-r--r-- | ui/app/accounts/account-panel.js | 7 | ||||
-rw-r--r-- | ui/app/accounts/index.js | 16 | ||||
-rw-r--r-- | ui/app/css/lib.css | 14 | ||||
-rw-r--r-- | ui/app/reducers/app.js | 1 |
4 files changed, 37 insertions, 1 deletions
diff --git a/ui/app/accounts/account-panel.js b/ui/app/accounts/account-panel.js index 5ade7fe0e..8afb7308d 100644 --- a/ui/app/accounts/account-panel.js +++ b/ui/app/accounts/account-panel.js @@ -34,6 +34,7 @@ NewComponent.prototype.render = function() { }, [ h('.identicon-wrapper.flex-column.flex-center.select-none', [ + this.pendingOrNot(), h(Identicon, { address: identity.address }), @@ -61,3 +62,9 @@ NewComponent.prototype.render = function() { ]) ) } + +NewComponent.prototype.pendingOrNot = function() { + const pending = this.props.pending + if (pending.length === 0) return null + return h('.pending-dot', pending.length) +} diff --git a/ui/app/accounts/index.js b/ui/app/accounts/index.js index 1a42f7470..9cfab54e5 100644 --- a/ui/app/accounts/index.js +++ b/ui/app/accounts/index.js @@ -12,6 +12,10 @@ module.exports = connect(mapStateToProps)(AccountsScreen) function mapStateToProps(state) { + const pendingTxs = valuesFor(state.metamask.unconfTxs) + const pendingMsgs = valuesFor(state.metamask.unconfMsgs) + const pending = pendingTxs.concat(pendingMsgs) + return { accounts: state.metamask.accounts, identities: state.metamask.identities, @@ -19,6 +23,7 @@ function mapStateToProps(state) { selectedAddress: state.metamask.selectedAddress, currentDomain: state.appState.currentDomain, scrollToBottom: state.appState.scrollToBottom, + pending, } } @@ -62,12 +67,23 @@ AccountsScreen.prototype.render = function() { }, [ identityList.map((identity) => { + const pending = this.props.pending.filter((txOrMsg) => { + if ('txParams' in txOrMsg) { + return txOrMsg.txParams.from === identity.address + } else if ('msgParams' in txOrMsg) { + return txOrMsg.msgParams.from === identity.address + } else { + return false + } + }) + return h(AccountPanel, { key: `acct-panel-${identity.address}`, identity, selectedAddress: this.props.selectedAddress, accounts: this.props.accounts, onShowDetail: this.onShowDetail.bind(this), + pending, }) }), diff --git a/ui/app/css/lib.css b/ui/app/css/lib.css index d9719b1e3..73be4023e 100644 --- a/ui/app/css/lib.css +++ b/ui/app/css/lib.css @@ -166,3 +166,17 @@ hr.horizontal-line { .hover-white:hover { background: white; } + +.pending-dot { + background: red; + left: 57px; + color: white; + border-radius: 10px; + height: 20px; + min-width: 20px; + position: absolute; + display: flex; + align-items: center; + justify-content: center; + padding: 4px; +} diff --git a/ui/app/reducers/app.js b/ui/app/reducers/app.js index 92b44612d..ae7501725 100644 --- a/ui/app/reducers/app.js +++ b/ui/app/reducers/app.js @@ -356,7 +356,6 @@ function reduceApp(state, action) { default: return appState - } } |