LaconicNetwork/mars-v2-frontend
4
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(swap): reflect buy side amounts onto range input (#392)

Browse Source
This commit is contained in:
Yusuf Seyrek 2023-08-24 13:59:41 +03:00 committed by GitHub
parent 6dcc13affb
commit 50f365044c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 29 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
src/components/Trade/TradeModule/SwapForm/index.tsx
View File

@ -79,14 +79,15 @@ export default function SwapForm(props: Props) {
const handleRangeInputChange = useCallback( const handleRangeInputChange = useCallback(
(value: number) => { (value: number) => {
onChangeSellAmount(BN(value).shiftedBy(sellAsset.decimals).integerValue()) onChangeBuyAmount(BN(value).shiftedBy(buyAsset.decimals).integerValue())
}, },
[sellAsset.decimals, onChangeSellAmount], [onChangeBuyAmount, buyAsset.decimals],
) )
const [maxSellAmount, marginThreshold] = useMemo(() => { const [maxSellAmount, sellSideMarginThreshold, marginRatio] = useMemo(() => {
const maxAmount = computeMaxSwapAmount(sellAsset.denom, buyAsset.denom, 'default') const maxAmount = computeMaxSwapAmount(sellAsset.denom, buyAsset.denom, 'default')
const maxAmountOnMargin = computeMaxSwapAmount(sellAsset.denom, buyAsset.denom, 'margin') const maxAmountOnMargin = computeMaxSwapAmount(sellAsset.denom, buyAsset.denom, 'margin')
const marginRatio = maxAmount.dividedBy(maxAmountOnMargin)
estimateExactIn( estimateExactIn(
{ {
@ -96,11 +97,11 @@ export default function SwapForm(props: Props) {
buyAsset.denom, buyAsset.denom,
).then(setMaxBuyableAmountEstimation) ).then(setMaxBuyableAmountEstimation)
if (isMarginChecked) return [maxAmountOnMargin, maxAmount] if (isMarginChecked) return [maxAmountOnMargin, maxAmount, marginRatio]
if (sellAssetAmount.isGreaterThan(maxAmount)) onChangeSellAmount(maxAmount) if (sellAssetAmount.isGreaterThan(maxAmount)) onChangeSellAmount(maxAmount)
return [maxAmount, maxAmount] return [maxAmount, maxAmount, marginRatio]
}, [ }, [
computeMaxSwapAmount, computeMaxSwapAmount,
sellAsset.denom, sellAsset.denom,
@ -110,6 +111,10 @@ export default function SwapForm(props: Props) {
sellAssetAmount, sellAssetAmount,
]) ])
const buySideMarginThreshold = useMemo(() => {
return maxBuyableAmountEstimation.multipliedBy(marginRatio)
}, [marginRatio, maxBuyableAmountEstimation])
const [buyAssetValue, sellAssetValue] = useMemo(() => { const [buyAssetValue, sellAssetValue] = useMemo(() => {
const buyAssetPrice = prices.find(byDenom(buyAsset.denom))?.amount ?? BN_ZERO const buyAssetPrice = prices.find(byDenom(buyAsset.denom))?.amount ?? BN_ZERO
const sellAssetPrice = prices.find(byDenom(sellAsset.denom))?.amount ?? BN_ZERO const sellAssetPrice = prices.find(byDenom(sellAsset.denom))?.amount ?? BN_ZERO
@ -129,8 +134,11 @@ export default function SwapForm(props: Props) {
]) ])
const swapTx = useMemo(() => { const swapTx = useMemo(() => {
const borrowCoin = sellAssetAmount.isGreaterThan(marginThreshold) const borrowCoin = sellAssetAmount.isGreaterThan(sellSideMarginThreshold)
? BNCoin.fromDenomAndBigNumber(sellAsset.denom, sellAssetAmount.minus(marginThreshold)) ? BNCoin.fromDenomAndBigNumber(
sellAsset.denom,
sellAssetAmount.minus(sellSideMarginThreshold),
)
: undefined : undefined
return swap({ return swap({
@ -143,7 +151,7 @@ export default function SwapForm(props: Props) {
}, [ }, [
account?.id, account?.id,
buyAsset.denom, buyAsset.denom,
marginThreshold, sellSideMarginThreshold,
sellAsset.denom, sellAsset.denom,
sellAssetAmount, sellAssetAmount,
slippage, slippage,
@ -169,11 +177,11 @@ export default function SwapForm(props: Props) {
}, [buyAsset.denom, sellAsset.denom, removeDeposits, addDeposits, addDebt]) }, [buyAsset.denom, sellAsset.denom, removeDeposits, addDeposits, addDebt])
useEffect(() => { useEffect(() => {
const removeDepositAmount = sellAssetAmount.isGreaterThanOrEqualTo(marginThreshold) const removeDepositAmount = sellAssetAmount.isGreaterThanOrEqualTo(sellSideMarginThreshold)
? marginThreshold ? sellSideMarginThreshold
: sellAssetAmount : sellAssetAmount
const addDebtAmount = sellAssetAmount.isGreaterThan(marginThreshold) const addDebtAmount = sellAssetAmount.isGreaterThan(sellSideMarginThreshold)
? sellAssetAmount.minus(marginThreshold) ? sellAssetAmount.minus(sellSideMarginThreshold)
: BN_ZERO : BN_ZERO
const removeCoin = BNCoin.fromDenomAndBigNumber(sellAsset.denom, removeDepositAmount) const removeCoin = BNCoin.fromDenomAndBigNumber(sellAsset.denom, removeDepositAmount)
const debtCoin = BNCoin.fromDenomAndBigNumber(sellAsset.denom, addDebtAmount) const debtCoin = BNCoin.fromDenomAndBigNumber(sellAsset.denom, addDebtAmount)
@ -183,7 +191,7 @@ export default function SwapForm(props: Props) {
}, [ }, [
sellAssetAmount, sellAssetAmount,
buyAssetAmount, buyAssetAmount,
marginThreshold, sellSideMarginThreshold,
buyAsset.denom, buyAsset.denom,
sellAsset.denom, sellAsset.denom,
debouncedUpdateAccount, debouncedUpdateAccount,
@ -232,12 +240,14 @@ export default function SwapForm(props: Props) {
<RangeInput <RangeInput
wrapperClassName='p-4' wrapperClassName='p-4'
disabled={isConfirming || maxSellAmount.isZero()} disabled={isConfirming || maxBuyableAmountEstimation.isZero()}
onChange={handleRangeInputChange} onChange={handleRangeInputChange}
value={sellAssetAmount.shiftedBy(-sellAsset.decimals).toNumber()} value={buyAssetAmount.shiftedBy(-buyAsset.decimals).toNumber()}
max={maxSellAmount.shiftedBy(-sellAsset.decimals).toNumber()} max={maxBuyableAmountEstimation.shiftedBy(-buyAsset.decimals).toNumber()}
marginThreshold={ marginThreshold={
isMarginChecked ? marginThreshold.shiftedBy(-sellAsset.decimals).toNumber() : undefined isMarginChecked
? buySideMarginThreshold.shiftedBy(-buyAsset.decimals).toNumber()
: undefined
} }
/> />
@ -263,8 +273,8 @@ export default function SwapForm(props: Props) {
showProgressIndicator={isConfirming} showProgressIndicator={isConfirming}
isMargin={isMarginChecked} isMargin={isMarginChecked}
borrowAmount={ borrowAmount={
sellAssetAmount.isGreaterThan(marginThreshold) sellAssetAmount.isGreaterThan(sellSideMarginThreshold)
? sellAssetAmount.minus(marginThreshold) ? sellAssetAmount.minus(sellSideMarginThreshold)
: BN_ZERO : BN_ZERO
} }
estimatedFee={estimatedFee} estimatedFee={estimatedFee}