fix: refresh exchange rate when token pair changed

This commit is contained in:
Kyle Fang
2023-09-06 10:34:42 +08:00
parent d2af879a03
commit f570fe3176
4 changed files with 23 additions and 4 deletions

View File

@@ -25,6 +25,7 @@ export function SwapAmountField({ amountAsFiat, isDisabled, name }: SwapAmountFi
const value = event.currentTarget.value;
const { swapAssetFrom, swapAssetTo } = values;
if (swapAssetFrom != null && swapAssetTo && !isNaN(Number(value))) {
await setFieldValue('swapAmountTo', '');
const toAmount = await fetchToAmount(swapAssetFrom, swapAssetTo, value);
await setFieldValue('swapAmountTo', toAmount);
}

View File

@@ -50,6 +50,7 @@ export function SwapSelectedAssetFrom({ onChooseAsset, title }: SwapSelectedAsse
}
const { swapAssetFrom, swapAssetTo } = values;
if (swapAssetTo != null && swapAssetFrom != null) {
await setFieldValue('swapAmountTo', '');
const toAmount = await fetchToAmount(swapAssetFrom, swapAssetTo, formattedBalance);
await setFieldValue('swapAmountTo', toAmount);
await validateForm();

View File

@@ -4,6 +4,8 @@ import { Box } from '@stacks/ui';
import { useFormikContext } from 'formik';
import get from 'lodash.get';
import { useSwapContext } from '@app/pages/swap/swap.context';
import { SwapAsset, SwapFormValues } from '../../hooks/use-swap';
import { SwapAssetItem } from './swap-asset-item';
import { SwapAssetListLayout } from './swap-asset-list.layout';
@@ -12,14 +14,29 @@ interface SwapAssetList {
assets: SwapAsset[];
}
export function SwapAssetList({ assets }: SwapAssetList) {
const { setFieldValue } = useFormikContext<SwapFormValues>();
const { fetchToAmount } = useSwapContext();
const { setFieldValue, values } = useFormikContext<SwapFormValues>();
const location = useLocation();
const navigate = useNavigate();
async function onChooseAsset(asset: SwapAsset) {
if (get(location.state, 'swap') === 'from') await setFieldValue('swapAssetFrom', asset);
if (get(location.state, 'swap') === 'to') await setFieldValue('swapAssetTo', asset);
let from: SwapAsset | undefined;
let to: SwapAsset | undefined;
if (get(location.state, 'swap') === 'from') {
from = asset;
to = values.swapAssetTo;
await setFieldValue('swapAssetFrom', asset);
} else if (get(location.state, 'swap') === 'to') {
from = values.swapAssetFrom;
to = asset;
await setFieldValue('swapAssetTo', asset);
}
navigate(-1);
if (values.swapAmountFrom && from && to) {
await setFieldValue('swapAmountTo', '');
const toAmount = await fetchToAmount(from, to, values.swapAmountFrom);
await setFieldValue('swapAmountTo', toAmount);
}
}
return (

View File

@@ -29,7 +29,7 @@ const oneHundredMillion = 100_000_000;
export function SwapContainer() {
const alexSDK = useState(() => new AlexSDK())[0];
const { data: supportedCurrencies = [] } = useQuery(['alex-supported-currencies'], async () =>
const { data: supportedCurrencies = [] } = useQuery(['alex-supported-swap-currencies'], async () =>
alexSDK.fetchSwappableCurrency()
);