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