import { useTranslation } from 'next-i18next' import useMangoStore from '../stores/useMangoStore' import useMangoAccount from '../hooks/useMangoAccount' import { I80F48, nativeI80F48ToUi, QUOTE_INDEX, ZERO_I80F48, } from '@blockworks-foundation/mango-client' import { abbreviateAddress, formatUsdValue, usdFormatter } from 'utils' import { DataLoader } from './MarketPosition' const AccountOverviewPopover = ({ collapsed, health, }: { collapsed: boolean health: I80F48 }) => { const { t } = useTranslation('common') const mangoGroup = useMangoStore((s) => s.selectedMangoGroup.current) const mangoCache = useMangoStore((s) => s.selectedMangoGroup.cache) const { mangoAccount, initialLoad } = useMangoAccount() const marketConfig = useMangoStore((s) => s.selectedMarket.config) const I80F48_100 = I80F48.fromString('100') const initHealth = mangoAccount && mangoGroup && mangoCache ? mangoAccount.getHealth(mangoGroup, mangoCache, 'Init') : I80F48_100 const equity = mangoAccount && mangoGroup && mangoCache ? mangoAccount.computeValue(mangoGroup, mangoCache) : ZERO_I80F48 return ( <> {mangoAccount ? (
{collapsed ? (

{t('account')}

{abbreviateAddress(mangoAccount.publicKey)}

) : null}

{t('value')}

{initialLoad ? : formatUsdValue(+equity)}

{t('health')}

{health.gt(I80F48_100) ? '>100' : health.toFixed(2)}%

{t('leverage')}

{initialLoad ? ( ) : mangoAccount && mangoGroup && mangoCache ? ( `${mangoAccount .getLeverage(mangoGroup, mangoCache) .toFixed(2)}x` ) : ( '0.00x' )}

{t('collateral-available')}

{initialLoad ? ( ) : mangoAccount && mangoGroup ? ( usdFormatter( nativeI80F48ToUi( initHealth, mangoGroup.tokens[QUOTE_INDEX].decimals ).toFixed() ) ) : ( '--' )}

{marketConfig.name} {t('margin-available')}

{mangoAccount && mangoGroup && mangoCache ? usdFormatter( nativeI80F48ToUi( mangoAccount.getMarketMarginAvailable( mangoGroup, mangoCache, marketConfig.marketIndex, marketConfig.kind ), mangoGroup.tokens[QUOTE_INDEX].decimals ).toFixed() ) : '0.00'}

) : null} ) } export default AccountOverviewPopover