Fixes bob (#443)

* 🐛 Trading chart title

* 🐛 Trading chart title

* 🐛 fix incorrect vault deposit amounts

* 🐛 fix incorrect vault borrow calc

* 🧽 run format

* 🧽 fix comments

* 🧽 update code owners

.github/CODEOWNERS

@@ -1 +1 @@
-* @bobthebuidlr @linkielink @yusufseyrek
+* @bobthebuidlr @linkielink

src/api/accounts/getAccount.ts

@@ -1,7 +1,7 @@
 import { getCreditManagerQueryClient } from 'api/cosmwasm-client'
 import getDepositedVaults from 'api/vaults/getDepositedVaults'
-import { Positions } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import { BNCoin } from 'types/classes/BNCoin'
+import { Positions } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 
 export default async function getAccount(accountId: string): Promise<Account> {
   const creditManagerQueryClient = await getCreditManagerQueryClient()

src/components/Account/AccountBalancesTable/useAccountBalanceData.tsx

@@ -34,9 +34,7 @@ export default function useAccountBalanceData(props: Props) {
       const asset = ASSETS.find(byDenom(deposit.denom))
       if (!asset) return
       const apy = 0
-      const prevDeposit = updatedAccount
-        ? account?.deposits.find(byDenom(deposit.denom))
-        : deposit
+      const prevDeposit = updatedAccount ? account?.deposits.find(byDenom(deposit.denom)) : deposit
       deposits.push(getAssetAccountBalanceRow('deposits', asset, prices, deposit, apy, prevDeposit))
     })
 

src/components/Account/AccountCreateFirst.tsx

@@ -51,4 +51,4 @@ export default function AccountCreateFirst() {
       docs='account'
     />
   )
-}
+}

src/components/Account/AccountFund/AccountFundContent.tsx

@@ -202,4 +202,4 @@ export default function AccountFundContent(props: Props) {
       />
     </>
   )
-}
+}

src/components/Account/AccountFund/AccountFundFullPage.tsx

@@ -39,4 +39,4 @@ export default function AccountFundFullPage() {
       </Card>
     </FullOverlayContent>
   )
-}
+}

src/components/Account/AccountList.tsx

@@ -143,4 +143,4 @@ export default function AccountList(props: Props) {
       })}
     </div>
   )
-}
+}

src/components/Account/AccountMenuContent.tsx

@@ -164,4 +164,4 @@ export default function AccountMenuContent(props: Props) {
   )
 }
 
-export { ACCOUNT_MENU_BUTTON_ID }
+export { ACCOUNT_MENU_BUTTON_ID }

src/components/Modals/Account/AccountDeleteAlertDialog.tsx

@@ -33,4 +33,4 @@ export default function AccoundDeleteAlertDialog(props: Props) {
   }, [showAlertDialog, title, description, closeHandler, positiveButton])
 
   return null
-}
+}

src/components/Modals/Account/AccountDeleteModal.tsx

@@ -129,4 +129,4 @@ function AccountDeleteModal(props: Props) {
       }}
     />
   )
-}
+}

src/components/Modals/AlertDialog/index.tsx

@@ -34,7 +34,7 @@ function AlertDialog(props: Props) {
   async function handleAsyncButtonClick(button?: AlertDialogButton) {
     if (!button?.onClick) return
     setIsConfirming(true)
-    button.onClick()
+    await button.onClick()
     setIsConfirming(false)
     props.close()
   }
@@ -83,4 +83,4 @@ function AlertDialog(props: Props) {
       </div>
     </Modal>
   )
-}
+}

src/components/Modals/Vault/VaultModalContent.tsx

@@ -182,4 +182,4 @@ export default function VaultModalContent(props: Props) {
       <AccountSummary account={props.account} />
     </div>
   )
-}
+}

src/components/PageMetadata.tsx

@@ -26,4 +26,4 @@ function PageMetadata() {
   )
 }
 
-export default PageMetadata
+export default PageMetadata

src/components/Trade/TradeChart/OsmosisTheGraphDataFeed.ts

@@ -1,4 +1,5 @@
 import { defaultSymbolInfo } from 'components/Trade/TradeChart/constants'
+import { ASSETS } from 'constants/assets'
 import { ENV } from 'constants/env'
 import { getAssetByDenom, getEnabledMarketAssets } from 'utils/assets'
 import {
@@ -69,6 +70,14 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
     this.pairs = Array.from(pairs)
   }
 
