Merge pull request #1273 from 0xProject/fix/instant/heartbeat-errors

[instant] Don't show errors from heartbeat buy quote calls

5 files changed, 37 insertions, 28 deletions

diff --git a/packages/instant/src/components/zero_ex_instant_provider.tsx b/packages/instant/src/components/zero_ex_instant_provider.tsx
index 18e71edb6..f6dadf3e4 100644
--- a/packages/instant/src/components/zero_ex_instant_provider.tsx
+++ b/packages/instant/src/components/zero_ex_instant_provider.tsx
@@ -113,7 +113,8 @@ export class ZeroExInstantProvider extends React.Component<ZeroExInstantProvider
         });
         this._buyQuoteHeartbeat.start(BUY_QUOTE_UPDATE_INTERVAL_TIME_MS);
         // tslint:disable-next-line:no-floating-promises
-        asyncData.fetchCurrentBuyQuoteAndDispatchToStore(state, dispatch, true);
+        // Trigger first buyquote fetch
+        asyncData.fetchCurrentBuyQuoteAndDispatchToStore(state, dispatch, { updateSilently: false });
         // warm up the gas price estimator cache just in case we can't
         // grab the gas price estimate when submitting the transaction
         // tslint:disable-next-line:no-floating-promises
diff --git a/packages/instant/src/containers/selected_erc20_asset_amount_input.ts b/packages/instant/src/containers/selected_erc20_asset_amount_input.ts
index 8b0070228..2c2661e1a 100644
--- a/packages/instant/src/containers/selected_erc20_asset_amount_input.ts
+++ b/packages/instant/src/containers/selected_erc20_asset_amount_input.ts
@@ -81,7 +81,11 @@ const mapDispatchToProps = (
             // even if it's debounced, give them the illusion it's loading
             dispatch(actions.setQuoteRequestStatePending());
             // tslint:disable-next-line:no-floating-promises
-            debouncedUpdateBuyQuoteAsync(assetBuyer, dispatch, asset, value, true, affiliateInfo);
+            debouncedUpdateBuyQuoteAsync(assetBuyer, dispatch, asset, value, {
+                setPending: true,
+                dispatchErrors: true,
+                affiliateInfo,
+            });
         }
     },
 });
diff --git a/packages/instant/src/redux/async_data.ts b/packages/instant/src/redux/async_data.ts
index a1952e429..5d30388b8 100644
--- a/packages/instant/src/redux/async_data.ts
+++ b/packages/instant/src/redux/async_data.ts
@@ -82,7 +82,7 @@ export const asyncData = {
     fetchCurrentBuyQuoteAndDispatchToStore: async (
         state: State,
         dispatch: Dispatch,
-        shouldSetPending: boolean = false,
+        options: { updateSilently: boolean },
     ) => {
         const { buyOrderState, providerState, selectedAsset, selectedAssetUnitAmount, affiliateInfo } = state;
         const assetBuyer = providerState.assetBuyer;
@@ -97,8 +97,7 @@ export const asyncData = {
                 dispatch,
                 selectedAsset as ERC20Asset,
                 selectedAssetUnitAmount,
-                shouldSetPending,
-                affiliateInfo,
+                { setPending: !options.updateSilently, dispatchErrors: !options.updateSilently, affiliateInfo },
             );
         }
     },
