MP-3391: make sure locked and unlocking is taken into account (#477)

* MP-3391: make sure locked and unlocking is taken into account

* fix: accounts was missing unlocked and locked value

* fix: fixed small layout bug

* fix: rebuild the addValueToVaults function

* tidy: refactor

* fix: unwrapped BN on BigNumber values from

* fix: removed the refreshInterval from accounts

src/api/vaults/getDepositedVaults.ts

@@ -76,10 +76,7 @@ async function getLpTokensForVaultPosition(
     const vaultQueryClient = await getVaultQueryClient(vault.address)
     const creditManagerQueryClient = await getCreditManagerQueryClient()
     const amounts = flatVaultPositionAmount(vaultPosition.amount)
-    const totalAmount = BN(amounts.locked)
+    const totalAmount = amounts.locked.plus(amounts.unlocked).plus(amounts.unlocking).toString()
-      .plus(BN(amounts.unlocked))
-      .plus(BN(amounts.unlocking))
-      .toString()
 
     const lpAmount = await vaultQueryClient.previewRedeem({
       amount: totalAmount,
@@ -115,15 +112,14 @@ async function getVaultValuesAndAmounts(
     const pricesQueries = Promise.all([
       getPrice(vault.denoms.primary),
       getPrice(vault.denoms.secondary),
+      getPrice(vault.denoms.lp),
     ])
 
     const lpTokensQuery = getLpTokensForVaultPosition(vault, vaultPosition)
     const amounts = flatVaultPositionAmount(vaultPosition.amount)
 
-    const [[primaryLpToken, secondaryLpToken], [primaryPrice, secondaryPrice]] = await Promise.all([
+    const [[primaryLpToken, secondaryLpToken], [primaryPrice, secondaryPrice, lpPrice]] =
-      lpTokensQuery,
+      await Promise.all([lpTokensQuery, pricesQueries])
-      pricesQueries,
-    ])
 
     return {
       amounts: {
@@ -138,6 +134,12 @@ async function getVaultValuesAndAmounts(
         secondary: getCoinValue(new BNCoin(secondaryLpToken), [
           BNCoin.fromDenomAndBigNumber(secondaryLpToken.denom, secondaryPrice),
         ]),
+        unlocking: getCoinValue(BNCoin.fromDenomAndBigNumber(vault.denoms.lp, amounts.unlocking), [
+          BNCoin.fromDenomAndBigNumber(vault.denoms.lp, lpPrice),
+        ]),
+        unlocked: getCoinValue(BNCoin.fromDenomAndBigNumber(vault.denoms.lp, amounts.unlocked), [
+          BNCoin.fromDenomAndBigNumber(vault.denoms.lp, lpPrice),
+        ]),
       },
     }
   } catch (ex) {

src/components/Account/AccountBalancesTable/functions.ts

@@ -32,10 +32,18 @@ export function getVaultAccountBalanceRow(
 ): AccountBalanceRow {
   const { name } = vault
   const previous = prev || vault
-  const totalValue = vault.values.primary.plus(vault.values.secondary)
+  const totalLockedValue = vault.values.primary.plus(vault.values.secondary)
-  const prevTotalValue = previous.values.primary.plus(previous.values.secondary)
+  const totalValue = totalLockedValue.plus(vault.values.unlocked).plus(vault.values.unlocking)
+  const prevTotalValue = previous.values.primary
+    .plus(previous.values.secondary)
+    .plus(previous.values.unlocked)
+    .plus(previous.values.unlocking)
   const amountChange = !prev ? totalValue : totalValue.minus(prevTotalValue)
 
+  if (totalLockedValue.isLessThan(totalValue)) {
+    apy = totalLockedValue.dividedBy(totalValue).times(apy).toNumber()
+  }
+
   return {
     type: 'vault',
     symbol: name,

src/components/Earn/Farm/VaultTable.tsx

@@ -105,7 +105,10 @@ export const VaultTable = (props: Props) => {
               header: 'Pos. Value',
               cell: ({ row }: { row: Row<DepositedVault | Vault> }) => {
                 const vault = row.original as DepositedVault
-                const positionValue = vault.values.primary.plus(vault.values.secondary)
+                const positionValue = vault.values.primary
+                  .plus(vault.values.secondary)
+                  .plus(vault.values.unlocking)
+                  .plus(vault.values.unlocked)
                 const coin = BNCoin.fromDenomAndBigNumber(ORACLE_DENOM, positionValue)
                 return <DisplayCurrency coin={coin} className='text-xs' />
               },

src/components/Modals/Vault/VaultModalContentHeader.tsx

@@ -17,6 +17,8 @@ export default function VaultModalContentHeader({ vault }: Props) {
     if ('values' in vault) {
       const value = vault.values.primary
         .plus(vault.values.secondary)
+        .plus(vault.values.unlocked)
+        .plus(vault.values.unlocking)
         .shiftedBy(-PRICE_ORACLE_DECIMALS)
 
       // To eliminate super small leftover amounts

src/constants/vaults.ts

@@ -134,6 +134,8 @@ export const MOCK_DEPOSITED_VAULT_POSITION = {
   values: {
     primary: BN_ZERO,
     secondary: BN_ZERO,
+    unlocked: BN_ZERO,
+    unlocking: BN_ZERO,
   },
   amounts: {
     primary: BN_ZERO,

src/hooks/useAccount.tsx

@@ -4,7 +4,7 @@ import getAccount from 'api/accounts/getAccount'
 
 export default function useAccounts(accountId?: string) {
   return useSWR(`account${accountId}`, () => getAccount(accountId || ''), {
-    refreshInterval: 30_000,
+    suspense: true,
     revalidateOnFocus: false,
   })
 }

src/hooks/useHealthComputer.tsx

@@ -57,6 +57,8 @@ export default function useHealthComputer(account?: Account) {
             denom: curr.denoms.vault,
             value: curr.values.primary
               .plus(curr.values.secondary)
+              .plus(curr.values.unlocking)
+              .plus(curr.values.unlocked)
               .shiftedBy(VALUE_SCALE_FACTOR + 6) // Need to scale additional 6 to correct for uusd values
               .integerValue()
               .toString(),

src/hooks/useUpdatedAccount/functions.ts

@@ -43,7 +43,6 @@ export function addValueToVaults(
   availableVaults: Vault[],
 ): DepositedVault[] {
   const currentVaultAddresses = vaults.map((vault) => vault.address)
-
   vaultValues.forEach((vaultValue) => {
     if (vaultValue.value.isZero()) return
     const halfValue = vaultValue.value.div(2)
@@ -65,6 +64,8 @@ export function addValueToVaults(
         values: {
           primary: halfValue,
           secondary: halfValue,
+          unlocked: BN_ZERO,
+          unlocking: BN_ZERO,
         },
       })
     }

src/hooks/useUpdatedAccount/index.ts

@@ -199,6 +199,7 @@ export function useUpdatedAccount(account?: Account) {
     addedLends,
     removedLends,
     availableVaults,
+    prices,
   ])
 
   return {

src/pages/_layout.tsx

@@ -58,7 +58,7 @@ export default function Layout({ children }: { children: React.ReactNode }) {
           'min-h-screen gap-6 px-4 py-6 w-full relative',
           'flex',
           isFullWidth && account && (accountDetailsExpanded ? 'pr-110.5' : 'pr-24'),
-          !reduceMotion && 'transition-all duration-300',
+          !reduceMotion && isFullWidth && 'transition-all duration-300',
           'justify-center',
           focusComponent && 'items-center',
           isMobile && 'items-start',

src/types/interfaces/vaults.d.ts

@@ -47,6 +47,8 @@ interface VaultValuesAndAmounts {
   values: {
     primary: BigNumber
     secondary: BigNumber
+    unlocked: BigNumber
+    unlocking: BigNumber
   }
 }
 

src/utils/accounts.ts

@@ -40,11 +40,13 @@ export const calculateAccountValue = (
 
   if (type === 'vaults') {
     return (
-      account.vaults?.reduce(
+      account.vaults?.reduce((acc, vaultPosition) => {
-        (acc, vaultPosition) =>
+        return acc
-          acc.plus(vaultPosition.values.primary).plus(vaultPosition.values.secondary),
+          .plus(vaultPosition.values.primary)
-        BN_ZERO,
+          .plus(vaultPosition.values.secondary)
-      ) || BN_ZERO
+          .plus(vaultPosition.values.unlocking)
+          .plus(vaultPosition.values.unlocked)
+      }, BN_ZERO) || BN_ZERO
     )
   }
 
@@ -85,8 +87,8 @@ export const calculateAccountApr = (
   })
 
   vaults?.forEach((vault) => {
-    const vaultValue = vault.values.primary.plus(vault.values.secondary)
+    const lockedValue = vault.values.primary.plus(vault.values.secondary)
-    const positionInterest = vaultValue.multipliedBy(convertApyToApr(vault?.apy ?? 0, 365))
+    const positionInterest = lockedValue.multipliedBy(convertApyToApr(vault?.apy ?? 0, 365))
     totalVaultsInterestValue = totalVaultsInterestValue.plus(positionInterest)
   })
 
@@ -108,13 +110,6 @@ export const calculateAccountApr = (
   return totalInterstValue.dividedBy(totalValue).times(100)
 }
 
-export const calculateAccountBorrowRate = (
-  account: Account | AccountChange,
-  prices: BNCoin[],
-): BigNumber => {
-  return BN_ZERO
-}
-
 export function calculateAccountLeverage(account: Account, prices: BNCoin[]) {
   const [deposits, lends, debts, vaults] = getAccountPositionValues(account, prices)
   const netValue = deposits.plus(lends).plus(vaults).minus(debts)
@@ -186,15 +181,17 @@ export function cloneAccount(account: Account): Account {
     vaults: account.vaults.map((vault) => ({
       ...vault,
       amounts: {
-        locked: BN(vault.amounts.locked),
+        locked: vault.amounts.locked,
-        unlocking: BN(vault.amounts.unlocking),
+        unlocking: vault.amounts.unlocking,
-        unlocked: BN(vault.amounts.unlocked),
+        unlocked: vault.amounts.unlocked,
-        primary: BN(vault.amounts.primary),
+        primary: vault.amounts.primary,
-        secondary: BN(vault.amounts.secondary),
+        secondary: vault.amounts.secondary,
       },
       values: {
-        primary: BN(vault.values.primary),
+        primary: vault.values.primary,
-        secondary: BN(vault.values.secondary),
+        secondary: vault.values.secondary,
+        unlocking: vault.values.unlocking,
+        unlocked: vault.values.unlocked,
       },
     })),
   }