display unparsed perp history

This commit is contained in:
Tyler Shipe 2021-06-24 12:30:45 -04:00
parent 049da99a01
commit 25d41f2f58
6 changed files with 64 additions and 43 deletions

View File

@ -3,11 +3,8 @@ import Link from 'next/link'
import { ArrowSmDownIcon } from '@heroicons/react/solid'
import { useRouter } from 'next/router'
import { useOpenOrders } from '../hooks/useOpenOrders'
// import { cancelOrderAndSettle } from '../utils/mango'
import Button, { LinkButton } from './Button'
import Loading from './Loading'
// import { PublicKey } from '@solana/web3.js'
// import useConnection from '../hooks/useConnection'
import useMangoStore, { mangoClient } from '../stores/useMangoStore'
import { notify } from '../utils/notifications'
import { Table, Thead, Tbody, Tr, Th, Td } from 'react-super-responsive-table'
@ -21,7 +18,6 @@ const OpenOrdersTable = () => {
const openOrders = useOpenOrders()
const { items, requestSort, sortConfig } = useSortableData(openOrders)
const [cancelId, setCancelId] = useState(null)
// const { connection, programId } = useConnection()
const actions = useMangoStore((s) => s.actions)
const handleCancelOrder = async (

View File

@ -10,7 +10,6 @@ import {
SwitchHorizontalIcon,
} from '@heroicons/react/solid'
import useMarkPrice from '../hooks/useMarkPrice'
import useOrderbook from '../hooks/useOrderbook'
import useMarket from '../hooks/useMarket'
import { ElementTitle } from './styles'
import useMangoStore from '../stores/useMangoStore'

View File

@ -1,28 +1,18 @@
import { useEffect } from 'react'
import useMangoStore from '../stores/useMangoStore'
export function useTrades() {
const trades = useMangoStore((state) => state.selectedMarket.fills)
if (!trades) {
return null
}
console.log('trades', trades)
// Until partial fills are each given their own fill, use maker fills
return trades
.filter(({ eventFlags }) => eventFlags.maker)
.map((trade) => ({
...trade,
side: trade.side === 'buy' ? 'sell' : 'buy',
}))
}
export default function useMarkPrice() {
const setMangoStore = useMangoStore((s) => s.set)
const markPrice = useMangoStore((s) => s.selectedMarket.markPrice)
const orderbook = useMangoStore((s) => s.selectedMarket.orderBook)
const fills = useMangoStore((state) => state.selectedMarket.fills)
const trades = useTrades()
const trades = fills
.filter((trade) => trade?.eventFlags?.maker || trade?.maker)
.map((trade) => ({
...trade,
side: trade.side === 'buy' ? 'sell' : 'buy',
}))
useEffect(() => {
const bb = orderbook?.bids?.length > 0 && Number(orderbook.bids[0][0])

View File

@ -1,6 +1,6 @@
import { useEffect, useMemo } from 'react'
import { useEffect } from 'react'
import { Orderbook as SpotOrderBook, Market } from '@project-serum/serum'
import useMangoStore, { Orderbook } from '../stores/useMangoStore'
import useMangoStore from '../stores/useMangoStore'
import {
BookSide,
BookSideLayout,

View File

@ -6,10 +6,27 @@ const byTimestamp = (a, b) => {
)
}
const formatTradeHistory = (newTradeHistory) => {
return newTradeHistory
.flat()
.map((trade) => {
const parsedPerpEvent = (trade) => {
let side
if (trade.maker) {
side = trade.quoteChange === 0 ? 'buy' : 'sell'
} else {
side = trade.quoteChange === 0 ? 'sell' : 'buy'
}
return {
...trade,
marketName: trade.marketName
? trade.marketName
: `${trade.baseCurrency}/${trade.quoteCurrency}`,
key: `${trade.orderId}-${trade.uuid}`,
liquidity: trade.maker,
value: trade.price * trade.size,
side,
}
}
const parsedSerumEvent = (trade) => {
return {
...trade,
marketName: trade.marketName
@ -18,35 +35,48 @@ const formatTradeHistory = (newTradeHistory) => {
key: `${trade.orderId}-${trade.uuid}`,
liquidity: trade.maker || trade?.eventFlags?.maker ? 'Maker' : 'Taker',
value: trade.price * trade.size,
side: trade.side,
}
}
const formatTradeHistory = (newTradeHistory) => {
return newTradeHistory
.flat()
.map((trade) => {
if (trade.eventFlags) {
return parsedSerumEvent(trade)
} else {
return parsedPerpEvent(trade)
}
})
.sort(byTimestamp)
}
const useFills = () => {
export const useTradeHistory = () => {
const marketConfig = useMangoStore((s) => s.selectedMarket.config)
const fills = useMangoStore((s) => s.selectedMarket.fills)
const mangoAccount = useMangoStore((s) => s.selectedMangoAccount.current)
const selectedMangoGroup = useMangoStore((s) => s.selectedMangoGroup.current)
const tradeHistory = useMangoStore((s) => s.tradeHistory)
if (!mangoAccount || !selectedMangoGroup) return null
const openOrdersAccount =
mangoAccount.spotOpenOrdersAccounts[marketConfig.marketIndex]
if (!openOrdersAccount) return []
return fills
.filter((fill) => fill.openOrders.equals(openOrdersAccount.publicKey))
.map((fill) => ({ ...fill, marketName: marketConfig.name }))
const mangoAccountFills = fills
.filter((fill) => {
if (fill.eventFlags) {
return fill.openOrders.equals(openOrdersAccount.publicKey)
} else {
return fill.owner.equals(mangoAccount.publicKey)
}
export const useTradeHistory = () => {
const eventQueueFills = useFills()
const tradeHistory = useMangoStore((s) => s.tradeHistory)
})
.map((fill) => ({ ...fill, marketName: marketConfig.name }))
const allTrades = []
if (eventQueueFills && eventQueueFills.length > 0) {
const newFills = eventQueueFills.filter(
if (mangoAccountFills && mangoAccountFills.length > 0) {
const newFills = mangoAccountFills.filter(
(fill) =>
!tradeHistory.flat().find((t) => t.orderId === fill.orderId.toString())
)

View File

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32">
<g fill="none" fill-rule="evenodd">
<circle cx="16" cy="16" r="16" fill="#F7931A"/>
<path fill="#FFF" fill-rule="nonzero" d="M23.189 14.02c.314-2.096-1.283-3.223-3.465-3.975l.708-2.84-1.728-.43-.69 2.765c-.454-.114-.92-.22-1.385-.326l.695-2.783L15.596 6l-.708 2.839c-.376-.086-.746-.17-1.104-.26l.002-.009-2.384-.595-.46 1.846s1.283.294 1.256.312c.7.175.826.638.805 1.006l-.806 3.235c.048.012.11.03.18.057l-.183-.045-1.13 4.532c-.086.212-.303.531-.793.41.018.025-1.256-.313-1.256-.313l-.858 1.978 2.25.561c.418.105.828.215 1.231.318l-.715 2.872 1.727.43.708-2.84c.472.127.93.245 1.378.357l-.706 2.828 1.728.43.715-2.866c2.948.558 5.164.333 6.097-2.333.752-2.146-.037-3.385-1.588-4.192 1.13-.26 1.98-1.003 2.207-2.538zm-3.95 5.538c-.533 2.147-4.148.986-5.32.695l.95-3.805c1.172.293 4.929.872 4.37 3.11zm.535-5.569c-.487 1.953-3.495.96-4.47.717l.86-3.45c.975.243 4.118.696 3.61 2.733z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 973 B