aboutsummaryrefslogtreecommitdiffstats
path: root/old-ui/app/components
diff options
context:
space:
mode:
Diffstat (limited to 'old-ui/app/components')
-rw-r--r--old-ui/app/components/account-dropdowns.js7
-rw-r--r--old-ui/app/components/coinbase-form.js2
-rw-r--r--old-ui/app/components/dropdown.js2
-rw-r--r--old-ui/app/components/network.js20
-rw-r--r--old-ui/app/components/pending-tx.js3
-rw-r--r--old-ui/app/components/token-list.js5
-rw-r--r--old-ui/app/components/transaction-list-item.js141
-rw-r--r--old-ui/app/components/transaction-list.js2
8 files changed, 126 insertions, 56 deletions
diff --git a/old-ui/app/components/account-dropdowns.js b/old-ui/app/components/account-dropdowns.js
index a3908f45d..53468a1a1 100644
--- a/old-ui/app/components/account-dropdowns.js
+++ b/old-ui/app/components/account-dropdowns.js
@@ -1,5 +1,5 @@
const Component = require('react').Component
-const PropTypes = require('react').PropTypes
+const PropTypes = require('prop-types')
const h = require('react-hyperscript')
const actions = require('../../../ui/app/actions')
const genAccountLink = require('etherscan-link').createAccountLink
@@ -79,7 +79,7 @@ class AccountDropdowns extends Component {
try { // Sometimes keyrings aren't loaded yet:
const type = keyring.type
const isLoose = type !== 'HD Key Tree'
- return isLoose ? h('.keyring-label', 'LOOSE') : null
+ return isLoose ? h('.keyring-label', 'IMPORTED') : null
} catch (e) { return }
}
@@ -173,7 +173,7 @@ class AccountDropdowns extends Component {
minWidth: '180px',
},
isOpen: optionsMenuActive,
- onClickOutside: () => {
+ onClickOutside: (event) => {
const { classList } = event.target
const isNotToggleElement = !classList.contains(this.optionsMenuToggleClassName)
if (optionsMenuActive && isNotToggleElement) {
@@ -268,6 +268,7 @@ class AccountDropdowns extends Component {
'i.fa.fa-ellipsis-h',
{
style: {
+ margin: '0.5em',
fontSize: '1.8em',
},
onClick: (event) => {
diff --git a/old-ui/app/components/coinbase-form.js b/old-ui/app/components/coinbase-form.js
index 35b2111ff..1a1b77b50 100644
--- a/old-ui/app/components/coinbase-form.js
+++ b/old-ui/app/components/coinbase-form.js
@@ -40,7 +40,7 @@ CoinbaseForm.prototype.render = function () {
}, 'Continue to Coinbase'),
h('button.btn-red', {
- onClick: () => props.dispatch(actions.backTobuyView(props.accounts.address)),
+ onClick: () => props.dispatch(actions.goHome()),
}, 'Cancel'),
]),
])
diff --git a/old-ui/app/components/dropdown.js b/old-ui/app/components/dropdown.js
index cdd864cc3..fb606d2c5 100644
--- a/old-ui/app/components/dropdown.js
+++ b/old-ui/app/components/dropdown.js
@@ -1,5 +1,5 @@
const Component = require('react').Component
-const PropTypes = require('react').PropTypes
+const PropTypes = require('prop-types')
const h = require('react-hyperscript')
const MenuDroppo = require('./menu-droppo')
const extend = require('xtend')
diff --git a/old-ui/app/components/network.js b/old-ui/app/components/network.js
index 0dbe37cdd..59596dabd 100644
--- a/old-ui/app/components/network.js
+++ b/old-ui/app/components/network.js
@@ -23,14 +23,15 @@ Network.prototype.render = function () {
if (networkNumber === 'loading') {
return h('span.pointer', {
+ className: props.onClick && 'pointer',
style: {
display: 'flex',
alignItems: 'center',
flexDirection: 'row',
},
- onClick: (event) => this.props.onClick(event),
+ onClick: (event) => props.onClick && props.onClick(event),
}, [
- h('img', {
+ props.onClick && h('img', {
title: 'Attempting to connect to blockchain.',
style: {
width: '27px',
@@ -60,9 +61,10 @@ Network.prototype.render = function () {
}
return (
- h('#network_component.pointer', {
+ h('#network_component', {
+ className: props.onClick && 'pointer',
title: hoverText,
- onClick: (event) => this.props.onClick(event),
+ onClick: (event) => props.onClick && props.onClick(event),
}, [
(function () {
switch (iconName) {
@@ -74,7 +76,7 @@ Network.prototype.render = function () {
color: '#039396',
}},
'Main Network'),
- h('i.fa.fa-caret-down.fa-lg'),
+ props.onClick && h('i.fa.fa-caret-down.fa-lg'),
])
case 'ropsten-test-network':
return h('.network-indicator', [
@@ -84,7 +86,7 @@ Network.prototype.render = function () {
color: '#ff6666',
}},
'Ropsten Test Net'),
- h('i.fa.fa-caret-down.fa-lg'),
+ props.onClick && h('i.fa.fa-caret-down.fa-lg'),
])
case 'kovan-test-network':
return h('.network-indicator', [
@@ -94,7 +96,7 @@ Network.prototype.render = function () {
color: '#690496',
}},
'Kovan Test Net'),
- h('i.fa.fa-caret-down.fa-lg'),
+ props.onClick && h('i.fa.fa-caret-down.fa-lg'),
])
case 'rinkeby-test-network':
return h('.network-indicator', [
@@ -104,7 +106,7 @@ Network.prototype.render = function () {
color: '#e7a218',
}},
'Rinkeby Test Net'),
- h('i.fa.fa-caret-down.fa-lg'),
+ props.onClick && h('i.fa.fa-caret-down.fa-lg'),
])
default:
return h('.network-indicator', [
@@ -120,7 +122,7 @@ Network.prototype.render = function () {
color: '#AEAEAE',
}},
'Private Network'),
- h('i.fa.fa-caret-down.fa-lg'),
+ props.onClick && h('i.fa.fa-caret-down.fa-lg'),
])
}
})(),
diff --git a/old-ui/app/components/pending-tx.js b/old-ui/app/components/pending-tx.js
index 10208b5ce..720df2243 100644
--- a/old-ui/app/components/pending-tx.js
+++ b/old-ui/app/components/pending-tx.js
@@ -60,7 +60,8 @@ PendingTx.prototype.render = function () {
// Gas
const gas = txParams.gas
const gasBn = hexToBn(gas)
- const gasLimit = new BN(parseInt(blockGasLimit))
+ // default to 8MM gas limit
+ const gasLimit = new BN(parseInt(blockGasLimit) || '8000000')
const safeGasLimitBN = this.bnMultiplyByFraction(gasLimit, 19, 20)
const saferGasLimitBN = this.bnMultiplyByFraction(gasLimit, 18, 20)
const safeGasLimit = safeGasLimitBN.toString(10)
diff --git a/old-ui/app/components/token-list.js b/old-ui/app/components/token-list.js
index 998ec901d..149733b89 100644
--- a/old-ui/app/components/token-list.js
+++ b/old-ui/app/components/token-list.js
@@ -194,10 +194,7 @@ TokenList.prototype.componentWillUpdate = function (nextProps) {
}
TokenList.prototype.updateBalances = function (tokens) {
- const heldTokens = tokens.filter(token => {
- return token.balance !== '0' && token.string !== '0.000'
- })
- this.setState({ tokens: heldTokens, isLoading: false })
+ this.setState({ tokens, isLoading: false })
}
TokenList.prototype.componentWillUnmount = function () {
diff --git a/old-ui/app/components/transaction-list-item.js b/old-ui/app/components/transaction-list-item.js
index 76a456d3f..7ab3414e5 100644
--- a/old-ui/app/components/transaction-list-item.js
+++ b/old-ui/app/components/transaction-list-item.js
@@ -1,6 +1,7 @@
const Component = require('react').Component
const h = require('react-hyperscript')
const inherits = require('util').inherits
+const connect = require('react-redux').connect
const EthBalance = require('./eth-balance')
const addressSummary = require('../util').addressSummary
@@ -9,18 +10,40 @@ const CopyButton = require('./copyButton')
const vreme = new (require('vreme'))()
const Tooltip = require('./tooltip')
const numberToBN = require('number-to-bn')
+const actions = require('../../../ui/app/actions')
const TransactionIcon = require('./transaction-list-item-icon')
const ShiftListItem = require('./shift-list-item')
-module.exports = TransactionListItem
+
+const mapDispatchToProps = dispatch => {
+ return {
+ retryTransaction: transactionId => dispatch(actions.retryTransaction(transactionId)),
+ }
+}
+
+module.exports = connect(null, mapDispatchToProps)(TransactionListItem)
inherits(TransactionListItem, Component)
function TransactionListItem () {
Component.call(this)
}
+TransactionListItem.prototype.showRetryButton = function () {
+ const { transaction = {}, transactions } = this.props
+ const { status, submittedTime, txParams } = transaction
+ const currentNonce = txParams.nonce
+ const currentNonceTxs = transactions.filter(tx => tx.txParams.nonce === currentNonce)
+ const currentNonceSubmittedTxs = currentNonceTxs.filter(tx => tx.status === 'submitted')
+ const lastSubmittedTxWithCurrentNonce = currentNonceSubmittedTxs[0]
+ const currentTxIsLatestWithNonce = lastSubmittedTxWithCurrentNonce
+ && lastSubmittedTxWithCurrentNonce.id === transaction.id
+
+ return currentTxIsLatestWithNonce && Date.now() - submittedTime > 30000
+}
+
TransactionListItem.prototype.render = function () {
const { transaction, network, conversionRate, currentCurrency } = this.props
+ const { status } = transaction
if (transaction.key === 'shapeshift') {
if (network === '1') return h(ShiftListItem, transaction)
}
@@ -32,7 +55,7 @@ TransactionListItem.prototype.render = function () {
var isMsg = ('msgParams' in transaction)
var isTx = ('txParams' in transaction)
- var isPending = transaction.status === 'unapproved'
+ var isPending = status === 'unapproved'
let txParams
if (isTx) {
txParams = transaction.txParams
@@ -44,7 +67,7 @@ TransactionListItem.prototype.render = function () {
const isClickable = ('hash' in transaction && isLinkable) || isPending
return (
- h(`.transaction-list-item.flex-row.flex-space-between${isClickable ? '.pointer' : ''}`, {
+ h('.transaction-list-item.flex-column', {
onClick: (event) => {
if (isPending) {
this.props.showTx(transaction.id)
@@ -56,51 +79,92 @@ TransactionListItem.prototype.render = function () {
},
style: {
padding: '20px 0',
- display: 'flex',
- justifyContent: 'space-between',
+ alignItems: 'center',
},
}, [
+ h(`.flex-row.flex-space-between${isClickable ? '.pointer' : ''}`, {
+ style: {
+ width: '100%',
+ },
+ }, [
+ h('.identicon-wrapper.flex-column.flex-center.select-none', [
+ h(TransactionIcon, { txParams, transaction, isTx, isMsg }),
+ ]),
- h('.identicon-wrapper.flex-column.flex-center.select-none', [
- h(TransactionIcon, { txParams, transaction, isTx, isMsg }),
+ h(Tooltip, {
+ title: 'Transaction Number',
+ position: 'right',
+ }, [
+ h('span', {
+ style: {
+ display: 'flex',
+ cursor: 'normal',
+ flexDirection: 'column',
+ alignItems: 'center',
+ justifyContent: 'center',
+ padding: '10px',
+ },
+ }, nonce),
+ ]),
+
+ h('.flex-column', {style: {width: '200px', overflow: 'hidden'}}, [
+ domainField(txParams),
+ h('div', date),
+ recipientField(txParams, transaction, isTx, isMsg),
+ ]),
+
+ // Places a copy button if tx is successful, else places a placeholder empty div.
+ transaction.hash ? h(CopyButton, { value: transaction.hash }) : h('div', {style: { display: 'flex', alignItems: 'center', width: '26px' }}),
+
+ isTx ? h(EthBalance, {
+ value: txParams.value,
+ conversionRate,
+ currentCurrency,
+ width: '55px',
+ shorten: true,
+ showFiat: false,
+ style: {fontSize: '15px'},
+ }) : h('.flex-column'),
]),
- h(Tooltip, {
- title: 'Transaction Number',
- position: 'right',
+ this.showRetryButton() && h('.transition-list-item__retry.grow-on-hover', {
+ onClick: event => {
+ event.stopPropagation()
+ this.resubmit()
+ },
+ style: {
+ height: '22px',
+ borderRadius: '22px',
+ color: '#F9881B',
+ padding: '0 20px',
+ backgroundColor: '#FFE3C9',
+ display: 'flex',
+ justifyContent: 'center',
+ alignItems: 'center',
+ fontSize: '8px',
+ cursor: 'pointer',
+ },
}, [
- h('span', {
+ h('div', {
style: {
- display: 'flex',
- cursor: 'normal',
- flexDirection: 'column',
- alignItems: 'center',
- justifyContent: 'center',
+ paddingRight: '2px',
},
- }, nonce),
- ]),
-
- h('.flex-column', {style: {width: '150px', overflow: 'hidden'}}, [
- domainField(txParams),
- h('div', date),
- recipientField(txParams, transaction, isTx, isMsg),
+ }, 'Taking too long?'),
+ h('div', {
+ style: {
+ textDecoration: 'underline',
+ },
+ }, 'Retry with a higher gas price here'),
]),
-
- // Places a copy button if tx is successful, else places a placeholder empty div.
- transaction.hash ? h(CopyButton, { value: transaction.hash }) : h('div', {style: { display: 'flex', alignItems: 'center', width: '26px' }}),
-
- isTx ? h(EthBalance, {
- value: txParams.value,
- conversionRate,
- currentCurrency,
- shorten: true,
- showFiat: false,
- style: {fontSize: '15px'},
- }) : h('.flex-column'),
])
)
}
+TransactionListItem.prototype.resubmit = function () {
+ const { transaction } = this.props
+ this.props.retryTransaction(transaction.id)
+}
+
function domainField (txParams) {
return h('div', {
style: {
@@ -123,7 +187,7 @@ function recipientField (txParams, transaction, isTx, isMsg) {
} else if (txParams.to) {
message = addressSummary(txParams.to)
} else {
- message = 'Contract Published'
+ message = 'Contract Deployment'
}
return h('div', {
@@ -144,6 +208,11 @@ function formatDate (date) {
function renderErrorOrWarning (transaction) {
const { status, err, warning } = transaction
+ // show dropped
+ if (status === 'dropped') {
+ return h('span.dropped', ' (Dropped)')
+ }
+
// show rejected
if (status === 'rejected') {
return h('span.error', ' (Rejected)')
diff --git a/old-ui/app/components/transaction-list.js b/old-ui/app/components/transaction-list.js
index 345e3ca16..c77852921 100644
--- a/old-ui/app/components/transaction-list.js
+++ b/old-ui/app/components/transaction-list.js
@@ -62,7 +62,7 @@ TransactionList.prototype.render = function () {
}
return h(TransactionListItem, {
transaction, i, network, key,
- conversionRate,
+ conversionRate, transactions,
showTx: (txId) => {
this.props.viewPendingTx(txId)
},
generated by cgit (git 2.34.1) at 2024-10-23 05:40:50 +0800