From edfb56de6cd1f9605698f9a499016a28f6ba8754 Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Thu, 25 Oct 2018 21:03:25 -0700 Subject: fix(instant): prevent outdated quote requests from overriding the correct quote --- .../selected_erc20_asset_amount_input.ts | 4 +-- packages/instant/src/redux/reducer.ts | 42 ++++++++++++++++++---- 2 files changed, 37 insertions(+), 9 deletions(-) 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 ee76e9d66..828c4fcb5 100644 --- a/packages/instant/src/containers/selected_erc20_asset_amount_input.ts +++ b/packages/instant/src/containers/selected_erc20_asset_amount_input.ts @@ -79,8 +79,6 @@ const updateBuyQuoteAsync = async ( dispatch(actions.updateLatestBuyQuote(newBuyQuote)); }; -const debouncedUpdateBuyQuoteAsync = _.debounce(updateBuyQuoteAsync, 200, { trailing: true }); - const mapDispatchToProps = ( dispatch: Dispatch, _ownProps: SelectedERC20AssetAmountInputProps, @@ -97,7 +95,7 @@ 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); + updateBuyQuoteAsync(assetBuyer, dispatch, asset, value); } }, }); diff --git a/packages/instant/src/redux/reducer.ts b/packages/instant/src/redux/reducer.ts index d7e5bdfb5..4f572532a 100644 --- a/packages/instant/src/redux/reducer.ts +++ b/packages/instant/src/redux/reducer.ts @@ -1,6 +1,7 @@ import { AssetBuyer, BuyQuote } from '@0x/asset-buyer'; -import { ObjectMap } from '@0x/types'; +import { AssetProxyId, ObjectMap } from '@0x/types'; import { BigNumber } from '@0x/utils'; +import { Web3Wrapper } from '@0x/web3-wrapper'; import * as _ from 'lodash'; import { assetMetaDataMap } from '../data/asset_meta_data_map'; @@ -57,11 +58,19 @@ export const reducer = (state: State = INITIAL_STATE, action: Action): State => selectedAssetAmount: action.data, }; case ActionTypes.UPDATE_LATEST_BUY_QUOTE: - return { - ...state, - latestBuyQuote: action.data, - quoteRequestState: AsyncProcessState.SUCCESS, - }; + const newBuyQuoteIfExists = action.data; + const shouldUpdate = + _.isUndefined(newBuyQuoteIfExists) || doesBuyQuoteMatchState(newBuyQuoteIfExists, state); + if (shouldUpdate) { + return { + ...state, + latestBuyQuote: newBuyQuoteIfExists, + quoteRequestState: AsyncProcessState.SUCCESS, + }; + } else { + return state; + } + case ActionTypes.SET_QUOTE_REQUEST_STATE_PENDING: return { ...state, @@ -122,3 +131,24 @@ export const reducer = (state: State = INITIAL_STATE, action: Action): State => return state; } }; + +const doesBuyQuoteMatchState = (buyQuote: BuyQuote, state: State): boolean => { + const selectedAssetIfExists = state.selectedAsset; + const selectedAssetAmountIfExists = state.selectedAssetAmount; + // if no selectedAsset or selectedAssetAmount exists on the current state, return false + if (_.isUndefined(selectedAssetIfExists) || _.isUndefined(selectedAssetAmountIfExists)) { + return false; + } + // if buyQuote's assetData does not match that of the current selected asset, return false + if (selectedAssetIfExists.assetData !== buyQuote.assetData) { + return false; + } + // if buyQuote's assetBuyAmount does not match selectedAssetAmount, return false + const selectedAssetMetaData = selectedAssetIfExists.metaData; + const selectedAssetAmountBaseUnits = + selectedAssetMetaData.assetProxyId === AssetProxyId.ERC20 + ? Web3Wrapper.toBaseUnitAmount(selectedAssetAmountIfExists, selectedAssetMetaData.decimals) + : new BigNumber(1); + const doesAssetAmountMatch = selectedAssetAmountBaseUnits.eq(buyQuote.assetBuyAmount); + return doesAssetAmountMatch; +}; -- cgit v1.2.3 From 4bd4ff46cf894a29bc6d4a9b58c4d6a4bd5e2ddd Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Fri, 26 Oct 2018 11:36:01 -0700 Subject: Make doesBuyQuoteMatchState in reducer less strict --- packages/instant/src/redux/reducer.ts | 19 ++++++++++++------- 1 file changed, 12 insertions(+), 7 deletions(-) diff --git a/packages/instant/src/redux/reducer.ts b/packages/instant/src/redux/reducer.ts index 4f572532a..614ed21ac 100644 --- a/packages/instant/src/redux/reducer.ts +++ b/packages/instant/src/redux/reducer.ts @@ -143,12 +143,17 @@ const doesBuyQuoteMatchState = (buyQuote: BuyQuote, state: State): boolean => { if (selectedAssetIfExists.assetData !== buyQuote.assetData) { return false; } - // if buyQuote's assetBuyAmount does not match selectedAssetAmount, return false + // if ERC20 and buyQuote's assetBuyAmount does not match selectedAssetAmount, return false + // if ERC721, return true const selectedAssetMetaData = selectedAssetIfExists.metaData; - const selectedAssetAmountBaseUnits = - selectedAssetMetaData.assetProxyId === AssetProxyId.ERC20 - ? Web3Wrapper.toBaseUnitAmount(selectedAssetAmountIfExists, selectedAssetMetaData.decimals) - : new BigNumber(1); - const doesAssetAmountMatch = selectedAssetAmountBaseUnits.eq(buyQuote.assetBuyAmount); - return doesAssetAmountMatch; + if (selectedAssetMetaData.assetProxyId === AssetProxyId.ERC20) { + const selectedAssetAmountBaseUnits = Web3Wrapper.toBaseUnitAmount( + selectedAssetAmountIfExists, + selectedAssetMetaData.decimals, + ); + const doesAssetAmountMatch = selectedAssetAmountBaseUnits.eq(buyQuote.assetBuyAmount); + return doesAssetAmountMatch; + } else { + return true; + } }; -- cgit v1.2.3 From 6f4dbc71f223f52c16320f3c65be92f99075dfec Mon Sep 17 00:00:00 2001 From: Brandon Millman Date: Fri, 26 Oct 2018 13:11:47 -0700 Subject: Add back debounce --- packages/instant/src/containers/selected_erc20_asset_amount_input.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) 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 828c4fcb5..ee76e9d66 100644 --- a/packages/instant/src/containers/selected_erc20_asset_amount_input.ts +++ b/packages/instant/src/containers/selected_erc20_asset_amount_input.ts @@ -79,6 +79,8 @@ const updateBuyQuoteAsync = async ( dispatch(actions.updateLatestBuyQuote(newBuyQuote)); }; +const debouncedUpdateBuyQuoteAsync = _.debounce(updateBuyQuoteAsync, 200, { trailing: true }); + const mapDispatchToProps = ( dispatch: Dispatch, _ownProps: SelectedERC20AssetAmountInputProps, @@ -95,7 +97,7 @@ const mapDispatchToProps = ( // even if it's debounced, give them the illusion it's loading dispatch(actions.setQuoteRequestStatePending()); // tslint:disable-next-line:no-floating-promises - updateBuyQuoteAsync(assetBuyer, dispatch, asset, value); + debouncedUpdateBuyQuoteAsync(assetBuyer, dispatch, asset, value); } }, }); -- cgit v1.2.3