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/util/asset_data.ts | 18 +++++++++++++++++ packages/instant/src/util/error_description.ts | 23 ++++++++++++++++++++++ packages/instant/src/util/error_flasher.ts | 27 ++++++++++++++++++++++++++ 3 files changed, 68 insertions(+) create mode 100644 packages/instant/src/util/asset_data.ts create mode 100644 packages/instant/src/util/error_description.ts create mode 100644 packages/instant/src/util/error_flasher.ts (limited to 'packages/instant/src/util') diff --git a/packages/instant/src/util/asset_data.ts b/packages/instant/src/util/asset_data.ts new file mode 100644 index 000000000..958f500bb --- /dev/null +++ b/packages/instant/src/util/asset_data.ts @@ -0,0 +1,18 @@ +import { AssetProxyId } from '@0xproject/types'; + +import { assetMetaData } from '../data/asset_meta_data'; + +// TODO: tests for this +export const bestNameForAsset = (assetData: string | undefined, defaultString: string) => { + if (assetData === undefined) { + return defaultString; + } + const metaData = assetMetaData[assetData]; + if (metaData === undefined) { + return defaultString; + } + if (metaData.assetProxyId === AssetProxyId.ERC20) { + return metaData.symbol.toUpperCase(); + } + return defaultString; +}; diff --git a/packages/instant/src/util/error_description.ts b/packages/instant/src/util/error_description.ts new file mode 100644 index 000000000..78af9e9ff --- /dev/null +++ b/packages/instant/src/util/error_description.ts @@ -0,0 +1,23 @@ +import { AssetBuyerError } from '@0xproject/asset-buyer'; + +import { bestNameForAsset } from '../util/asset_data'; + +const humanReadableMessageForError = (error: Error, assetData?: string): string | undefined => { + if (error.message === AssetBuyerError.InsufficientAssetLiquidity) { + const assetName = bestNameForAsset(assetData, 'of this asset'); + return `Not enough ${assetName} available`; + } + + return undefined; +}; + +export const errorDescription = (error?: any, assetData?: string): { icon: string; message: string } => { + let bestMessage: string | undefined; + if (error instanceof Error) { + bestMessage = humanReadableMessageForError(error, assetData); + } + return { + icon: '😢', + message: bestMessage || 'Something went wrong...', + }; +}; diff --git a/packages/instant/src/util/error_flasher.ts b/packages/instant/src/util/error_flasher.ts new file mode 100644 index 000000000..f43c4211b --- /dev/null +++ b/packages/instant/src/util/error_flasher.ts @@ -0,0 +1,27 @@ +import { Dispatch } from 'redux'; + +import { Action, actions } from '../redux/actions'; + +class ErrorFlasher { + private _timeoutId?: number; + public flashNewError(dispatch: Dispatch, error: any, delayMs: number = 7000): void { + this._clearTimeout(); + + // dispatch new message + dispatch(actions.setError(error)); + + this._timeoutId = window.setTimeout(() => { + dispatch(actions.hideError()); + }, delayMs); + } + public clearError(dispatch: Dispatch): void { + this._clearTimeout(); + dispatch(actions.hideError()); + } + private _clearTimeout(): void { + if (this._timeoutId) { + window.clearTimeout(this._timeoutId); + } + } +} +export const errorFlasher = new ErrorFlasher(); -- cgit v1.2.3 From 32fa1bcc387e2eecae53db4b082e93f6fb09ae10 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Wed, 17 Oct 2018 13:31:28 -0700 Subject: export assetDataUtil big obj --- packages/instant/src/util/asset_data.ts | 25 +++++++++++++------------ packages/instant/src/util/error_description.ts | 4 ++-- 2 files changed, 15 insertions(+), 14 deletions(-) (limited to 'packages/instant/src/util') diff --git a/packages/instant/src/util/asset_data.ts b/packages/instant/src/util/asset_data.ts index 958f500bb..4f3db8447 100644 --- a/packages/instant/src/util/asset_data.ts +++ b/packages/instant/src/util/asset_data.ts @@ -2,17 +2,18 @@ import { AssetProxyId } from '@0xproject/types'; import { assetMetaData } from '../data/asset_meta_data'; -// TODO: tests for this -export const bestNameForAsset = (assetData: string | undefined, defaultString: string) => { - if (assetData === undefined) { +export const assetDataUtil = { + bestNameForAsset: (assetData: string | undefined, defaultString: string) => { + if (assetData === undefined) { + return defaultString; + } + const metaData = assetMetaData[assetData]; + if (metaData === undefined) { + return defaultString; + } + if (metaData.assetProxyId === AssetProxyId.ERC20) { + return metaData.symbol.toUpperCase(); + } return defaultString; - } - const metaData = assetMetaData[assetData]; - if (metaData === undefined) { - return defaultString; - } - if (metaData.assetProxyId === AssetProxyId.ERC20) { - return metaData.symbol.toUpperCase(); - } - return defaultString; + }, }; diff --git a/packages/instant/src/util/error_description.ts b/packages/instant/src/util/error_description.ts index 78af9e9ff..9419a1e16 100644 --- a/packages/instant/src/util/error_description.ts +++ b/packages/instant/src/util/error_description.ts @@ -1,10 +1,10 @@ import { AssetBuyerError } from '@0xproject/asset-buyer'; -import { bestNameForAsset } from '../util/asset_data'; +import { assetDataUtil } from '../util/asset_data'; const humanReadableMessageForError = (error: Error, assetData?: string): string | undefined => { if (error.message === AssetBuyerError.InsufficientAssetLiquidity) { - const assetName = bestNameForAsset(assetData, 'of this asset'); + const assetName = assetDataUtil.bestNameForAsset(assetData, 'of this asset'); return `Not enough ${assetName} available`; } -- cgit v1.2.3 From d052342df7247f1efc830797a8f69245db247166 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Wed, 17 Oct 2018 13:32:54 -0700 Subject: use lodash isUndefined per PR comment --- packages/instant/src/util/asset_data.ts | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) (limited to 'packages/instant/src/util') diff --git a/packages/instant/src/util/asset_data.ts b/packages/instant/src/util/asset_data.ts index 4f3db8447..f7c5b78cd 100644 --- a/packages/instant/src/util/asset_data.ts +++ b/packages/instant/src/util/asset_data.ts @@ -1,14 +1,16 @@ +import * as _ from 'lodash'; + import { AssetProxyId } from '@0xproject/types'; import { assetMetaData } from '../data/asset_meta_data'; export const assetDataUtil = { bestNameForAsset: (assetData: string | undefined, defaultString: string) => { - if (assetData === undefined) { + if (_.isUndefined(assetData)) { return defaultString; } const metaData = assetMetaData[assetData]; - if (metaData === undefined) { + if (_.isUndefined(metaData)) { return defaultString; } if (metaData.assetProxyId === AssetProxyId.ERC20) { -- cgit v1.2.3 From 155858de6e79d488293473e34868e20d2c39ef37 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Wed, 17 Oct 2018 13:42:28 -0700 Subject: creating big error util file per francescos comment in PR --- packages/instant/src/util/error.ts | 51 ++++++++++++++++++++++++++ packages/instant/src/util/error_description.ts | 23 ------------ packages/instant/src/util/error_flasher.ts | 27 -------------- 3 files changed, 51 insertions(+), 50 deletions(-) create mode 100644 packages/instant/src/util/error.ts delete mode 100644 packages/instant/src/util/error_description.ts delete mode 100644 packages/instant/src/util/error_flasher.ts (limited to 'packages/instant/src/util') diff --git a/packages/instant/src/util/error.ts b/packages/instant/src/util/error.ts new file mode 100644 index 000000000..78d056e11 --- /dev/null +++ b/packages/instant/src/util/error.ts @@ -0,0 +1,51 @@ +import { AssetBuyerError } from '@0xproject/asset-buyer'; +import { Dispatch } from 'redux'; + +import { Action, actions } from '../redux/actions'; +import { assetDataUtil } from '../util/asset_data'; + +class ErrorFlasher { + private _timeoutId?: number; + public flashNewError(dispatch: Dispatch, error: any, delayMs: number = 7000): void { + this._clearTimeout(); + + // dispatch new message + dispatch(actions.setError(error)); + + this._timeoutId = window.setTimeout(() => { + dispatch(actions.hideError()); + }, delayMs); + } + public clearError(dispatch: Dispatch): void { + this._clearTimeout(); + dispatch(actions.hideError()); + } + private _clearTimeout(): void { + if (this._timeoutId) { + window.clearTimeout(this._timeoutId); + } + } +} + +const humanReadableMessageForError = (error: Error, assetData?: string): string | undefined => { + if (error.message === AssetBuyerError.InsufficientAssetLiquidity) { + const assetName = assetDataUtil.bestNameForAsset(assetData, 'of this asset'); + return `Not enough ${assetName} available`; + } + + return undefined; +}; + +export const errorUtil = { + errorFlasher: new ErrorFlasher(), + errorDescription: (error?: any, assetData?: string): { icon: string; message: string } => { + let bestMessage: string | undefined; + if (error instanceof Error) { + bestMessage = humanReadableMessageForError(error, assetData); + } + return { + icon: '😢', + message: bestMessage || 'Something went wrong...', + }; + }, +}; diff --git a/packages/instant/src/util/error_description.ts b/packages/instant/src/util/error_description.ts deleted file mode 100644 index 9419a1e16..000000000 --- a/packages/instant/src/util/error_description.ts +++ /dev/null @@ -1,23 +0,0 @@ -import { AssetBuyerError } from '@0xproject/asset-buyer'; - -import { assetDataUtil } from '../util/asset_data'; - -const humanReadableMessageForError = (error: Error, assetData?: string): string | undefined => { - if (error.message === AssetBuyerError.InsufficientAssetLiquidity) { - const assetName = assetDataUtil.bestNameForAsset(assetData, 'of this asset'); - return `Not enough ${assetName} available`; - } - - return undefined; -}; - -export const errorDescription = (error?: any, assetData?: string): { icon: string; message: string } => { - let bestMessage: string | undefined; - if (error instanceof Error) { - bestMessage = humanReadableMessageForError(error, assetData); - } - return { - icon: '😢', - message: bestMessage || 'Something went wrong...', - }; -}; diff --git a/packages/instant/src/util/error_flasher.ts b/packages/instant/src/util/error_flasher.ts deleted file mode 100644 index f43c4211b..000000000 --- a/packages/instant/src/util/error_flasher.ts +++ /dev/null @@ -1,27 +0,0 @@ -import { Dispatch } from 'redux'; - -import { Action, actions } from '../redux/actions'; - -class ErrorFlasher { - private _timeoutId?: number; - public flashNewError(dispatch: Dispatch, error: any, delayMs: number = 7000): void { - this._clearTimeout(); - - // dispatch new message - dispatch(actions.setError(error)); - - this._timeoutId = window.setTimeout(() => { - dispatch(actions.hideError()); - }, delayMs); - } - public clearError(dispatch: Dispatch): void { - this._clearTimeout(); - dispatch(actions.hideError()); - } - private _clearTimeout(): void { - if (this._timeoutId) { - window.clearTimeout(this._timeoutId); - } - } -} -export const errorFlasher = new ErrorFlasher(); -- cgit v1.2.3 From ae4f1a093a3d02f13e56716dca2383a42b6422ba Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Wed, 17 Oct 2018 14:02:39 -0700 Subject: handle other errors --- packages/instant/src/util/error.ts | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) (limited to 'packages/instant/src/util') diff --git a/packages/instant/src/util/error.ts b/packages/instant/src/util/error.ts index 78d056e11..48cb131a9 100644 --- a/packages/instant/src/util/error.ts +++ b/packages/instant/src/util/error.ts @@ -28,11 +28,22 @@ class ErrorFlasher { } const humanReadableMessageForError = (error: Error, assetData?: string): string | undefined => { - if (error.message === AssetBuyerError.InsufficientAssetLiquidity) { + const hasInsufficientLiquidity = + error.message === AssetBuyerError.InsufficientAssetLiquidity || + error.message === AssetBuyerError.InsufficientZrxLiquidity; + if (hasInsufficientLiquidity) { const assetName = assetDataUtil.bestNameForAsset(assetData, 'of this asset'); return `Not enough ${assetName} available`; } + if ( + error.message === AssetBuyerError.StandardRelayerApiError || + error.message.startsWith(AssetBuyerError.AssetUnavailable) + ) { + const assetName = assetDataUtil.bestNameForAsset(assetData, 'This asset'); + return `${assetName} is currently unavailable`; + } + return undefined; }; -- cgit v1.2.3 From 01b98c3ed09429dac92a46446bb73c8596116d18 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Wed, 17 Oct 2018 16:46:01 -0700 Subject: ReactNode as default for formatters, and show bold dash --- packages/instant/src/util/format.ts | 20 ++++++++++++++------ 1 file changed, 14 insertions(+), 6 deletions(-) (limited to 'packages/instant/src/util') diff --git a/packages/instant/src/util/format.ts b/packages/instant/src/util/format.ts index b62c968fb..09eb880b2 100644 --- a/packages/instant/src/util/format.ts +++ b/packages/instant/src/util/format.ts @@ -5,14 +5,22 @@ import * as _ from 'lodash'; import { ethDecimals } from '../constants'; export const format = { - ethBaseAmount: (ethBaseAmount?: BigNumber, decimalPlaces: number = 4, defaultText: string = '0 ETH'): string => { + ethBaseAmount: ( + ethBaseAmount?: BigNumber, + decimalPlaces: number = 4, + defaultText: React.ReactNode = '0 ETH', + ): React.ReactNode => { if (_.isUndefined(ethBaseAmount)) { return defaultText; } const ethUnitAmount = Web3Wrapper.toUnitAmount(ethBaseAmount, ethDecimals); return format.ethUnitAmount(ethUnitAmount, decimalPlaces); }, - ethUnitAmount: (ethUnitAmount?: BigNumber, decimalPlaces: number = 4, defaultText: string = '0 ETH'): string => { + ethUnitAmount: ( + ethUnitAmount?: BigNumber, + decimalPlaces: number = 4, + defaultText: React.ReactNode = '0 ETH', + ): React.ReactNode => { if (_.isUndefined(ethUnitAmount)) { return defaultText; } @@ -23,8 +31,8 @@ export const format = { ethBaseAmount?: BigNumber, ethUsdPrice?: BigNumber, decimalPlaces: number = 2, - defaultText: string = '$0.00', - ): string => { + defaultText: React.ReactNode = '$0.00', + ): React.ReactNode => { if (_.isUndefined(ethBaseAmount) || _.isUndefined(ethUsdPrice)) { return defaultText; } @@ -35,8 +43,8 @@ export const format = { ethUnitAmount?: BigNumber, ethUsdPrice?: BigNumber, decimalPlaces: number = 2, - defaultText: string = '$0.00', - ): string => { + defaultText: React.ReactNode = '$0.00', + ): React.ReactNode => { if (_.isUndefined(ethUnitAmount) || _.isUndefined(ethUsdPrice)) { return defaultText; } -- cgit v1.2.3 From 9f924e459c43c023e35ab7222cd9824cc0e67411 Mon Sep 17 00:00:00 2001 From: Jacob Evans Date: Thu, 18 Oct 2018 21:51:56 +1100 Subject: chore: change package org from 0xproject to 0x --- packages/instant/src/util/asset_buyer.ts | 2 +- packages/instant/src/util/asset_data.ts | 2 +- packages/instant/src/util/coinbase_api.ts | 2 +- packages/instant/src/util/error.ts | 2 +- packages/instant/src/util/format.ts | 4 ++-- packages/instant/src/util/web3_wrapper.ts | 2 +- 6 files changed, 7 insertions(+), 7 deletions(-) (limited to 'packages/instant/src/util') diff --git a/packages/instant/src/util/asset_buyer.ts b/packages/instant/src/util/asset_buyer.ts index 27d66d600..6855fbcab 100644 --- a/packages/instant/src/util/asset_buyer.ts +++ b/packages/instant/src/util/asset_buyer.ts @@ -1,4 +1,4 @@ -import { AssetBuyer } from '@0xproject/asset-buyer'; +import { AssetBuyer } from '@0x/asset-buyer'; import { sraApiUrl } from '../constants'; diff --git a/packages/instant/src/util/asset_data.ts b/packages/instant/src/util/asset_data.ts index f7c5b78cd..fea2e2b19 100644 --- a/packages/instant/src/util/asset_data.ts +++ b/packages/instant/src/util/asset_data.ts @@ -1,6 +1,6 @@ import * as _ from 'lodash'; -import { AssetProxyId } from '@0xproject/types'; +import { AssetProxyId } from '@0x/types'; import { assetMetaData } from '../data/asset_meta_data'; diff --git a/packages/instant/src/util/coinbase_api.ts b/packages/instant/src/util/coinbase_api.ts index 94a5d3c80..080421f98 100644 --- a/packages/instant/src/util/coinbase_api.ts +++ b/packages/instant/src/util/coinbase_api.ts @@ -1,4 +1,4 @@ -import { BigNumber } from '@0xproject/utils'; +import { BigNumber } from '@0x/utils'; const baseEndpoint = 'https://api.coinbase.com/v2'; export const coinbaseApi = { diff --git a/packages/instant/src/util/error.ts b/packages/instant/src/util/error.ts index 48cb131a9..c9b13ef83 100644 --- a/packages/instant/src/util/error.ts +++ b/packages/instant/src/util/error.ts @@ -1,4 +1,4 @@ -import { AssetBuyerError } from '@0xproject/asset-buyer'; +import { AssetBuyerError } from '@0x/asset-buyer'; import { Dispatch } from 'redux'; import { Action, actions } from '../redux/actions'; diff --git a/packages/instant/src/util/format.ts b/packages/instant/src/util/format.ts index 09eb880b2..8482b1526 100644 --- a/packages/instant/src/util/format.ts +++ b/packages/instant/src/util/format.ts @@ -1,5 +1,5 @@ -import { BigNumber } from '@0xproject/utils'; -import { Web3Wrapper } from '@0xproject/web3-wrapper'; +import { BigNumber } from '@0x/utils'; +import { Web3Wrapper } from '@0x/web3-wrapper'; import * as _ from 'lodash'; import { ethDecimals } from '../constants'; diff --git a/packages/instant/src/util/web3_wrapper.ts b/packages/instant/src/util/web3_wrapper.ts index d7e43521f..24dcd9076 100644 --- a/packages/instant/src/util/web3_wrapper.ts +++ b/packages/instant/src/util/web3_wrapper.ts @@ -1,4 +1,4 @@ -import { Web3Wrapper } from '@0xproject/web3-wrapper'; +import { Web3Wrapper } from '@0x/web3-wrapper'; import { getProvider } from './provider'; -- cgit v1.2.3