From eb3d915916185a226f5bc536ffdea6b63867c596 Mon Sep 17 00:00:00 2001 From: tjs Date: Sun, 20 Nov 2022 21:29:51 -0500 Subject: [PATCH] wip: add unsettled perp --- components/account/AccountTabs.tsx | 10 ++++- components/swap/SwapInfoTabs.tsx | 8 +++- components/trade/AdvancedTradeForm.tsx | 2 +- components/trade/Orderbook.tsx | 1 - components/trade/PerpPositions.tsx | 12 ++++-- components/trade/RecentTrades.tsx | 2 +- components/trade/TradeInfoTabs.tsx | 17 +++++++-- components/trade/UnsettledTrades.tsx | 51 ++++++++++++++++++++++++-- hooks/useUnsettledSpotBalances.ts | 6 ++- public/locales/en/trade.json | 4 +- 10 files changed, 95 insertions(+), 18 deletions(-) diff --git a/components/account/AccountTabs.tsx b/components/account/AccountTabs.tsx index 61ffa026..6fcb6ad6 100644 --- a/components/account/AccountTabs.tsx +++ b/components/account/AccountTabs.tsx @@ -47,6 +47,7 @@ const TabContent = ({ activeTab }: { activeTab: string }) => { const swapHistory = mangoStore((s) => s.mangoAccount.stats.swapHistory.data) const loading = mangoStore((s) => s.mangoAccount.stats.swapHistory.loading) const unsettledSpotBalances = useUnsettledSpotBalances() + const perpPositions = mangoStore((s) => s.mangoAccount.perpPositions) switch (activeTab) { case 'balances': return @@ -55,7 +56,14 @@ const TabContent = ({ activeTab }: { activeTab: string }) => { case 'swap:swap-history': return case 'trade:unsettled': - return + return ( + !p.basePositionLots.toNumber() + )} + /> + ) default: return } diff --git a/components/swap/SwapInfoTabs.tsx b/components/swap/SwapInfoTabs.tsx index 8bf7c71e..fc9b2835 100644 --- a/components/swap/SwapInfoTabs.tsx +++ b/components/swap/SwapInfoTabs.tsx @@ -14,6 +14,7 @@ const SwapInfoTabs = () => { const swapHistory = mangoStore((s) => s.mangoAccount.stats.swapHistory.data) const loading = mangoStore((s) => s.mangoAccount.stats.swapHistory.loading) const unsettledSpotBalances = useUnsettledSpotBalances() + const perpPositions = mangoStore((s) => s.mangoAccount.perpPositions) const tabsWithCount: [string, number][] = useMemo(() => { return [ @@ -38,7 +39,12 @@ const SwapInfoTabs = () => { ) : null} {selectedTab === 'trade:unsettled' ? ( - + !p.basePositionLots.toNumber() + )} + /> ) : null} ) diff --git a/components/trade/AdvancedTradeForm.tsx b/components/trade/AdvancedTradeForm.tsx index e3144062..8a832c57 100644 --- a/components/trade/AdvancedTradeForm.tsx +++ b/components/trade/AdvancedTradeForm.tsx @@ -254,7 +254,7 @@ const AdvancedTradeForm = () => { selectedMarket.perpMarketIndex, tradeForm.side === 'buy' ? PerpOrderSide.bid : PerpOrderSide.ask, price, - baseSize, + Math.abs(baseSize), undefined, // maxQuoteQuantity Date.now(), perpOrderType, diff --git a/components/trade/Orderbook.tsx b/components/trade/Orderbook.tsx index 3cd5594c..f0391e9a 100644 --- a/components/trade/Orderbook.tsx +++ b/components/trade/Orderbook.tsx @@ -594,7 +594,6 @@ const OrderbookRow = ({ tickSize: number }) => { const element = useRef(null) - // const set = mangoStore.getState().set const [showOrderbookFlash] = useLocalStorageState(ORDERBOOK_FLASH_KEY, true) const flashClassName = side === 'sell' ? 'red-flash' : 'green-flash' diff --git a/components/trade/PerpPositions.tsx b/components/trade/PerpPositions.tsx index 6939353d..8b4aa4c5 100644 --- a/components/trade/PerpPositions.tsx +++ b/components/trade/PerpPositions.tsx @@ -40,7 +40,11 @@ const PerpPositions = () => { if (!group) return null - return Object.entries(perpPositions).length ? ( + const openPerpPositions = Object.values(perpPositions).filter((p) => + p.basePositionLots.toNumber() + ) + + return openPerpPositions.length ? (
@@ -53,7 +57,7 @@ const PerpPositions = () => { - {Object.entries(perpPositions).map(([_mkt, position]) => { + {openPerpPositions.map((position) => { const market = group.getPerpMarketByMarketIndex( position.marketIndex ) @@ -62,6 +66,8 @@ const PerpPositions = () => { selectedMarket instanceof PerpMarket && selectedMarket.perpMarketIndex === position.marketIndex + if (!basePosition) return null + return ( ) diff --git a/components/trade/RecentTrades.tsx b/components/trade/RecentTrades.tsx index 81e7641b..c09aad99 100644 --- a/components/trade/RecentTrades.tsx +++ b/components/trade/RecentTrades.tsx @@ -64,7 +64,7 @@ const RecentTrades = () => { if (CLUSTER === 'mainnet-beta') { fetchTradesForChart() } - }, 5000) + }, 50000) return (
@@ -92,7 +98,7 @@ const PerpPositions = () => { -
{position.quoteEntryNative.toNumber()}
+
{position.quoteEntryNative.toString()}
diff --git a/components/trade/TradeInfoTabs.tsx b/components/trade/TradeInfoTabs.tsx index 6e48854c..618cc07e 100644 --- a/components/trade/TradeInfoTabs.tsx +++ b/components/trade/TradeInfoTabs.tsx @@ -18,11 +18,17 @@ const TradeInfoTabs = () => { const isMobile = width ? width < breakpoints.lg : false const tabsWithCount: [string, number][] = useMemo(() => { + const unsettledTradeCount = + Object.values(unsettledSpotBalances).flat().length + + perpPositions.filter((p) => !p.basePositionLots.toNumber())?.length return [ ['balances', 0], ['trade:orders', Object.values(openOrders).flat().length], - ['trade:unsettled', Object.values(unsettledSpotBalances).flat().length], - ['Positions', perpPositions.length], + ['trade:unsettled', unsettledTradeCount], + [ + 'Positions', + perpPositions.filter((p) => p.basePositionLots.toNumber())?.length, + ], ] }, [openOrders, perpPositions, unsettledSpotBalances]) @@ -40,7 +46,12 @@ const TradeInfoTabs = () => { {selectedTab === 'balances' ? : null} {selectedTab === 'trade:orders' ? : null} {selectedTab === 'trade:unsettled' ? ( - + !p.basePositionLots.toNumber() + )} + /> ) : null} {selectedTab === 'Positions' ? : null} diff --git a/components/trade/UnsettledTrades.tsx b/components/trade/UnsettledTrades.tsx index a3e4a298..f22dd09e 100644 --- a/components/trade/UnsettledTrades.tsx +++ b/components/trade/UnsettledTrades.tsx @@ -13,11 +13,14 @@ import MarketLogos from './MarketLogos' import useMangoAccount from 'hooks/useMangoAccount' import { Table, Td, Th, TrBody, TrHead } from '@components/shared/TableElements' import useMangoGroup from 'hooks/useMangoGroup' +import { PerpPosition } from '@blockworks-foundation/mango-v4' const UnsettledTrades = ({ unsettledSpotBalances, + unsettledPerpPositions, }: { unsettledSpotBalances: any + unsettledPerpPositions: PerpPosition[] }) => { const { t } = useTranslation(['common', 'trade']) const { mangoAccount } = useMangoAccount() @@ -62,8 +65,11 @@ const UnsettledTrades = ({ if (!group) return null + console.log('unsettledPerpPositions', unsettledPerpPositions) + return mangoAccount ? ( - Object.values(unsettledSpotBalances).flat().length ? ( + Object.values(unsettledSpotBalances).flat().concat(unsettledPerpPositions) + .length ? ( showTableView ? (
@@ -86,7 +92,7 @@ const UnsettledTrades = ({ @@ -121,6 +127,45 @@ const UnsettledTrades = ({ ) })} + {unsettledPerpPositions.map((position) => { + const market = group.getPerpMarketByMarketIndex( + position.marketIndex + ) + return ( + + + + + + + ) + })}
- + {market ? market.name : ''}
+
+ + {market ? market.name : ''} +
+
+ + + {position.getUnsettledFunding(market).toNumber()} + +
+ + + handleSettleFunds(market.publicKey.toString()) + } + size="small" + > + {settleMktAddress === market.publicKey.toString() ? ( + + ) : ( + + )} + + +
+
) : ( @@ -138,7 +183,7 @@ const UnsettledTrades = ({ className="flex items-center justify-between border-b border-th-bkg-3 p-4" >
- + {market ? market.name : ''}
diff --git a/hooks/useUnsettledSpotBalances.ts b/hooks/useUnsettledSpotBalances.ts index 6702650a..0175380a 100644 --- a/hooks/useUnsettledSpotBalances.ts +++ b/hooks/useUnsettledSpotBalances.ts @@ -1,13 +1,15 @@ import { toUiDecimals } from '@blockworks-foundation/mango-v4' import mangoStore from '@store/mangoStore' import { useMemo } from 'react' +import useMangoAccount from './useMangoAccount' import useMangoGroup from './useMangoGroup' export function useUnsettledSpotBalances() { - const mangoAccount = mangoStore((s) => s.mangoAccount.current) + const { group } = useMangoGroup() + const { mangoAccount } = useMangoAccount() const openOrdersAccounts = mangoStore.getState().mangoAccount.openOrderAccounts - const { group } = useMangoGroup() + const unsettledSpotBalances = useMemo(() => { if (!group || !mangoAccount || !openOrdersAccounts) return {} const unsettledBalances: Record = diff --git a/public/locales/en/trade.json b/public/locales/en/trade.json index 1be12422..8636766e 100644 --- a/public/locales/en/trade.json +++ b/public/locales/en/trade.json @@ -1,6 +1,6 @@ { "amount": "Amount", - "base": "Base Token", + "base": "Base", "book": "Book", "cancel-order-error": "Failed to cancel order", "connect-orders": "Connect to view your open orders", @@ -21,7 +21,7 @@ "post": "Post", "place-order": "Place {{side}} Order", "placing-order": "Placing Order", - "quote": "Quote Token", + "quote": "Quote", "settle-funds": "Settle Funds", "settle-funds-error": "Failed to settle funds", "show-asks": "Show Asks",