From db77cd10c550803c4f3fac585adc0a7f6ffa8999 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Tue, 16 Oct 2018 11:25:52 -0700 Subject: feat(instant): Handle AssetBuyer errors --- packages/instant/src/containers/latest_error.tsx | 36 ++++++++++++++++++++++ .../src/containers/selected_asset_amount_input.ts | 13 +++++++- 2 files changed, 48 insertions(+), 1 deletion(-) create mode 100644 packages/instant/src/containers/latest_error.tsx (limited to 'packages/instant/src/containers') diff --git a/packages/instant/src/containers/latest_error.tsx b/packages/instant/src/containers/latest_error.tsx new file mode 100644 index 000000000..5272d9610 --- /dev/null +++ b/packages/instant/src/containers/latest_error.tsx @@ -0,0 +1,36 @@ +import * as React from 'react'; + +import { connect } from 'react-redux'; + +import { SlidingError } from '../components/sliding_error'; +import { State } from '../redux/reducer'; +import { errorDescription } from '../util/error_description'; + +export interface LatestErrorComponentProps { + assetData?: string; + latestError?: any; + latestErrorDismissed?: boolean; +} + +export const LatestErrorComponent: React.StatelessComponent = props => { + if (!props.latestError) { + return
; + } + const slidingDirection = props.latestErrorDismissed ? 'down' : 'up'; + const { icon, message } = errorDescription(props.latestError, props.assetData); + return ; +}; + +interface ConnectedState { + assetData?: string; + latestError?: any; + latestErrorDismissed?: boolean; +} +export interface LatestErrorProps {} +const mapStateToProps = (state: State, _ownProps: LatestErrorProps): ConnectedState => ({ + assetData: state.selectedAssetData, + latestError: state.latestError, + latestErrorDismissed: state.latestErrorDismissed, +}); + +export const LatestError = connect(mapStateToProps)(LatestErrorComponent); diff --git a/packages/instant/src/containers/selected_asset_amount_input.ts b/packages/instant/src/containers/selected_asset_amount_input.ts index f2ca96ae4..00c0a1114 100644 --- a/packages/instant/src/containers/selected_asset_amount_input.ts +++ b/packages/instant/src/containers/selected_asset_amount_input.ts @@ -1,3 +1,4 @@ +import { BuyQuote } from '@0xproject/asset-buyer'; import { BigNumber } from '@0xproject/utils'; import { Web3Wrapper } from '@0xproject/web3-wrapper'; import * as _ from 'lodash'; @@ -11,6 +12,7 @@ import { State } from '../redux/reducer'; import { ColorOption } from '../style/theme'; import { AsyncProcessState } from '../types'; import { assetBuyer } from '../util/asset_buyer'; +import { errorFlasher } from '../util/error_flasher'; import { AssetAmountInput } from '../components/asset_amount_input'; @@ -43,7 +45,16 @@ const updateBuyQuoteAsync = async ( } // get a new buy quote. const baseUnitValue = Web3Wrapper.toBaseUnitAmount(assetAmount, zrxDecimals); - const newBuyQuote = await assetBuyer.getBuyQuoteAsync(assetData, baseUnitValue); + + let newBuyQuote: BuyQuote | undefined; + try { + newBuyQuote = await assetBuyer.getBuyQuoteAsync(assetData, baseUnitValue); + errorFlasher.clearError(dispatch); + } catch (error) { + errorFlasher.flashNewError(dispatch, error); + return; + } + // invalidate the last buy quote. dispatch(actions.updateLatestBuyQuote(newBuyQuote)); }; -- cgit