+  getDescription(pairName: string) {
+    const denom1 = pairName.split(PAIR_SEPARATOR)[0]
+    const denom2 = pairName.split(PAIR_SEPARATOR)[1]
+    const asset1 = ASSETS.find((asset) => asset.mainnetDenom === denom1)
+    const asset2 = ASSETS.find((asset) => asset.mainnetDenom === denom2)
+    return `${asset1?.symbol}/${asset2?.symbol}`
+  }
+
   async getPairsWithData() {
     const query = `
       {
@@ -120,10 +129,10 @@ export class OsmosisTheGraphDataFeed implements IDatafeedChartApi {
     setTimeout(() =>
       onResolve({
         ...defaultSymbolInfo,
-        name: pairName.split(PAIR_SEPARATOR)[0],
+        name: this.getDescription(pairName),
         full_name: pairName,
-        description: pairName,
-        ticker: pairName,
+        description: this.getDescription(pairName),
+        ticker: this.getDescription(pairName),
         exchange: this.exchangeName,
         listed_exchange: this.exchangeName,
         supported_resolutions: this.supportedResolutions,

src/components/Trade/TradeChart/constants.ts

@@ -1,6 +1,5 @@
 import {
   ChartingLibraryFeatureset,
-  LibrarySymbolInfo,
   ResolutionString,
   SeriesFormat,
   Timezone,

src/hooks/broadcast/useDepositVault.ts

@@ -52,10 +52,10 @@ export default function useDepositVault(props: Props): {
   )
 
   const reclaimActions: Action[] = useMemo(() => {
-    return props.reclaims.map((bnCoin) => ({
+    return reclaims.map((bnCoin) => ({
       reclaim: bnCoin.toActionCoin(),
     }))
-  }, [props.reclaims])
+  }, [reclaims])
 
   const borrowActions: Action[] = useMemo(() => {
     return borrowings.map((bnCoin) => ({

src/hooks/useHealthComputer.tsx

@@ -4,7 +4,6 @@ import { BN_ZERO } from 'constants/math'
 import useAssetParams from 'hooks/useAssetParams'
 import usePrices from 'hooks/usePrices'
 import useVaultConfigs from 'hooks/useVaultConfigs'
-import useStore from 'store'
 import {
   Positions,
   VaultPositionValue,
@@ -26,21 +25,20 @@ import {
 } from 'utils/health_computer'
 import { BN } from 'utils/helpers'
 
+// Pyth returns prices with up to 32 decimals. Javascript only supports 18 decimals. So we need to scale by 14 t
+// avoid "too many decimals" errors.
+const VALUE_SCALE_FACTOR = 14
+
 export default function useHealthComputer(account?: Account) {
   const { data: prices } = usePrices()
   const { data: assetParams } = useAssetParams()
   const { data: vaultConfigs } = useVaultConfigs()
-  const baseCurrency = useStore((s) => s.baseCurrency)
 
   const [healthFactor, setHealthFactor] = useState(0)
   const positions: Positions | null = useMemo(() => {
     if (!account) return null
     return convertAccountToPositions(account)
   }, [account])
-  const baseCurrencyPrice = useMemo(
-    () => prices.find((price) => price.denom === baseCurrency.denom)?.amount || 0,
-    [prices, baseCurrency.denom],
-  )
 
   const vaultPositionValues = useMemo(() => {
     if (!account?.vaults) return null
@@ -57,8 +55,8 @@ export default function useHealthComputer(account?: Account) {
             amount: '0', // Not used by healthcomputer
             denom: curr.denoms.vault,
             value: curr.values.primary
-              .div(baseCurrencyPrice)
-              .plus(curr.values.secondary.div(baseCurrencyPrice))
+              .plus(curr.values.secondary)
+              .shiftedBy(VALUE_SCALE_FACTOR + 6) // Need to scale additional 6 to correct for uusd values
               .integerValue()
               .toString(),
           },
@@ -67,20 +65,17 @@ export default function useHealthComputer(account?: Account) {
       },
       {} as { [key: string]: VaultPositionValue },
     )
-  }, [account?.vaults, prices, baseCurrencyPrice])
+  }, [account?.vaults, prices])
 
   const priceData = useMemo(() => {
-    const baseCurrencyPrice =
-      prices.find((price) => price.denom === baseCurrency.denom)?.amount || 0
-
     return prices.reduce(
       (prev, curr) => {
-        prev[curr.denom] = curr.amount.div(baseCurrencyPrice).decimalPlaces(18).toString()
+        prev[curr.denom] = curr.amount.shiftedBy(VALUE_SCALE_FACTOR).toString()
         return prev
       },
       {} as { [key: string]: string },
     )
-  }, [prices, baseCurrency.denom])
+  }, [prices])
 
   const denomsData = useMemo(
     () =>
@@ -192,4 +187,4 @@ export default function useHealthComputer(account?: Account) {
     computeMaxWithdrawAmount,
     computeMaxSwapAmount,
   }
-}
+}

src/hooks/useUpdatedAccount/index.ts

@@ -225,4 +225,4 @@ export function useUpdatedAccount(account?: Account) {
     simulateVaultDeposit,
     simulateWithdraw,
   }
-}
+}

src/store/slices/broadcast.ts

@@ -20,7 +20,6 @@ import { formatAmountWithSymbol } from 'utils/formatters'
 import getTokenOutFromSwapResponse from 'utils/getTokenOutFromSwapResponse'
 import { BN } from 'utils/helpers'
 
-
 function generateExecutionMessage(
   sender: string | undefined = '',
   contract: string,
@@ -533,4 +532,4 @@ export default function createBroadcastSlice(
       }
     },
   }
-}
+}

src/types/interfaces/store/modals.d.ts

@@ -19,7 +19,7 @@ interface AlertDialogButton {
   text?: string
   icon?: JSX.Element
   isAsync?: boolean
-  onClick?: () => void
+  onClick?: () => Promise<void> | void
 }
 
 interface AlertDialogConfig {
@@ -29,6 +29,7 @@ interface AlertDialogConfig {
   negativeButton?: AlertDialogButton
   positiveButton?: AlertDialogButton
 }
+
 interface BorrowModal {
   asset: Asset
   marketData: BorrowMarketTableData
@@ -36,6 +37,7 @@ interface BorrowModal {
 }
 
 type LendAndReclaimModalAction = 'lend' | 'reclaim'
+
 interface LendAndReclaimModalConfig {
   data: LendingMarketTableData
   action: LendAndReclaimModalAction
@@ -54,6 +56,7 @@ interface AddVaultBorrowingsModal {
 interface UnlockModal {
   vault: DepositedVault
 }
+
 interface WalletAssetModal {
   isOpen?: boolean
   selectedDenoms: string[]

src/utils/formatters.ts

@@ -4,6 +4,7 @@ import moment from 'moment'
 import { BN_ZERO } from 'constants/math'
 import { ORACLE_DENOM } from 'constants/oracle'
 import { BNCoin } from 'types/classes/BNCoin'
+import { byDenom } from 'utils/array'
 import { getAllAssets, getEnabledMarketAssets } from 'utils/assets'
 import { BN } from 'utils/helpers'
 
@@ -167,19 +168,19 @@ export const convertPercentage = (percent: number) => {
   return Number(formatValue(percentage, { minDecimals: 0, maxDecimals: 0 }))
 }
 
-export function magnify(value: number | string, asset: Asset | PseudoAsset) {
-  const amount = BN(value)
-  return amount.isZero() ? amount : BN(value).shiftedBy(asset.decimals)
+export function magnify(amount: number | string, asset: Asset | PseudoAsset) {
+  const _amount = BN(amount)
+  return _amount.isZero() ? _amount : _amount.shiftedBy(asset.decimals)
 }
 
 export function demagnify(amount: number | string | BigNumber, asset: Asset | PseudoAsset) {
-  const value = BN(amount)
-  return value.isZero() ? 0 : value.shiftedBy(-1 * asset.decimals).toNumber()
+  const _amount = BN(amount)
+  return _amount.isZero() ? 0 : _amount.shiftedBy(-1 * asset.decimals).toNumber()
 }
 
 export function getCoinValue(coin: BNCoin, prices: BNCoin[]) {
-  const asset = getAllAssets().find((asset) => asset.denom === coin.denom)
-  const coinPrice = prices.find((price) => price.denom === coin.denom)
+  const asset = getAllAssets().find(byDenom(coin.denom))
+  const coinPrice = prices.find(byDenom(coin.denom))
 
   if (!coinPrice || !asset) return BN_ZERO
 
@@ -187,6 +188,16 @@ export function getCoinValue(coin: BNCoin, prices: BNCoin[]) {
   return coin.amount.shiftedBy(decimals).multipliedBy(coinPrice.amount)
 }
 
+export function getCoinAmount(denom: string, value: BigNumber, prices: BNCoin[]) {
+  const asset = getAllAssets().find(byDenom(denom))
+  const coinPrice = prices.find(byDenom(denom))
+
+  if (!coinPrice || !asset) return BN_ZERO
+
+  const decimals = asset.denom === ORACLE_DENOM ? 0 : asset.decimals
+  return value.dividedBy(coinPrice.amount).shiftedBy(decimals).integerValue()
+}
+
 export function convertLiquidityRateToAPR(rate: number) {
   const rateMulHundred = rate * 100
   return rateMulHundred >= 0.01 ? rateMulHundred : 0.0

src/utils/parsers.ts

@@ -1,15 +1,12 @@
 import { BNCoin } from 'types/classes/BNCoin'
 import { BN } from 'utils/helpers'
+
 export function isNumber(value: unknown) {
   if (typeof value === 'string' && value !== '') {
     return !isNaN(Number(value))
   }
 
-  if (typeof value === 'number') {
-    return true
-  }
-
-  return false
+  return typeof value === 'number'
 }
 
 export const convertAprToApy = (apr: number, numberOfCompoundingPeriods: number): number => {
@@ -32,13 +29,11 @@ export const combineBNCoins = (coins: BNCoin[]): BNCoin[] => {
     }
   })
 
-  const combinedArray: BNCoin[] = Object.keys(combinedMap).map(
+  return Object.keys(combinedMap).map(
     (denom) =>
       new BNCoin({
         denom,
         amount: BN(combinedMap[denom]).toString(),
       }),
   )
-
-  return combinedArray
 }

src/utils/vaults.ts

@@ -5,7 +5,7 @@ import { TESTNET_VAULTS_META_DATA, VAULTS_META_DATA } from 'constants/vaults'
 import { BNCoin } from 'types/classes/BNCoin'
 import { Action } from 'types/generated/mars-credit-manager/MarsCreditManager.types'
 import { getAssetByDenom } from 'utils/assets'
-import { getCoinValue } from 'utils/formatters'
+import { getCoinAmount, getCoinValue } from 'utils/formatters'
 import { getValueFromBNCoins, mergeBNCoinArrays } from 'utils/helpers'
 import { getTokenPrice } from 'utils/tokens'
 
@@ -67,8 +67,8 @@ export function getVaultSwapActions(
   const swapActions: Action[] = []
   const coins = [...deposits, ...borrowings]
 
-  let primaryLeftoverValue = totalValue.dividedBy(2).integerValue()
-  let secondaryLeftoverValue = totalValue.dividedBy(2).integerValue()
+  let primaryLeftoverValue = totalValue.dividedBy(2)
+  let secondaryLeftoverValue = totalValue.dividedBy(2)
 
   const [primaryCoins, secondaryCoins, otherCoins] = coins.reduce(
     (prev, bnCoin) => {
@@ -94,7 +94,9 @@ export function getVaultSwapActions(
     } else {
       value = value.minus(primaryLeftoverValue)
       primaryLeftoverValue = primaryLeftoverValue.minus(primaryLeftoverValue)
-      otherCoins.push(new BNCoin({ denom: bnCoin.denom, amount: value.toString() }))
+      otherCoins.push(
+        BNCoin.fromDenomAndBigNumber(bnCoin.denom, getCoinAmount(bnCoin.denom, value, prices)),
+      )
     }
   })
 
@@ -105,7 +107,9 @@ export function getVaultSwapActions(
     } else {
       value = value.minus(secondaryLeftoverValue)
       secondaryLeftoverValue = secondaryLeftoverValue.minus(secondaryLeftoverValue)
-      otherCoins.push(new BNCoin({ denom: bnCoin.denom, amount: value.toString() }))
+      otherCoins.push(
+        BNCoin.fromDenomAndBigNumber(bnCoin.denom, getCoinAmount(bnCoin.denom, value, prices)),
+      )
     }
   })