diff --git a/packages/instant/src/util/buy_quote_updater.ts b/packages/instant/src/util/buy_quote_updater.ts
index fcdded0a9..2fd16d781 100644
--- a/packages/instant/src/util/buy_quote_updater.ts
+++ b/packages/instant/src/util/buy_quote_updater.ts
@@ -16,39 +16,42 @@ export const buyQuoteUpdater = {
         dispatch: Dispatch<Action>,
         asset: ERC20Asset,
         assetUnitAmount: BigNumber,
-        setPending = true,
-        affiliateInfo?: AffiliateInfo,
+        options: { setPending: boolean; dispatchErrors: boolean; affiliateInfo?: AffiliateInfo },
     ): Promise<void> => {
         // get a new buy quote.
         const baseUnitValue = Web3Wrapper.toBaseUnitAmount(assetUnitAmount, asset.metaData.decimals);
-        if (setPending) {
+        if (options.setPending) {
             // mark quote as pending
             dispatch(actions.setQuoteRequestStatePending());
         }
-        const feePercentage = oc(affiliateInfo).feePercentage();
+        const feePercentage = oc(options.affiliateInfo).feePercentage();
         let newBuyQuote: BuyQuote | undefined;
         try {
             newBuyQuote = await assetBuyer.getBuyQuoteAsync(asset.assetData, baseUnitValue, { feePercentage });
         } catch (error) {
-            dispatch(actions.setQuoteRequestStateFailure());
-            let errorMessage;
-            if (error.message === AssetBuyerError.InsufficientAssetLiquidity) {
-                const assetName = assetUtils.bestNameForAsset(asset, 'of this asset');
-                errorMessage = `Not enough ${assetName} available`;
-            } else if (error.message === AssetBuyerError.InsufficientZrxLiquidity) {
-                errorMessage = 'Not enough ZRX available';
-            } else if (
-                error.message === AssetBuyerError.StandardRelayerApiError ||
-                error.message.startsWith(AssetBuyerError.AssetUnavailable)
-            ) {
-                const assetName = assetUtils.bestNameForAsset(asset, 'This asset');
-                errorMessage = `${assetName} is currently unavailable`;
-            }
-            if (!_.isUndefined(errorMessage)) {
-                errorFlasher.flashNewErrorMessage(dispatch, errorMessage);
-            } else {
-                throw error;
+            if (options.dispatchErrors) {
+                dispatch(actions.setQuoteRequestStateFailure());
+                let errorMessage;
+                if (error.message === AssetBuyerError.InsufficientAssetLiquidity) {
+                    const assetName = assetUtils.bestNameForAsset(asset, 'of this asset');
+                    errorMessage = `Not enough ${assetName} available`;
+                } else if (error.message === AssetBuyerError.InsufficientZrxLiquidity) {
+                    errorMessage = 'Not enough ZRX available';
+                } else if (
+                    error.message === AssetBuyerError.StandardRelayerApiError ||
+                    error.message.startsWith(AssetBuyerError.AssetUnavailable)
+                ) {
+                    const assetName = assetUtils.bestNameForAsset(asset, 'This asset');
+                    errorMessage = `${assetName} is currently unavailable`;
+                }
+                if (!_.isUndefined(errorMessage)) {
+                    errorFlasher.flashNewErrorMessage(dispatch, errorMessage);
+                } else {
+                    throw error;
+                }
             }
+            // TODO: report to error reporter on else
+
             return;
         }
         // We have a successful new buy quote
diff --git a/packages/instant/src/util/heartbeater_factory.ts b/packages/instant/src/util/heartbeater_factory.ts
index 06fcdb8bb..2b852fb0d 100644
--- a/packages/instant/src/util/heartbeater_factory.ts
+++ b/packages/instant/src/util/heartbeater_factory.ts
@@ -17,6 +17,8 @@ export const generateAccountHeartbeater = (options: HeartbeatFactoryOptions): He
 export const generateBuyQuoteHeartbeater = (options: HeartbeatFactoryOptions): Heartbeater => {
     const { store, shouldPerformImmediatelyOnStart } = options;
     return new Heartbeater(async () => {
-        await asyncData.fetchCurrentBuyQuoteAndDispatchToStore(store.getState(), store.dispatch, false);
+        await asyncData.fetchCurrentBuyQuoteAndDispatchToStore(store.getState(), store.dispatch, {
+            updateSilently: true,
+        });
     }, shouldPerformImmediatelyOnStart);
 };