add useMargin to max trade size button
This commit is contained in:
parent
35cd56b9fc
commit
8736d7991e
|
@ -394,6 +394,7 @@ const AdvancedTradeForm = () => {
|
||||||
<MaxSizeButton
|
<MaxSizeButton
|
||||||
minOrderDecimals={minOrderDecimals}
|
minOrderDecimals={minOrderDecimals}
|
||||||
tickDecimals={tickDecimals}
|
tickDecimals={tickDecimals}
|
||||||
|
useMargin={useMargin}
|
||||||
/>
|
/>
|
||||||
<div className="flex flex-col">
|
<div className="flex flex-col">
|
||||||
<div className="default-transition flex items-center rounded-md rounded-b-none border border-th-input-border bg-th-input-bkg p-2 text-sm font-bold text-th-fgd-1 md:hover:z-10 md:hover:border-th-input-border-hover lg:text-base">
|
<div className="default-transition flex items-center rounded-md rounded-b-none border border-th-input-border bg-th-input-bkg p-2 text-sm font-bold text-th-fgd-1 md:hover:z-10 md:hover:border-th-input-border-hover lg:text-base">
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Serum3Market } from '@blockworks-foundation/mango-v4'
|
import { PerpMarket, Serum3Market } from '@blockworks-foundation/mango-v4'
|
||||||
import MaxAmountButton from '@components/shared/MaxAmountButton'
|
import MaxAmountButton from '@components/shared/MaxAmountButton'
|
||||||
import { FadeInFadeOut } from '@components/shared/Transitions'
|
import { FadeInFadeOut } from '@components/shared/Transitions'
|
||||||
import mangoStore from '@store/mangoStore'
|
import mangoStore from '@store/mangoStore'
|
||||||
|
@ -7,37 +7,33 @@ import useSelectedMarket from 'hooks/useSelectedMarket'
|
||||||
import { useTranslation } from 'next-i18next'
|
import { useTranslation } from 'next-i18next'
|
||||||
import { useCallback, useMemo } from 'react'
|
import { useCallback, useMemo } from 'react'
|
||||||
import { floorToDecimal } from 'utils/numbers'
|
import { floorToDecimal } from 'utils/numbers'
|
||||||
|
import { useSpotMarketMax } from './SpotSlider'
|
||||||
|
|
||||||
const MaxSizeButton = ({
|
const MaxSizeButton = ({
|
||||||
minOrderDecimals,
|
minOrderDecimals,
|
||||||
tickDecimals,
|
tickDecimals,
|
||||||
|
useMargin,
|
||||||
}: {
|
}: {
|
||||||
minOrderDecimals: number
|
minOrderDecimals: number
|
||||||
tickDecimals: number
|
tickDecimals: number
|
||||||
|
useMargin: boolean
|
||||||
}) => {
|
}) => {
|
||||||
const { t } = useTranslation(['common', 'trade'])
|
const { t } = useTranslation(['common', 'trade'])
|
||||||
const { mangoAccount } = useMangoAccount()
|
const { mangoAccount } = useMangoAccount()
|
||||||
const { selectedMarket, price: oraclePrice } = useSelectedMarket()
|
const { selectedMarket, price: oraclePrice } = useSelectedMarket()
|
||||||
const { price, side, tradeType } = mangoStore((s) => s.tradeForm)
|
const { price, side, tradeType } = mangoStore((s) => s.tradeForm)
|
||||||
|
const spotMax = useSpotMarketMax(
|
||||||
|
mangoAccount,
|
||||||
|
selectedMarket,
|
||||||
|
side,
|
||||||
|
useMargin
|
||||||
|
)
|
||||||
|
|
||||||
const leverageMax = useMemo(() => {
|
const perpMax = useMemo(() => {
|
||||||
const group = mangoStore.getState().group
|
const group = mangoStore.getState().group
|
||||||
if (!mangoAccount || !group || !selectedMarket) return 0
|
if (!mangoAccount || !group || !selectedMarket) return 0
|
||||||
|
if (selectedMarket instanceof PerpMarket) {
|
||||||
try {
|
try {
|
||||||
if (selectedMarket instanceof Serum3Market) {
|
|
||||||
if (side === 'buy') {
|
|
||||||
return mangoAccount.getMaxQuoteForSerum3BidUi(
|
|
||||||
group,
|
|
||||||
selectedMarket.serumMarketExternal
|
|
||||||
)
|
|
||||||
} else {
|
|
||||||
return mangoAccount.getMaxBaseForSerum3AskUi(
|
|
||||||
group,
|
|
||||||
selectedMarket.serumMarketExternal
|
|
||||||
)
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
if (side === 'buy') {
|
if (side === 'buy') {
|
||||||
return mangoAccount.getMaxQuoteForPerpBidUi(
|
return mangoAccount.getMaxQuoteForPerpBidUi(
|
||||||
group,
|
group,
|
||||||
|
@ -49,60 +45,101 @@ const MaxSizeButton = ({
|
||||||
selectedMarket.perpMarketIndex
|
selectedMarket.perpMarketIndex
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.error('Error calculating max leverage: spot btn group: ', e)
|
||||||
|
return 0
|
||||||
}
|
}
|
||||||
} catch (e) {
|
|
||||||
console.error('Error calculating max leverage: spot btn group: ', e)
|
|
||||||
return 0
|
|
||||||
}
|
}
|
||||||
}, [mangoAccount, side, selectedMarket])
|
}, [mangoAccount, side, selectedMarket])
|
||||||
|
|
||||||
|
// const leverageMax = useMemo(() => {
|
||||||
|
// const group = mangoStore.getState().group
|
||||||
|
// if (!mangoAccount || !group || !selectedMarket) return 0
|
||||||
|
|
||||||
|
// try {
|
||||||
|
// if (selectedMarket instanceof Serum3Market) {
|
||||||
|
// if (side === 'buy') {
|
||||||
|
// return mangoAccount.getMaxQuoteForSerum3BidUi(
|
||||||
|
// group,
|
||||||
|
// selectedMarket.serumMarketExternal
|
||||||
|
// )
|
||||||
|
// } else {
|
||||||
|
// return mangoAccount.getMaxBaseForSerum3AskUi(
|
||||||
|
// group,
|
||||||
|
// selectedMarket.serumMarketExternal
|
||||||
|
// )
|
||||||
|
// }
|
||||||
|
// } else {
|
||||||
|
// if (side === 'buy') {
|
||||||
|
// return mangoAccount.getMaxQuoteForPerpBidUi(
|
||||||
|
// group,
|
||||||
|
// selectedMarket.perpMarketIndex
|
||||||
|
// )
|
||||||
|
// } else {
|
||||||
|
// return mangoAccount.getMaxBaseForPerpAskUi(
|
||||||
|
// group,
|
||||||
|
// selectedMarket.perpMarketIndex
|
||||||
|
// )
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// } catch (e) {
|
||||||
|
// console.error('Error calculating max leverage: spot btn group: ', e)
|
||||||
|
// return 0
|
||||||
|
// }
|
||||||
|
// }, [mangoAccount, side, selectedMarket])
|
||||||
|
|
||||||
const handleMax = useCallback(() => {
|
const handleMax = useCallback(() => {
|
||||||
|
const max = selectedMarket instanceof Serum3Market ? spotMax : perpMax || 0
|
||||||
const set = mangoStore.getState().set
|
const set = mangoStore.getState().set
|
||||||
set((state) => {
|
set((state) => {
|
||||||
if (side === 'buy') {
|
if (side === 'buy') {
|
||||||
state.tradeForm.quoteSize = floorToDecimal(
|
state.tradeForm.quoteSize = floorToDecimal(max, tickDecimals).toFixed()
|
||||||
leverageMax,
|
|
||||||
tickDecimals
|
|
||||||
).toFixed()
|
|
||||||
if (tradeType === 'Market' || !price) {
|
if (tradeType === 'Market' || !price) {
|
||||||
state.tradeForm.baseSize = floorToDecimal(
|
state.tradeForm.baseSize = floorToDecimal(
|
||||||
leverageMax / oraclePrice,
|
max / oraclePrice,
|
||||||
minOrderDecimals
|
minOrderDecimals
|
||||||
).toFixed()
|
).toFixed()
|
||||||
} else {
|
} else {
|
||||||
state.tradeForm.baseSize = floorToDecimal(
|
state.tradeForm.baseSize = floorToDecimal(
|
||||||
leverageMax / parseFloat(price),
|
max / parseFloat(price),
|
||||||
minOrderDecimals
|
minOrderDecimals
|
||||||
).toFixed()
|
).toFixed()
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
state.tradeForm.baseSize = floorToDecimal(
|
state.tradeForm.baseSize = floorToDecimal(max, tickDecimals).toFixed()
|
||||||
leverageMax,
|
|
||||||
tickDecimals
|
|
||||||
).toFixed()
|
|
||||||
if (tradeType === 'Market' || !price) {
|
if (tradeType === 'Market' || !price) {
|
||||||
state.tradeForm.quoteSize = floorToDecimal(
|
state.tradeForm.quoteSize = floorToDecimal(
|
||||||
leverageMax * oraclePrice,
|
max * oraclePrice,
|
||||||
minOrderDecimals
|
minOrderDecimals
|
||||||
).toFixed()
|
).toFixed()
|
||||||
} else {
|
} else {
|
||||||
state.tradeForm.quoteSize = floorToDecimal(
|
state.tradeForm.quoteSize = floorToDecimal(
|
||||||
leverageMax * parseFloat(price),
|
max * parseFloat(price),
|
||||||
minOrderDecimals
|
minOrderDecimals
|
||||||
).toFixed()
|
).toFixed()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}, [leverageMax, price, side, tradeType])
|
}, [perpMax, spotMax, price, side, tradeType, selectedMarket])
|
||||||
|
|
||||||
const maxAmount = useMemo(() => {
|
const maxAmount = useMemo(() => {
|
||||||
|
const max = selectedMarket instanceof Serum3Market ? spotMax : perpMax || 0
|
||||||
const tradePrice = tradeType === 'Market' ? oraclePrice : Number(price)
|
const tradePrice = tradeType === 'Market' ? oraclePrice : Number(price)
|
||||||
if (side === 'buy') {
|
if (side === 'buy') {
|
||||||
return floorToDecimal(leverageMax / tradePrice, tickDecimals).toFixed()
|
return floorToDecimal(max / tradePrice, tickDecimals).toFixed()
|
||||||
} else {
|
} else {
|
||||||
return floorToDecimal(leverageMax, minOrderDecimals).toFixed()
|
return floorToDecimal(max, minOrderDecimals).toFixed()
|
||||||
}
|
}
|
||||||
}, [leverageMax, minOrderDecimals, tickDecimals, price, side, tradeType])
|
}, [
|
||||||
|
perpMax,
|
||||||
|
spotMax,
|
||||||
|
selectedMarket,
|
||||||
|
minOrderDecimals,
|
||||||
|
tickDecimals,
|
||||||
|
price,
|
||||||
|
side,
|
||||||
|
tradeType,
|
||||||
|
])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="mb-2 mt-3 flex items-center justify-between">
|
<div className="mb-2 mt-3 flex items-center justify-between">
|
||||||
|
|
Loading…
Reference in New Issue