From 814bc1dba69651dbabe2f3059347f2e05e1a5d78 Mon Sep 17 00:00:00 2001 From: vantuz-subhuman Date: Thu, 20 Jun 2024 18:41:09 +0300 Subject: [PATCH] removed state-updating logic from component render. Moved it to be an effect --- .../swap/asset-swap/CreateSwapOrder.js | 19 ++----------------- .../context/swap-form/SwapFormProvider.js | 18 +++++++++++------- 2 files changed, 13 insertions(+), 24 deletions(-) diff --git a/packages/yoroi-extension/app/containers/swap/asset-swap/CreateSwapOrder.js b/packages/yoroi-extension/app/containers/swap/asset-swap/CreateSwapOrder.js index f675e981fc..a7e1af3996 100644 --- a/packages/yoroi-extension/app/containers/swap/asset-swap/CreateSwapOrder.js +++ b/packages/yoroi-extension/app/containers/swap/asset-swap/CreateSwapOrder.js @@ -38,32 +38,17 @@ export const CreateSwapOrder = ({ priceImpactState, }: Props): React$Node => { const [openedDialog, setOpenedDialog] = useState(''); - const [prevSelectedPoolId, setPrevSelectedPoolId] = useState(undefined); const { orderData: { type: orderType, - selectedPoolCalculation, }, - // unsignedTxChanged, sellTokenInfoChanged, buyTokenInfoChanged, } = useSwap(); const { onChangeLimitPrice } = useSwapForm(); - const resetLimitPrice = () => { - onChangeLimitPrice(''); - }; - - if (orderType === 'market') { - const selectedPoolId = selectedPoolCalculation?.pool.poolId; - if (selectedPoolId !== prevSelectedPoolId) { - setPrevSelectedPoolId(selectedPoolId); - resetLimitPrice(); - } - } - return ( <> setOpenedDialog('')} onTokenInfoChanged={val => { - resetLimitPrice(); + onChangeLimitPrice(); sellTokenInfoChanged(val); }} defaultTokenInfo={defaultTokenInfo} @@ -129,7 +114,7 @@ export const CreateSwapOrder = ({ store={swapStore} onClose={() => setOpenedDialog('')} onTokenInfoChanged={val => { - resetLimitPrice(); + onChangeLimitPrice(); buyTokenInfoChanged(val); }} defaultTokenInfo={defaultTokenInfo} diff --git a/packages/yoroi-extension/app/containers/swap/context/swap-form/SwapFormProvider.js b/packages/yoroi-extension/app/containers/swap/context/swap-form/SwapFormProvider.js index 716491085a..03f57e2ee7 100644 --- a/packages/yoroi-extension/app/containers/swap/context/swap-form/SwapFormProvider.js +++ b/packages/yoroi-extension/app/containers/swap/context/swap-form/SwapFormProvider.js @@ -10,6 +10,7 @@ import { Quantities } from '../../../../utils/quantities'; import SwapStore from '../../../../stores/ada/SwapStore'; import { defaultSwapFormState } from './DefaultSwapFormState'; import { PRICE_PRECISION } from '../../../../components/swap/common'; +import { runInAction } from 'mobx'; // const PRECISION = 14; type Props = {| @@ -208,10 +209,6 @@ export default function SwapFormProvider({ swapStore, children }: Props): Node { actions.buyInputValueChanged(input); }; - const limitPriceUpdateHandler = ({ input }) => { - actions.limitPriceInputValueChanged(input); - }; - const onChangeSellQuantity = useCallback( baseSwapFieldChangeHandler(swapFormState.sellTokenInfo, sellUpdateHandler), [sellQuantityChanged, actions, clearErrors] @@ -223,7 +220,7 @@ export default function SwapFormProvider({ swapStore, children }: Props): Node { ); const onChangeLimitPrice = useCallback( - text => { + (text = '') => { const [formattedPrice, price] = Quantities.parseFromText( text, orderData.tokens.priceDenomination, @@ -238,6 +235,13 @@ export default function SwapFormProvider({ swapStore, children }: Props): Node { [actions, clearErrors, orderData.tokens.priceDenomination, limitPriceChanged, numberLocale] ); + // on selected best pool changes + useEffect(() => { + if (orderData.type === 'market') { + onChangeLimitPrice(); + } + }, [orderData.selectedPoolCalculation?.pool.poolId]); + const sellFocusState = StateWrap(useState(false)); const buyFocusState = StateWrap(useState(false)); const limitPriceFocusState = StateWrap(useState(false)); @@ -266,7 +270,7 @@ export default function SwapFormProvider({ swapStore, children }: Props): Node { PRICE_PRECISION ); - limitPriceUpdateHandler({ input: formatted }); + actions.limitPriceInputValueChanged(formatted); } else if (orderData.type === 'market') { const formatted = Quantities.format( orderData.selectedPoolCalculation?.prices.market ?? Quantities.zero, @@ -274,7 +278,7 @@ export default function SwapFormProvider({ swapStore, children }: Props): Node { PRICE_PRECISION ); - limitPriceUpdateHandler({ input: formatted }); + actions.limitPriceInputValueChanged(formatted); } }, [ orderData.tokens.priceDenomination,