From 9b2156ed4f42541011a51f325b07fb5c252312ad Mon Sep 17 00:00:00 2001 From: William O'Beirne Date: Fri, 11 Aug 2017 17:54:10 -0400 Subject: [PATCH] WIP: Generating transaction on Send tab (Pt 1) (#100) * Generating transaction ,placing into read only textareas. * Fix async wallet getAddress cases. * Chain id from network * remove leftover console log * Check balance before generating transaction. * Translate error msgs, check for invalid address. * Errors for gas limit and gas price issues. --- .../BalanceSidebar/BalanceSidebar.jsx | 18 +-- .../Header/components/GasPriceDropdown.jsx | 2 +- .../components/UnitDropdown.jsx | 5 +- .../containers/Tabs/SendTransaction/index.jsx | 115 +++++++++++++----- common/libs/nodes/base.js | 14 ++- common/libs/nodes/rpc/client.js | 14 ++- common/libs/nodes/rpc/index.js | 106 +++++++++++++++- common/libs/nodes/rpc/types.js | 11 +- common/libs/signing.js | 7 +- common/libs/transaction.js | 27 +++- common/libs/units.js | 2 +- common/libs/validators.js | 13 +- common/libs/wallet/base.js | 9 +- common/libs/wallet/privkey.js | 6 +- common/selectors/config.js | 4 + package-lock.json | 14 +++ spec/libs/validators.spec.js | 12 +- 17 files changed, 297 insertions(+), 82 deletions(-) diff --git a/common/components/BalanceSidebar/BalanceSidebar.jsx b/common/components/BalanceSidebar/BalanceSidebar.jsx index 556445bd..8340c244 100644 --- a/common/components/BalanceSidebar/BalanceSidebar.jsx +++ b/common/components/BalanceSidebar/BalanceSidebar.jsx @@ -33,7 +33,6 @@ export class BalanceSidebar extends React.Component { }; componentDidMount() { - if (!this.props.wallet) return; this.props.wallet .getAddress() .then(addr => { @@ -48,6 +47,7 @@ export class BalanceSidebar extends React.Component { render() { const { wallet, balance, network, tokenBalances, rates } = this.props; const { blockExplorer, tokenExplorer } = network; + const { address } = this.state; if (!wallet) { return null; } @@ -58,9 +58,9 @@ export class BalanceSidebar extends React.Component { {translate('sidebar_AccountAddr')}
@@ -96,10 +96,7 @@ export class BalanceSidebar extends React.Component { {!!blockExplorer &&
  • {`${network.name} (${blockExplorer.name})`} @@ -108,10 +105,7 @@ export class BalanceSidebar extends React.Component { {!!tokenExplorer &&
  • {`Tokens (${tokenExplorer.name})`} @@ -187,7 +181,7 @@ export class BalanceSidebar extends React.Component { }; } -function mapStateToProps(state: State, props: Props) { +function mapStateToProps(state: State) { return { wallet: getWalletInst(state), balance: state.wallet.balance, diff --git a/common/components/Header/components/GasPriceDropdown.jsx b/common/components/Header/components/GasPriceDropdown.jsx index 4fee1ba0..bf2a7061 100644 --- a/common/components/Header/components/GasPriceDropdown.jsx +++ b/common/components/Header/components/GasPriceDropdown.jsx @@ -75,6 +75,6 @@ export default class GasPriceDropdown extends Component { }; updateGasPrice = (e: SyntheticInputEvent) => { - this.props.onChange(e.currentTarget.valueAsNumber); + this.props.onChange(parseInt(e.target.value, 10)); }; } diff --git a/common/containers/Tabs/SendTransaction/components/UnitDropdown.jsx b/common/containers/Tabs/SendTransaction/components/UnitDropdown.jsx index 10d25d62..eb43897d 100644 --- a/common/containers/Tabs/SendTransaction/components/UnitDropdown.jsx +++ b/common/containers/Tabs/SendTransaction/components/UnitDropdown.jsx @@ -79,6 +79,9 @@ export default class UnitDropdown extends React.Component { this.setState({ expanded: false }); - this.props.onChange(value); + + if (this.props.onChange) { + this.props.onChange(value); + } }; } diff --git a/common/containers/Tabs/SendTransaction/index.jsx b/common/containers/Tabs/SendTransaction/index.jsx index a92ebb40..b3d52d07 100644 --- a/common/containers/Tabs/SendTransaction/index.jsx +++ b/common/containers/Tabs/SendTransaction/index.jsx @@ -1,7 +1,6 @@ // @flow import React from 'react'; -import PropTypes from 'prop-types'; import translate from 'translations'; import { UnlockHeader } from 'components/ui'; import { @@ -21,27 +20,40 @@ import BaseWallet from 'libs/wallet/base'; import customMessages from './messages'; import { donationAddressMap } from 'config/data'; import { isValidETHAddress } from 'libs/validators'; -import { getNodeLib } from 'selectors/config'; +import { + getNodeLib, + getNetworkConfig, + getGasPriceGwei +} from 'selectors/config'; import { getTokens } from 'selectors/wallet'; -import type { BaseNode } from 'libs/nodes'; -import type { Token } from 'config/data'; +import type { Token, NetworkConfig } from 'config/data'; import Big from 'bignumber.js'; import { valueToHex } from 'libs/values'; import ERC20 from 'libs/erc20'; import type { TokenBalance } from 'selectors/wallet'; import { getTokenBalances } from 'selectors/wallet'; -import type { TransactionWithoutGas } from 'libs/transaction'; +import type { RPCNode } from 'libs/nodes'; +import type { + TransactionWithoutGas, + BroadcastTransaction +} from 'libs/transaction'; +import type { UNIT } from 'libs/units'; +import { toWei } from 'libs/units'; import { formatGasLimit } from 'utils/formatters'; +import { showNotification } from 'actions/notifications'; +import type { ShowNotificationAction } from 'actions/notifications'; type State = { hasQueryString: boolean, readOnly: boolean, to: string, value: string, - unit: string, + // $FlowFixMe - Comes from getParam not validating unit + unit: UNIT, gasLimit: string, data: string, - gasChanged: boolean + gasChanged: boolean, + transaction: ?BroadcastTransaction }; function getParam(query: { [string]: string }, key: string) { @@ -65,9 +77,16 @@ type Props = { }, wallet: BaseWallet, balance: Big, - node: BaseNode, + nodeLib: RPCNode, + network: NetworkConfig, tokens: Token[], - tokenBalances: TokenBalance[] + tokenBalances: TokenBalance[], + gasPrice: number, + showNotification: ( + level: string, + msg: string, + duration?: number + ) => ShowNotificationAction }; export class SendTransaction extends React.Component { @@ -81,7 +100,8 @@ export class SendTransaction extends React.Component { unit: 'ether', gasLimit: '21000', data: '', - gasChanged: false + gasChanged: false, + transaction: null }; componentDidMount() { @@ -112,8 +132,6 @@ export class SendTransaction extends React.Component { render() { const unlocked = !!this.props.wallet; - const unitReadable = 'UNITREADABLE'; - const nodeUnit = 'NODEUNIT'; const hasEnoughBalance = false; const { to, @@ -122,7 +140,8 @@ export class SendTransaction extends React.Component { gasLimit, data, readOnly, - hasQueryString + hasQueryString, + transaction } = this.state; const customMessage = customMessages.find(m => m.to === to); @@ -213,17 +232,23 @@ export class SendTransaction extends React.Component { - + +