Clean up code in send.js

feature/default_network_editable
Dan 7 years ago committed by Chi Kei Chan
parent 97810acb53
commit 4fa79ffc6e
  1. 199
      ui/app/send.js

@ -18,12 +18,10 @@ const {
signTx,
} = require('./actions')
const { stripHexPrefix, addHexPrefix } = require('ethereumjs-util')
const { isHex, numericBalance } = require('./util')
const { isHex, numericBalance, isValidAddress } = require('./util')
const { conversionUtil } = require('./conversion-util')
const BigNumber = require('bignumber.js')
const ARAGON = '960b236A07cf122663c4303350609A66A7B288C0'
module.exports = connect(mapStateToProps)(SendTransactionScreen)
function mapStateToProps (state) {
@ -81,51 +79,26 @@ function SendTransactionScreen () {
this.back = this.back.bind(this)
this.closeTooltip = this.closeTooltip.bind(this)
this.onSubmit = this.onSubmit.bind(this)
this.recipientDidChange = this.recipientDidChange.bind(this)
this.setActiveCurrency = this.setActiveCurrency.bind(this)
this.toggleTooltip = this.toggleTooltip.bind(this)
}
SendTransactionScreen.prototype.render = function () {
this.persistentFormParentId = 'send-tx-form'
const props = this.props
const {
// selectedIdentity,
// network,
// identities,
// addressBook,
conversionRate,
} = props
const { blockGasLimit, newTx, activeCurrency } = this.state
const { gas, gasPrice } = newTx
// console.log(`activeCurrency`, activeCurrency)
// console.log({ selectedIdentity, identities })
// console.log('SendTransactionScreen state:', this.state)
return (
h('div.send-screen-wrapper', [
// Main Send token Card
h('div.send-screen-card', [
h('img.send-eth-icon', { src: '../images/eth_logo.svg' }),
h('div.send-screen__title', 'Send'),
h('div.send-screen__subtitle', 'Send Ethereum to anyone with an Ethereum account'),
this.renderFromInput = this.renderFromInput.bind(this)
this.renderToInput = this.renderToInput.bind(this)
this.renderAmountInput = this.renderAmountInput.bind(this)
this.renderGasInput = this.renderGasInput.bind(this)
this.renderMemoInput = this.renderMemoInput.bind(this)
}
h('div.send-screen-input-wrapper', [
SendTransactionScreen.prototype.renderFromInput = function (from, identities) {
return h('div.send-screen-input-wrapper', [
h('div', 'From:'),
h('input.large-input.send-screen-input', {
list: 'accounts',
placeholder: 'Account',
value: this.state.newTx.from,
value: from,
onChange: (event) => {
console.log('event', event.target.value)
this.setState({
newTx: {
...this.state.newTx,
@ -136,19 +109,20 @@ SendTransactionScreen.prototype.render = function () {
}),
h('datalist#accounts', [
Object.keys(props.identities).map((key) => {
const identity = props.identities[key]
Object.entries(identities).map(([key, { address, name }]) => {
return h('option', {
value: identity.address,
label: identity.name,
key: identity.address,
value: address,
label: name,
key: address,
})
}),
]),
]),
])
}
h('div.send-screen-input-wrapper', [
SendTransactionScreen.prototype.renderToInput = function (to, identities, addressBook) {
return h('div.send-screen-input-wrapper', [
h('div', 'To:'),
@ -156,9 +130,8 @@ SendTransactionScreen.prototype.render = function () {
name: 'address',
list: 'addresses',
placeholder: 'Address',
value: this.state.newTx.to,
value: to,
onChange: (event) => {
console.log('event', event.target.value)
this.setState({
newTx: {
...this.state.newTx,
@ -170,7 +143,7 @@ SendTransactionScreen.prototype.render = function () {
h('datalist#addresses', [
// Corresponds to the addresses owned.
Object.entries(props.identities).map(([key, { address, name }]) => {
...Object.entries(identities).map(([key, { address, name }]) => {
return h('option', {
value: address,
label: name,
@ -178,7 +151,7 @@ SendTransactionScreen.prototype.render = function () {
})
}),
// Corresponds to previously sent-to addresses.
props.addressBook.map(({ address, name }) => {
...addressBook.map(({ address, name }) => {
return h('option', {
value: address,
label: name,
@ -187,28 +160,11 @@ SendTransactionScreen.prototype.render = function () {
}),
]),
// h(EnsInput, {
// name: 'address',
// placeholder: 'Recipient Address',
// value: this.state.newTx.to,
// onChange: (event) => {
// this.setState({
// newTx: Object.assign(
// this.state.newTx,
// {
// to: event.target.value,
// }
// ),
// })
// },
// network,
// identities,
// addressBook,
// }),
]),
])
}
h('div.send-screen-input-wrapper', [
SendTransactionScreen.prototype.renderAmountInput = function (activeCurrency) {
return h('div.send-screen-input-wrapper', [
h('div.send-screen-amount-labels', [
h('span', 'Amount'),
@ -233,9 +189,11 @@ SendTransactionScreen.prototype.render = function () {
},
}),
]),
])
}
h('div.send-screen-input-wrapper', [
SendTransactionScreen.prototype.renderGasInput = function (gasPrice, gas, activeCurrency, conversionRate, blockGasLimit) {
return h('div.send-screen-input-wrapper', [
this.state.tooltipIsOpen && h(GasTooltip, {
className: 'send-tooltip',
gasPrice,
@ -276,9 +234,11 @@ SendTransactionScreen.prototype.render = function () {
]),
]),
]),
])
}
h('div.send-screen-input-wrapper', [
SendTransactionScreen.prototype.renderMemoInput = function () {
return h('div.send-screen-input-wrapper', [
h('div', 'Transaction memo (optional)'),
h('input.large-input.send-screen-input', {
onChange: () => {
@ -292,23 +252,46 @@ SendTransactionScreen.prototype.render = function () {
})
},
}),
]),
])
}
SendTransactionScreen.prototype.render = function () {
this.persistentFormParentId = 'send-tx-form'
const props = this.props
const {
// selectedIdentity,
// network,
identities,
addressBook,
conversionRate,
} = props
const { blockGasLimit, newTx, activeCurrency } = this.state
const { gas, gasPrice } = newTx
return (
h('div.send-screen-wrapper', [
// Main Send token Card
h('div.send-screen-card', [
h('img.send-eth-icon', { src: '../images/eth_logo.svg' }),
h('div.send-screen__title', 'Send'),
h('div.send-screen__subtitle', 'Send Ethereum to anyone with an Ethereum account'),
this.renderFromInput(this.state.newTx.from, identities),
this.renderToInput(this.state.newTx.to, identities, addressBook),
this.renderAmountInput(activeCurrency),
this.renderGasInput(gasPrice, gas, activeCurrency, conversionRate, blockGasLimit),
this.renderMemoInput(),
h('div.send-screen-input-wrapper', {}, [
h('div', {}, ['Data (optional)']),
h('input.large-input.send-screen-input', {
onChange: () => {
this.setState({
newTx: Object.assign(
this.state.newTx,
{
txData: event.target.value,
}
),
})
},
}),
]),
]),
// Buttons underneath card
@ -337,41 +320,21 @@ SendTransactionScreen.prototype.setActiveCurrency = function (newCurrency) {
this.setState({ activeCurrency: newCurrency })
}
SendTransactionScreen.prototype.navigateToAccounts = function (event) {
event.stopPropagation()
this.props.dispatch(showAccountsPage())
}
SendTransactionScreen.prototype.back = function () {
var address = this.props.address
this.props.dispatch(backToAccountDetail(address))
}
SendTransactionScreen.prototype.recipientDidChange = function (recipient, nickname) {
this.setState({
recipient: recipient,
nickname: nickname,
})
}
SendTransactionScreen.prototype.onSubmit = function (event) {
event.preventDefault()
const { warning } = this.props
const state = this.state || {}
// const recipient = state.recipient || document.querySelector('input[name="address"]').value.replace(/^[.\s]+|[.\s]+$/g, '')
const recipient = state.newTx.to
const nickname = state.nickname || ' '
// const input = document.querySelector('input[name="amount"]').value
// const input = state.newTx.value
// const value = util.normalizeEthStringToWei(input)
// https://consensys.slack.com/archives/G1L7H42BT/p1503439134000169?thread_ts=1503438076.000411&cid=G1L7H42BT
// From @kumavis: "not needed for MVP but we will end up adding it again so consider just adding it now"
const txData = false
// Must replace with memo data.
// const txData = document.querySelector('input[name="txData"]').value
// TODO: convert this to hex when created and include it in send
const txData = state.newTx.memo
let message
@ -385,14 +348,9 @@ SendTransactionScreen.prototype.onSubmit = function (event) {
// return this.props.dispatch(actions.displayWarning(message))
// }
if ((util.isInvalidChecksumAddress(recipient))) {
message = 'Recipient address checksum is invalid.'
return this.props.dispatch(actions.displayWarning(message))
}
if ((!util.isValidAddress(recipient) && !txData) || (!recipient && !txData)) {
if (!isValidAddress(recipient) && !recipient) {
message = 'Recipient address is invalid.'
return this.props.dispatch(actions.displayWarning(message))
return this.props.dispatch(displayWarning(message))
}
if (txData && !isHex(stripHexPrefix(txData))) {
@ -424,7 +382,6 @@ SendTransactionScreen.prototype.onSubmit = function (event) {
value: sendAmount,
// New: gas will now be specified on this step
gas: this.state.newTx.gas,
gasPrice: this.state.newTx.gasPrice,
}
@ -432,5 +389,7 @@ SendTransactionScreen.prototype.onSubmit = function (event) {
if (recipient) txParams.to = addHexPrefix(recipient)
if (txData) txParams.data = txData
if (!warning) {
this.props.dispatch(signTx(txParams))
}
}

Loading…
Cancel
Save