diff options
Diffstat (limited to 'packages/website/ts/components/eth_wrappers.tsx')
| -rw-r--r-- | packages/website/ts/components/eth_wrappers.tsx | 59 |
1 files changed, 28 insertions, 31 deletions
diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index b12c637e5..59afeb50b 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -10,7 +10,14 @@ import ReactTooltip = require('react-tooltip'); import { Blockchain } from 'ts/blockchain'; import { EthWethConversionButton } from 'ts/components/eth_weth_conversion_button'; import { Dispatcher } from 'ts/redux/dispatcher'; -import { OutdatedWrappedEtherByNetworkId, Side, Token, TokenByAddress, TokenState } from 'ts/types'; +import { + OutdatedWrappedEtherByNetworkId, + Side, + Token, + TokenByAddress, + TokenState, + TokenStateByAddress, +} from 'ts/types'; import { configs } from 'ts/utils/configs'; import { constants } from 'ts/utils/constants'; import { utils } from 'ts/utils/utils'; @@ -20,13 +27,6 @@ const ICON_DIMENSION = 40; const ETHER_ICON_PATH = '/images/ether.png'; const OUTDATED_WETH_ICON_PATH = '/images/wrapped_eth_gray.png'; -interface OutdatedWETHAddressToIsStateLoaded { - [address: string]: boolean; -} -interface OutdatedWETHStateByAddress { - [address: string]: TokenState; -} - interface EthWrappersProps { networkId: number; blockchain: Blockchain; @@ -39,9 +39,7 @@ interface EthWrappersProps { interface EthWrappersState { ethTokenState: TokenState; - isWethStateLoaded: boolean; - outdatedWETHAddressToIsStateLoaded: OutdatedWETHAddressToIsStateLoaded; - outdatedWETHStateByAddress: OutdatedWETHStateByAddress; + outdatedWETHStateByAddress: TokenStateByAddress; } export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersState> { @@ -50,22 +48,20 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt super(props); this._isUnmounted = false; const outdatedWETHAddresses = this._getOutdatedWETHAddresses(); - const outdatedWETHAddressToIsStateLoaded: OutdatedWETHAddressToIsStateLoaded = {}; - const outdatedWETHStateByAddress: OutdatedWETHStateByAddress = {}; + const outdatedWETHStateByAddress: TokenStateByAddress = {}; _.each(outdatedWETHAddresses, outdatedWETHAddress => { - outdatedWETHAddressToIsStateLoaded[outdatedWETHAddress] = false; outdatedWETHStateByAddress[outdatedWETHAddress] = { balance: new BigNumber(0), allowance: new BigNumber(0), + isLoaded: false, }; }); this.state = { - outdatedWETHAddressToIsStateLoaded, outdatedWETHStateByAddress, - isWethStateLoaded: false, ethTokenState: { balance: new BigNumber(0), allowance: new BigNumber(0), + isLoaded: false, }, }; } @@ -169,7 +165,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt {this._renderTokenLink(tokenLabel, etherscanUrl)} </TableRowColumn> <TableRowColumn> - {this.state.isWethStateLoaded ? ( + {this.state.ethTokenState.isLoaded ? ( `${wethBalance.toFixed(configs.AMOUNT_DISPLAY_PRECSION)} WETH` ) : ( <i className="zmdi zmdi-spinner zmdi-hc-spin" /> @@ -183,7 +179,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt networkId={this.props.networkId} isOutdatedWrappedEther={false} direction={Side.Receive} - isDisabled={!this.state.isWethStateLoaded} + isDisabled={!this.state.ethTokenState.isLoaded} ethToken={etherToken} dispatcher={this.props.dispatcher} blockchain={this.props.blockchain} @@ -266,8 +262,8 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt ...etherToken, address: outdatedWETHIfExists.address, }; - const isStateLoaded = this.state.outdatedWETHAddressToIsStateLoaded[outdatedWETHIfExists.address]; const outdatedEtherTokenState = this.state.outdatedWETHStateByAddress[outdatedWETHIfExists.address]; + const isStateLoaded = outdatedEtherTokenState.isLoaded; const balanceInEthIfExists = isStateLoaded ? ZeroEx.toUnitAmount(outdatedEtherTokenState.balance, constants.DECIMAL_PLACES_ETH).toFixed( configs.AMOUNT_DISPLAY_PRECSION, @@ -345,10 +341,15 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt ); } private async _onOutdatedConversionSuccessfulAsync(outdatedWETHAddress: string) { + const currentOutdatedWETHState = this.state.outdatedWETHStateByAddress[outdatedWETHAddress]; this.setState({ - outdatedWETHAddressToIsStateLoaded: { - ...this.state.outdatedWETHAddressToIsStateLoaded, - [outdatedWETHAddress]: false, + outdatedWETHStateByAddress: { + ...this.state.outdatedWETHStateByAddress, + [outdatedWETHAddress]: { + balance: currentOutdatedWETHState.balance, + allowance: currentOutdatedWETHState.allowance, + isLoaded: false, + }, }, }); const userAddressIfExists = _.isEmpty(this.props.userAddress) ? undefined : this.props.userAddress; @@ -357,15 +358,12 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt outdatedWETHAddress, ); this.setState({ - outdatedWETHAddressToIsStateLoaded: { - ...this.state.outdatedWETHAddressToIsStateLoaded, - [outdatedWETHAddress]: true, - }, outdatedWETHStateByAddress: { ...this.state.outdatedWETHStateByAddress, [outdatedWETHAddress]: { balance, allowance, + isLoaded: true, }, }, }); @@ -380,8 +378,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt ); const outdatedWETHAddresses = this._getOutdatedWETHAddresses(); - const outdatedWETHAddressToIsStateLoaded: OutdatedWETHAddressToIsStateLoaded = {}; - const outdatedWETHStateByAddress: OutdatedWETHStateByAddress = {}; + const outdatedWETHStateByAddress: TokenStateByAddress = {}; for (const address of outdatedWETHAddresses) { const [balance, allowance] = await this.props.blockchain.getTokenBalanceAndAllowanceAsync( userAddressIfExists, @@ -390,18 +387,17 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt outdatedWETHStateByAddress[address] = { balance, allowance, + isLoaded: true, }; - outdatedWETHAddressToIsStateLoaded[address] = true; } if (!this._isUnmounted) { this.setState({ outdatedWETHStateByAddress, - outdatedWETHAddressToIsStateLoaded, ethTokenState: { balance: wethBalance, allowance: wethAllowance, + isLoaded: true, }, - isWethStateLoaded: true, }); } } @@ -434,6 +430,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt ethTokenState: { balance, allowance, + isLoaded: true, }, }); } |