diff options
Diffstat (limited to 'packages/website')
13 files changed, 56 insertions, 58 deletions
diff --git a/packages/website/ts/blockchain.ts b/packages/website/ts/blockchain.ts index 6877a301a..336397f7f 100644 --- a/packages/website/ts/blockchain.ts +++ b/packages/website/ts/blockchain.ts @@ -135,11 +135,11 @@ export class Blockchain { const isConnected = !_.isUndefined(newNetworkId); if (!isConnected) { this.networkId = newNetworkId; - this.dispatcher.encounteredBlockchainError(BlockchainErrs.DISCONNECTED_FROM_ETHEREUM_NODE); + this.dispatcher.encounteredBlockchainError(BlockchainErrs.DisconnectedFromEthereumNode); this.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); } else if (this.networkId !== newNetworkId) { this.networkId = newNetworkId; - this.dispatcher.encounteredBlockchainError(''); + this.dispatcher.encounteredBlockchainError(BlockchainErrs.NoError); await this.fetchTokenInformationAsync(); await this.rehydrateStoreWithContractEvents(); } @@ -712,8 +712,8 @@ export class Blockchain { _.find(allTokens, {symbol: configs.defaultTrackedTokenSymbols[0]}), _.find(allTokens, {symbol: configs.defaultTrackedTokenSymbols[1]}), ]; - this.dispatcher.updateChosenAssetTokenAddress(Side.deposit, mostPopularTradingPairTokens[0].address); - this.dispatcher.updateChosenAssetTokenAddress(Side.receive, mostPopularTradingPairTokens[1].address); + this.dispatcher.updateChosenAssetTokenAddress(Side.Deposit, mostPopularTradingPairTokens[0].address); + this.dispatcher.updateChosenAssetTokenAddress(Side.Receive, mostPopularTradingPairTokens[1].address); this.dispatcher.updateBlockchainIsLoaded(true); } private async instantiateContractIfExistsAsync(artifact: any, address?: string): Promise<ContractInstance> { diff --git a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx index 963bd4388..afc89be1a 100644 --- a/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx +++ b/packages/website/ts/components/dialogs/blockchain_err_dialog.tsx @@ -46,22 +46,22 @@ export class BlockchainErrDialog extends React.Component<BlockchainErrDialogProp ); } private getTitle(hasWalletAddress: boolean) { - if (this.props.blockchainErr === BlockchainErrs.A_CONTRACT_NOT_DEPLOYED_ON_NETWORK) { + if (this.props.blockchainErr === BlockchainErrs.AContractNotDeployedOnNetwork) { return '0x smart contracts not found'; } else if (!hasWalletAddress) { return 'Enable wallet communication'; - } else if (this.props.blockchainErr === BlockchainErrs.DISCONNECTED_FROM_ETHEREUM_NODE) { + } else if (this.props.blockchainErr === BlockchainErrs.DisconnectedFromEthereumNode) { return 'Disconnected from Ethereum network'; } else { return 'Unexpected error'; } } private renderExplanation(hasWalletAddress: boolean) { - if (this.props.blockchainErr === BlockchainErrs.A_CONTRACT_NOT_DEPLOYED_ON_NETWORK) { + if (this.props.blockchainErr === BlockchainErrs.AContractNotDeployedOnNetwork) { return this.renderContractsNotDeployedExplanation(); } else if (!hasWalletAddress) { return this.renderNoWalletFoundExplanation(); - } else if (this.props.blockchainErr === BlockchainErrs.DISCONNECTED_FROM_ETHEREUM_NODE) { + } else if (this.props.blockchainErr === BlockchainErrs.DisconnectedFromEthereumNode) { return this.renderDisconnectedFromNode(); } else { return this.renderUnexpectedErrorExplanation(); diff --git a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx index c8bdced9b..e499bdcbe 100644 --- a/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx +++ b/packages/website/ts/components/dialogs/eth_weth_conversion_dialog.tsx @@ -47,7 +47,7 @@ export class EthWethConversionDialog extends onTouchTap={this.onConvertClick.bind(this)} />, ]; - const title = this.props.direction === Side.deposit ? 'Wrap ETH' : 'Unwrap WETH'; + const title = this.props.direction === Side.Deposit ? 'Wrap ETH' : 'Unwrap WETH'; return ( <Dialog title={title} @@ -61,10 +61,10 @@ export class EthWethConversionDialog extends ); } private renderConversionDialogBody() { - const explanation = this.props.direction === Side.deposit ? + const explanation = this.props.direction === Side.Deposit ? 'Convert your Ether into a tokenized, tradable form.' : 'Convert your Wrapped Ether back into it\'s native form.'; - const isWrappedVersion = this.props.direction === Side.receive; + const isWrappedVersion = this.props.direction === Side.Receive; return ( <div> <div className="pb2"> @@ -85,7 +85,7 @@ export class EthWethConversionDialog extends className="pt2 mx-auto" style={{width: 245}} > - {this.props.direction === Side.receive ? + {this.props.direction === Side.Receive ? <TokenAmountInput token={this.props.token} tokenState={this.props.tokenState} diff --git a/packages/website/ts/components/eth_weth_conversion_button.tsx b/packages/website/ts/components/eth_weth_conversion_button.tsx index b017de27b..ae919921d 100644 --- a/packages/website/ts/components/eth_weth_conversion_button.tsx +++ b/packages/website/ts/components/eth_weth_conversion_button.tsx @@ -45,7 +45,7 @@ export class EthWethConversionButton extends const labelStyle = this.state.isEthConversionHappening ? {fontSize: 10} : {}; let callToActionLabel; let inProgressLabel; - if (this.props.direction === Side.deposit) { + if (this.props.direction === Side.Deposit) { callToActionLabel = 'Wrap'; inProgressLabel = 'Wrapping...'; } else { @@ -87,7 +87,7 @@ export class EthWethConversionButton extends const tokenState = this.props.ethTokenState; let balance = tokenState.balance; try { - if (direction === Side.deposit) { + if (direction === Side.Deposit) { await this.props.blockchain.convertEthToWrappedEthTokensAsync(value); const ethAmount = ZeroEx.toUnitAmount(value, constants.ETH_DECIMAL_PLACES); this.props.dispatcher.showFlashMessage(`Successfully wrapped ${ethAmount.toString()} ETH to WETH`); @@ -110,7 +110,7 @@ export class EthWethConversionButton extends utils.consoleLog(`Unexpected error encountered: ${err}`); utils.consoleLog(err.stack); await errorReporter.reportAsync(err); - const errorMsg = direction === Side.deposit ? + const errorMsg = direction === Side.Deposit ? 'Failed to wrap your ETH. Please try again.' : 'Failed to unwrap your WETH. Please try again.'; this.props.dispatcher.showFlashMessage(errorMsg); diff --git a/packages/website/ts/components/eth_wrappers.tsx b/packages/website/ts/components/eth_wrappers.tsx index 58b73b11c..9bb05becf 100644 --- a/packages/website/ts/components/eth_wrappers.tsx +++ b/packages/website/ts/components/eth_wrappers.tsx @@ -142,7 +142,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt <TableRowColumn> <EthWethConversionButton isOutdatedWrappedEther={false} - direction={Side.deposit} + direction={Side.Deposit} ethToken={etherToken} ethTokenState={etherTokenState} dispatcher={this.props.dispatcher} @@ -169,7 +169,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt <TableRowColumn> <EthWethConversionButton isOutdatedWrappedEther={false} - direction={Side.receive} + direction={Side.Receive} ethToken={etherToken} ethTokenState={etherTokenState} dispatcher={this.props.dispatcher} @@ -287,7 +287,7 @@ export class EthWrappers extends React.Component<EthWrappersProps, EthWrappersSt <EthWethConversionButton isDisabled={!isStateLoaded} isOutdatedWrappedEther={true} - direction={Side.receive} + direction={Side.Receive} ethToken={outdatedEtherToken} ethTokenState={outdatedEtherTokenState} dispatcher={this.props.dispatcher} diff --git a/packages/website/ts/components/fill_order_json.tsx b/packages/website/ts/components/fill_order_json.tsx index f4db1f74e..393e46bee 100644 --- a/packages/website/ts/components/fill_order_json.tsx +++ b/packages/website/ts/components/fill_order_json.tsx @@ -24,11 +24,11 @@ export class FillOrderJSON extends React.Component<FillOrderJSONProps, FillOrder const tokenAddresses = _.keys(this.props.tokenByAddress); const exchangeContract = this.props.blockchain.getExchangeContractAddressIfExists(); const hintSideToAssetToken = { - [Side.deposit]: { + [Side.Deposit]: { amount: new BigNumber(35), address: tokenAddresses[0], }, - [Side.receive]: { + [Side.Receive]: { amount: new BigNumber(89), address: tokenAddresses[1], }, diff --git a/packages/website/ts/components/generate_order/generate_order_form.tsx b/packages/website/ts/components/generate_order/generate_order_form.tsx index 59970b10c..f273045a8 100644 --- a/packages/website/ts/components/generate_order/generate_order_form.tsx +++ b/packages/website/ts/components/generate_order/generate_order_form.tsx @@ -78,10 +78,10 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G } public render() { const dispatcher = this.props.dispatcher; - const depositTokenAddress = this.props.sideToAssetToken[Side.deposit].address; + const depositTokenAddress = this.props.sideToAssetToken[Side.Deposit].address; const depositToken = this.props.tokenByAddress[depositTokenAddress]; const depositTokenState = this.props.tokenStateByAddress[depositTokenAddress]; - const receiveTokenAddress = this.props.sideToAssetToken[Side.receive].address; + const receiveTokenAddress = this.props.sideToAssetToken[Side.Receive].address; const receiveToken = this.props.tokenByAddress[receiveTokenAddress]; const receiveTokenState = this.props.tokenStateByAddress[receiveTokenAddress]; const takerExplanation = 'If a taker is specified, only they are<br> \ @@ -102,9 +102,9 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G blockchainErr={this.props.blockchainErr} dispatcher={this.props.dispatcher} label="Selling" - side={Side.deposit} + side={Side.Deposit} networkId={this.props.networkId} - assetToken={this.props.sideToAssetToken[Side.deposit]} + assetToken={this.props.sideToAssetToken[Side.Deposit]} updateChosenAssetToken={dispatcher.updateChosenAssetToken.bind(dispatcher)} tokenByAddress={this.props.tokenByAddress} /> @@ -112,8 +112,8 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G label="Sell amount" token={depositToken} tokenState={depositTokenState} - amount={this.props.sideToAssetToken[Side.deposit].amount} - onChange={this.onTokenAmountChange.bind(this, depositToken, Side.deposit)} + amount={this.props.sideToAssetToken[Side.Deposit].amount} + onChange={this.onTokenAmountChange.bind(this, depositToken, Side.Deposit)} shouldShowIncompleteErrs={this.state.shouldShowIncompleteErrs} shouldCheckBalance={true} shouldCheckAllowance={true} @@ -133,9 +133,9 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G blockchainErr={this.props.blockchainErr} dispatcher={this.props.dispatcher} label="Buying" - side={Side.receive} + side={Side.Receive} networkId={this.props.networkId} - assetToken={this.props.sideToAssetToken[Side.receive]} + assetToken={this.props.sideToAssetToken[Side.Receive]} updateChosenAssetToken={dispatcher.updateChosenAssetToken.bind(dispatcher)} tokenByAddress={this.props.tokenByAddress} /> @@ -143,8 +143,8 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G label="Receive amount" token={receiveToken} tokenState={receiveTokenState} - amount={this.props.sideToAssetToken[Side.receive].amount} - onChange={this.onTokenAmountChange.bind(this, receiveToken, Side.receive)} + amount={this.props.sideToAssetToken[Side.Receive].amount} + onChange={this.onTokenAmountChange.bind(this, receiveToken, Side.Receive)} shouldShowIncompleteErrs={this.state.shouldShowIncompleteErrs} shouldCheckBalance={false} shouldCheckAllowance={false} @@ -235,16 +235,16 @@ export class GenerateOrderForm extends React.Component<GenerateOrderFormProps, G }); } private async onSignClickedAsync(): Promise<boolean> { - if (this.props.blockchainErr !== '') { + if (this.props.blockchainErr !== BlockchainErrs.NoError) { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); return false; } // Check if all required inputs were supplied - const debitToken = this.props.sideToAssetToken[Side.deposit]; + const debitToken = this.props.sideToAssetToken[Side.Deposit]; const debitBalance = this.props.tokenStateByAddress[debitToken.address].balance; const debitAllowance = this.props.tokenStateByAddress[debitToken.address].allowance; - const receiveAmount = this.props.sideToAssetToken[Side.receive].amount; + const receiveAmount = this.props.sideToAssetToken[Side.Receive].amount; if (!_.isUndefined(debitToken.amount) && !_.isUndefined(receiveAmount) && debitToken.amount.gt(0) && receiveAmount.gt(0) && this.props.userAddress !== '' && diff --git a/packages/website/ts/components/inputs/token_input.tsx b/packages/website/ts/components/inputs/token_input.tsx index 67f697f05..40fdf9689 100644 --- a/packages/website/ts/components/inputs/token_input.tsx +++ b/packages/website/ts/components/inputs/token_input.tsx @@ -95,7 +95,7 @@ export class TokenInput extends React.Component<TokenInputProps, TokenInputState }); } private onAssetClicked() { - if (this.props.blockchainErr !== '') { + if (this.props.blockchainErr !== BlockchainErrs.NoError) { this.props.dispatcher.updateShouldBlockchainErrDialogBeOpen(true); return; } diff --git a/packages/website/ts/components/token_balances.tsx b/packages/website/ts/components/token_balances.tsx index db4a35062..dd7a722f5 100644 --- a/packages/website/ts/components/token_balances.tsx +++ b/packages/website/ts/components/token_balances.tsx @@ -357,7 +357,7 @@ export class TokenBalances extends React.Component<TokenBalancesProps, TokenBala ); } private renderTokenTableRows() { - if (!this.props.blockchainIsLoaded || this.props.blockchainErr !== '') { + if (!this.props.blockchainIsLoaded || this.props.blockchainErr !== BlockchainErrs.NoError) { return ''; } const isSmallScreen = this.props.screenWidth === ScreenWidths.SM; diff --git a/packages/website/ts/containers/portal.tsx b/packages/website/ts/containers/portal.tsx index 7588a1535..fb330c06c 100644 --- a/packages/website/ts/containers/portal.tsx +++ b/packages/website/ts/containers/portal.tsx @@ -43,8 +43,8 @@ interface ConnectedDispatch { } const mapStateToProps = (state: State, ownProps: PortalComponentAllProps): ConnectedState => { - const receiveAssetToken = state.sideToAssetToken[Side.receive]; - const depositAssetToken = state.sideToAssetToken[Side.deposit]; + const receiveAssetToken = state.sideToAssetToken[Side.Receive]; + const depositAssetToken = state.sideToAssetToken[Side.Deposit]; const receiveAddress = !_.isUndefined(receiveAssetToken.address) ? receiveAssetToken.address : constants.NULL_ADDRESS; const depositAddress = !_.isUndefined(depositAssetToken.address) ? diff --git a/packages/website/ts/redux/reducer.ts b/packages/website/ts/redux/reducer.ts index da69a9d00..9bd8899ad 100644 --- a/packages/website/ts/redux/reducer.ts +++ b/packages/website/ts/redux/reducer.ts @@ -58,7 +58,7 @@ export interface State { const INITIAL_STATE: State = { // Portal - blockchainErr: '', + blockchainErr: BlockchainErrs.NoError, blockchainIsLoaded: false, generateOrderStep: GenerateOrderSteps.ChooseAssets, networkId: undefined, @@ -76,8 +76,8 @@ const INITIAL_STATE: State = { screenWidth: utils.getScreenWidth(), shouldBlockchainErrDialogBeOpen: false, sideToAssetToken: { - [Side.deposit]: {}, - [Side.receive]: {}, + [Side.Deposit]: {}, + [Side.Receive]: {}, }, tokenByAddress: {}, tokenStateByAddress: {}, @@ -294,8 +294,8 @@ export function reducer(state: State = INITIAL_STATE, action: Action) { case ActionTypes.SWAP_ASSET_TOKENS: { const newSideToAssetToken = _.assign({}, state.sideToAssetToken, { - [Side.deposit]: state.sideToAssetToken[Side.receive], - [Side.receive]: state.sideToAssetToken[Side.deposit], + [Side.Deposit]: state.sideToAssetToken[Side.Receive], + [Side.Receive]: state.sideToAssetToken[Side.Deposit], }); return _.assign({}, state, { sideToAssetToken: newSideToAssetToken, diff --git a/packages/website/ts/types.ts b/packages/website/ts/types.ts index 2005cf265..085b46789 100644 --- a/packages/website/ts/types.ts +++ b/packages/website/ts/types.ts @@ -18,18 +18,10 @@ export enum GenerateOrderSteps { CopyAndShare, } -export const Side = strEnum([ - 'receive', - 'deposit', -]); -export type Side = keyof typeof Side; - -export const BlockchainErrs = strEnum([ - 'A_CONTRACT_NOT_DEPLOYED_ON_NETWORK', - 'DISCONNECTED_FROM_ETHEREUM_NODE', - 'UNHANDLED_ERROR', -]); -export type BlockchainErrs = keyof typeof BlockchainErrs; +export enum Side { + Receive = 'RECEIVE', + Deposit = 'DEPOSIT', +} export const Direction = strEnum([ 'forward', @@ -271,6 +263,12 @@ export const EtherscanLinkSuffixes = strEnum([ ]); export type EtherscanLinkSuffixes = keyof typeof EtherscanLinkSuffixes; +export enum BlockchainErrs { + AContractNotDeployedOnNetwork = 'A_CONTRACT_NOT_DEPLOYED_ON_NETWORK', + DisconnectedFromEthereumNode = 'DISCONNECTED_FROM_ETHEREUM_NODE', + NoError = 'NO_ERROR', +} + export const BlockchainCallErrs = strEnum([ 'CONTRACT_DOES_NOT_EXIST', 'USER_HAS_NO_ASSOCIATED_ADDRESSES', diff --git a/packages/website/ts/utils/utils.ts b/packages/website/ts/utils/utils.ts index abc2fb2d4..a6f80c2ab 100644 --- a/packages/website/ts/utils/utils.ts +++ b/packages/website/ts/utils/utils.ts @@ -61,8 +61,8 @@ export const utils = { orderExpiryTimestamp: BigNumber, orderTakerAddress: string, orderMakerAddress: string, makerFee: BigNumber, takerFee: BigNumber, feeRecipient: string, signatureData: SignatureData, tokenByAddress: TokenByAddress, orderSalt: BigNumber): Order { - const makerToken = tokenByAddress[sideToAssetToken[Side.deposit].address]; - const takerToken = tokenByAddress[sideToAssetToken[Side.receive].address]; + const makerToken = tokenByAddress[sideToAssetToken[Side.Deposit].address]; + const takerToken = tokenByAddress[sideToAssetToken[Side.Receive].address]; const order = { maker: { address: orderMakerAddress, @@ -72,7 +72,7 @@ export const utils = { decimals: makerToken.decimals, address: makerToken.address, }, - amount: sideToAssetToken[Side.deposit].amount.toString(), + amount: sideToAssetToken[Side.Deposit].amount.toString(), feeAmount: makerFee.toString(), }, taker: { @@ -83,7 +83,7 @@ export const utils = { decimals: takerToken.decimals, address: takerToken.address, }, - amount: sideToAssetToken[Side.receive].amount.toString(), + amount: sideToAssetToken[Side.Receive].amount.toString(), feeAmount: takerFee.toString(), }, expiration: orderExpiryTimestamp.toString(), |