more trade form improvements

This commit is contained in:
Tyler Shipe 2021-08-18 16:15:17 -04:00
parent 86ea7afcff
commit 0af7a8b8ee
7 changed files with 97 additions and 42 deletions

View File

@ -2,7 +2,11 @@ import React, { useEffect, useMemo, useState } from 'react'
import Slider from 'rc-slider'
import 'rc-slider/assets/index.css'
import useMangoStore from '../stores/useMangoStore'
import { getMarketIndexBySymbol } from '@blockworks-foundation/mango-client'
import {
getMarketIndexBySymbol,
I80F48,
PerpMarket,
} from '@blockworks-foundation/mango-client'
import tw from 'twin.macro'
import styled from '@emotion/styled'
import 'rc-slider/assets/index.css'
@ -41,6 +45,7 @@ type SliderProps = {
step: number
value: number
side: string
price: number
disabled?: boolean
max?: number
maxButtonTransition?: boolean
@ -54,6 +59,7 @@ export default function LeverageSlider({
disabled,
maxButtonTransition,
side,
price,
}: SliderProps) {
const [enableTransition, setEnableTransition] = useState(false)
const mangoAccount = useMangoStore((s) => s.selectedMangoAccount.current)
@ -68,35 +74,44 @@ export default function LeverageSlider({
marketConfig.baseSymbol
)
const marketInfo = useMemo(() => {
if (mangoGroup) {
if (marketType === 'perp') {
return mangoGroup.perpMarkets[marketIndex]
} else {
return mangoGroup.spotMarkets[marketIndex]
}
}
}, [marketType, mangoGroup, marketIndex])
const max = useMemo(() => {
if (mangoAccount) {
console.log('market', market)
if (!mangoAccount) return 0
const priceOrDefault = price
? I80F48.fromNumber(price)
: mangoGroup.getPrice(marketIndex, mangoCache)
console.log('price', priceOrDefault.toFixed())
const maxQuote = mangoAccount
.getMaxLeverageForMarket(
mangoGroup,
mangoCache,
marketIndex,
marketInfo.initAssetWeight,
marketInfo.initLiabWeight,
market,
side
)
.toNumber()
return maxQuote / mangoGroup.getPrice(marketIndex, mangoCache).toNumber()
}
return 0
}, [mangoAccount, marketInfo, mangoGroup, mangoCache, side, marketIndex])
const maxQuote = mangoAccount
.getMaxLeverageForMarket(
mangoGroup,
mangoCache,
marketIndex,
market,
side,
priceOrDefault
)
.toNumber()
console.log('max quote :: ', maxQuote)
if (maxQuote <= 0) return 0
// mul by scaler value to account for rounding errors in getMaxLeverageForMarket or fees
const maxScaler = market instanceof PerpMarket ? 0.99 : 0.95
const max =
(maxQuote * maxScaler) /
mangoGroup.getPrice(marketIndex, mangoCache).toNumber()
return max
}, [
mangoAccount,
mangoGroup,
mangoCache,
marketIndex,
market,
marketType,
side,
step,
price,
])
useEffect(() => {
if (maxButtonTransition) {

View File

@ -226,8 +226,10 @@ const PositionsTable = () => {
)}
</Td>
<Td className="px-2 py-2 whitespace-nowrap text-sm text-th-fgd-1">
{perpMarket.baseLotsToNumber(
perpAccount.basePosition
{Math.abs(
perpMarket.baseLotsToNumber(
perpAccount.basePosition
)
)}
</Td>
<Th

View File

@ -6,7 +6,7 @@ import {
PerpMarket,
} from '@blockworks-foundation/mango-client'
import { notify } from '../utils/notifications'
import { calculateMarketPrice, getDecimalCount, sleep } from '../utils'
import { calculateTradePrice, getDecimalCount, sleep } from '../utils'
import FloatingElement from './FloatingElement'
import { floorToDecimal } from '../utils/index'
import useMangoStore, { mangoClient } from '../stores/useMangoStore'
@ -235,9 +235,20 @@ export default function TradeForm() {
setSubmitting(true)
try {
let orderPrice = Number(price)
if (tradeType === 'Market') {
orderPrice = calculateMarketPrice(orderbook, baseSize, side)
const orderPrice = calculateTradePrice(
tradeType,
orderbook,
baseSize,
side,
price
)
if (!orderPrice) {
notify({
title: 'Price not available',
description: 'Please try again',
type: 'error',
})
}
const orderType = ioc ? 'ioc' : postOnly ? 'postOnly' : 'limit'
@ -377,6 +388,13 @@ export default function TradeForm() {
step={parseFloat(minOrderSize)}
disabled={false}
side={side}
price={calculateTradePrice(
tradeType,
orderbook,
baseSize ? baseSize : 0,
side,
price
)}
/>
{tradeType !== 'Market' ? (
<div className="flex mt-4">

View File

@ -37,9 +37,10 @@ const PerpMarket = () => {
state.selectedMarket.kind = 'perp'
if (newMarket.name !== marketConfig.name) {
state.selectedMarket.config = newMarket
state.tradeForm.price = mangoGroup
.getPrice(marketIndex, mangoCache)
.toFixed(2)
state.tradeForm.price =
state.tradeForm.tradeType === 'Limit'
? mangoGroup.getPrice(marketIndex, mangoCache).toFixed(2)
: ''
}
})
}

View File

@ -40,9 +40,10 @@ const SpotMarket = () => {
state.selectedMarket.kind = 'spot'
if (newMarket.name !== marketConfig.name) {
state.selectedMarket.config = newMarket
state.tradeForm.price = mangoGroup
.getPrice(marketIndex, mangoCache)
.toFixed(2)
state.tradeForm.price =
state.tradeForm.tradeType === 'Limit'
? mangoGroup.getPrice(marketIndex, mangoCache).toFixed(2)
: ''
}
})
}

View File

@ -149,11 +149,24 @@ export function isDefined<T>(argument: T | undefined): argument is T {
return argument !== undefined
}
export function calculateTradePrice(
tradeType: string,
orderBook: Orderbook,
baseSize: number,
side: 'buy' | 'sell',
price: string | number
): number {
if (tradeType === 'Market') {
return calculateMarketPrice(orderBook, baseSize, side)
}
return Number(price)
}
export const calculateMarketPrice = (
orderBook: Orderbook,
size: number,
side: 'buy' | 'sell'
) => {
): number => {
const orders = side === 'buy' ? orderBook.asks : orderBook.bids
let acc = 0
let selectedOrder
@ -165,6 +178,11 @@ export const calculateMarketPrice = (
}
}
if (!selectedOrder) {
console.error('Orderbook empty no market price available')
return
}
if (side === 'buy') {
return selectedOrder[0] * 1.05
} else {

View File

@ -995,7 +995,7 @@
"@blockworks-foundation/mango-client@git+https://github.com/blockworks-foundation/mango-client-v3.git":
version "3.0.4"
resolved "git+https://github.com/blockworks-foundation/mango-client-v3.git#29b6d5e35428515e25e91892dc679e8fbcb590a7"
resolved "git+https://github.com/blockworks-foundation/mango-client-v3.git#b1a52165e65e5557f3233738ec5a0e5a8aba2adc"
dependencies:
"@project-serum/serum" "0.13.55"
"@project-serum/sol-wallet-adapter" "^0.2.0"