Merge branch 'main' into boost-branding

This commit is contained in:
tlrsssss 2023-09-25 10:53:16 -04:00 committed by GitHub
commit c100881066
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 34 additions and 22 deletions

View File

@ -14,6 +14,13 @@ import FormatNumericValue from './shared/FormatNumericValue'
const set = mangoStore.getState().set
const BORROW_TOKEN = 'SOL'
const getLeverage = (stakeBalance: number, borrowBalance: number) => {
if (stakeBalance === 0) return 0
return borrowBalance / stakeBalance
}
const Positions = ({
setActiveTab,
}: {
@ -25,6 +32,10 @@ const Positions = ({
useLocalStorageState(SHOW_INACTIVE_POSITIONS_KEY, true)
const { stakeAccounts } = useStakeAccounts()
const borrowBank = useMemo(() => {
return group?.banksMapByMint.get(BORROW_TOKEN)?.[0]
}, [group])
const banks = useMemo(() => {
if (!group) return []
const positionBanks = []
@ -37,25 +48,26 @@ const Positions = ({
const positions = useMemo(() => {
const positions = []
if (banks.length) {
for (const bank of banks) {
if (!bank) continue
const acct = stakeAccounts?.find(
(acc) => acc.getTokenBalanceUi(bank) > 0,
)
const balance = acct ? acct.getTokenBalanceUi(bank) : 0
positions.push({ balance, bank })
}
for (const bank of banks) {
if (!bank) continue
const acct = stakeAccounts?.find((acc) => acc.getTokenBalanceUi(bank) > 0)
const stakeBalance = acct ? acct.getTokenBalanceUi(bank) : 0
const borrowBalance =
acct && borrowBank ? acct.getTokenBalanceUi(borrowBank) : 0
positions.push({ borrowBalance, stakeBalance, bank })
}
const sortedPositions = positions.sort((a, b) => b.balance - a.balance)
const sortedPositions = positions.sort(
(a, b) => b.stakeBalance - a.stakeBalance,
)
return showInactivePositions
? sortedPositions
: sortedPositions.filter((pos) => pos.balance > 0)
: sortedPositions.filter((pos) => pos.stakeBalance > 0)
}, [banks, showInactivePositions, stakeAccounts])
const numberOfPositions = useMemo(() => {
if (!positions.length) return 0
return positions.filter((pos) => pos.balance > 0).length
return positions.filter((pos) => pos.stakeBalance > 0).length
}, [positions])
const handleAddOrManagePosition = (token: string) => {
@ -81,11 +93,11 @@ const Positions = ({
<div className="grid grid-cols-1 gap-2">
{positions.length ? (
positions.map((position, i) => {
const { balance, bank } = position
const {stakeBalance, borrowBalance, bank } = position
return bank ? (
<div
className="rounded-2xl border-2 border-th-fgd-1 bg-th-bkg-1 p-6"
key={i + balance}
key={i + stakeBalance}
>
<div className="mb-4 flex flex-col border-b border-th-bkg-3 pb-4 md:flex-row md:items-center md:justify-between">
<div className="mb-4 flex items-center space-x-3 md:mb-0">
@ -98,16 +110,16 @@ const Positions = ({
<h3>{formatTokenSymbol(bank.name)}</h3>
<span
className={`text-sm ${
balance ? 'text-th-fgd-1' : 'text-th-fgd-4'
stakeBalance ? 'text-th-fgd-1' : 'text-th-fgd-4'
}`}
>
{balance ? 'Opened 2 weeks ago' : 'No Position'}
{stakeBalance ? 'Opened 2 weeks ago' : 'No Position'}
</span>
</div>
</div>
<Button onClick={() => handleAddOrManagePosition(bank.name)}>
<span className="mt-1 text-base tracking-wider">
{balance ? 'Manage' : 'Add Position'}
{stakeBalance ? 'Manage' : 'Add Position'}
</span>
</Button>
</div>
@ -115,7 +127,7 @@ const Positions = ({
<div>
<p className="mb-1 text-th-fgd-4">Position Size</p>
<span className="text-xl font-bold text-th-fgd-1">
<FormatNumericValue value={balance} decimals={6} />{' '}
<FormatNumericValue value={stakeBalance} decimals={6} />{' '}
{formatTokenSymbol(bank.name)}
</span>
</div>
@ -136,20 +148,20 @@ const Positions = ({
<div>
<p className="mb-1 text-th-fgd-4">Leverage</p>
<span className="text-xl font-bold text-th-fgd-1">
{balance ? '3x' : '0x'}
{getLeverage(stakeBalance, borrowBalance)}x
</span>
</div>
<div>
<p className="mb-1 text-th-fgd-4">Earned</p>
<span className="text-xl font-bold text-th-fgd-1">
{balance ? '3.321 SOL' : '0 SOL'}
{balance ? `X.XX ${formatTokenSymbol(bank.name)}` : `0 ${formatTokenSymbol(bank.name)}`}
</span>
</div>
<div>
<p className="mb-1 text-th-fgd-4">Liquidation Price</p>
<span className="whitespace-nowrap text-xl font-bold text-th-fgd-1">
{balance ? '1.234' : '0'}{' '}
{`${formatTokenSymbol(bank.name)}/SOL`}
{stakeBalance ? 'X.XX' : '0'}{' '}
{`${formatTokenSymbol(bank.name)}/${BORROW_TOKEN}`}
</span>
</div>
</div>