diff --git a/components/account/AccountTabs.tsx b/components/account/AccountTabs.tsx index 8c27439c..6d9c8ffe 100644 --- a/components/account/AccountTabs.tsx +++ b/components/account/AccountTabs.tsx @@ -12,29 +12,61 @@ import useOpenPerpPositions from 'hooks/useOpenPerpPositions' import OpenOrders from '@components/trade/OpenOrders' import HistoryTabs from './HistoryTabs' import ManualRefresh from '@components/shared/ManualRefresh' +import useMangoAccount from 'hooks/useMangoAccount' +import { useIsWhiteListed } from 'hooks/useIsWhiteListed' +import SwapOrders from '@components/swap/SwapOrders' const AccountTabs = () => { const [activeTab, setActiveTab] = useState('balances') + const { mangoAccount } = useMangoAccount() const { width } = useViewport() const unsettledSpotBalances = useUnsettledSpotBalances() const unsettledPerpPositions = useUnsettledPerpPositions() const openPerpPositions = useOpenPerpPositions() const openOrders = mangoStore((s) => s.mangoAccount.openOrders) const isMobile = width ? width < breakpoints.lg : false + const { data: isWhiteListed } = useIsWhiteListed() + + // const tabsWithCount: [string, number][] = useMemo(() => { + // let tabs: [string, number][] = [ + // ['balances', 0], + // ['swap:swap-history', 0], + // ] + // if (isWhiteListed) { + // const stopOrdersCount = + // mangoAccount?.tokenConditionalSwaps.filter((tcs) => tcs.hasData) + // ?.length || 0 + // tabs = [ + // ['balances', 0], + // ['trade:trigger-orders', stopOrdersCount], + // ['swap:swap-history', 0], + // ] + // } + // return tabs + // }, [isWhiteListed, mangoAccount]) const tabsWithCount: [string, number][] = useMemo(() => { const unsettledTradeCount = Object.values(unsettledSpotBalances).flat().length + unsettledPerpPositions?.length - return [ + const tabs: [string, number][] = [ ['balances', 0], ['trade:positions', openPerpPositions.length], ['trade:orders', Object.values(openOrders).flat().length], ['trade:unsettled', unsettledTradeCount], ['history', 0], ] + if (isWhiteListed) { + const stopOrdersCount = + mangoAccount?.tokenConditionalSwaps.filter((tcs) => tcs.hasData) + ?.length || 0 + tabs.splice(3, 0, ['trade:trigger-orders', stopOrdersCount]) + } + return tabs }, [ + isWhiteListed, + mangoAccount, openPerpPositions, unsettledPerpPositions, unsettledSpotBalances, @@ -72,6 +104,8 @@ const TabContent = ({ activeTab }: { activeTab: string }) => { return case 'trade:orders': return + case 'trade:trigger-orders': + return case 'trade:unsettled': return ( { const isMobile = width ? width < breakpoints.lg : false const tabsWithCount: [string, number][] = useMemo(() => { - let tabs: [string, number][] = [ + const tabs: [string, number][] = [ ['balances', 0], ['swap:swap-history', 0], ] @@ -25,11 +25,7 @@ const SwapInfoTabs = () => { const stopOrdersCount = mangoAccount?.tokenConditionalSwaps.filter((tcs) => tcs.hasData) ?.length || 0 - tabs = [ - ['balances', 0], - ['trade:trigger-orders', stopOrdersCount], - ['swap:swap-history', 0], - ] + tabs.splice(1, 0, ['trade:trigger-orders', stopOrdersCount]) } return tabs }, [isWhiteListed, mangoAccount])