Fix/liquidity

examples/provide-liquidity/components/pools/PoolCard.tsx

@@ -11,8 +11,10 @@ import {
 import { getLogoUrlFromDenom } from './PoolList';
 import BigNumber from 'bignumber.js';
 import { truncDecimals } from './modals/PoolDetailModal';
-import { getSymbolForDenom, ExtendedPool } from '@/utils';
+import { ExtendedPool, osmosisAssetsList } from '@/utils';
 import { PoolApr } from '@/hooks';
+import { getSymbolByDenom } from '@chain-registry/utils';
+import { CoinSymbol } from '@/utils/types';
 
 const formatNumber = (number: number | string) => {
   const formatter = Intl.NumberFormat('en', {
@@ -104,7 +106,13 @@ const PoolCard = ({
         <Box fontSize="14px">
           <Text fontWeight="600" color={poolNameColor}>
             {pool.poolAssets
-              .map(({ token }) => getSymbolForDenom(token!.denom))
+              .map(({ token }) => {
+                const symbol = getSymbolByDenom(
+                  osmosisAssetsList,
+                  token!.denom
+                ) as CoinSymbol;
+                return symbol;
+              })
               .join('/')}
           </Text>
           <Text fontWeight="400" color={poolIdColor}>

examples/provide-liquidity/components/pools/PoolList.tsx

@@ -28,16 +28,17 @@ import {
 import { SlOptionsVertical } from 'react-icons/sl';
 import BigNumber from 'bignumber.js';
 import { truncDecimals } from './modals/PoolDetailModal';
+import { getSymbolByDenom, getAssetByDenom } from '@chain-registry/utils';
+import { CoinSymbol } from '@/utils/types';
 import {
-  getOsmoAssetByDenom,
-  getSymbolForDenom,
   ExtendedPool,
+  osmosisAssetsList,
 } from '../../utils';
 import { PoolsApr } from '@/hooks';
 
 export const getLogoUrlFromDenom = (denom: string | undefined) => {
   if (!denom) return '';
-  const asset = getOsmoAssetByDenom(denom);
+  const asset = getAssetByDenom(osmosisAssetsList, denom);
   return asset?.logo_URIs?.png;
 };
 
@@ -98,7 +99,13 @@ const PoolName = ({
         {pool.poolAssets.length > 2
           ? `${pool.poolAssets.length} Token Pool`
           : pool.poolAssets
-              .map(({ token }) => getSymbolForDenom(token!.denom))
+              .map(({ token }) => {
+                const symbol = getSymbolByDenom(
+                  osmosisAssetsList,
+                  token!.denom
+                ) as CoinSymbol;
+                return symbol;
+              })
               .join('/')}
       </Text>
       <Text fontWeight="400" fontSize="14px" color={poolIdColor}>

examples/provide-liquidity/components/pools/modals/AddLiquidityModal.tsx

@@ -18,16 +18,21 @@ import { Coin } from 'osmo-query/dist/codegen/cosmos/base/v1beta1/coin';
 import { defaultChainName } from '@/config';
 import { LargeButton } from './ModalComponents';
 import {
-  getSymbolForDenom,
+  osmosisAssetsList,
   prettyPool,
-  baseUnitsToDisplayUnits,
-  getExponentByDenom,
   calcShareOutAmount,
-  getOsmoDenomForSymbol,
-  baseUnitsToDollarValue,
   convertDollarValueToCoins,
   ExtendedPool,
 } from '@/utils';
+import { 
+  getSymbolByDenom, 
+  getExponentByDenom, 
+  getDenomBySymbol,
+  convertBaseUnitToDollarValue,
+  convertBaseUnitToDisplayUnit 
+} from '@chain-registry/utils';
+
+import { CoinSymbol, Exponent } from '@/utils/types';
 import { PriceHash } from '@/utils/types';
 import BigNumber from 'bignumber.js';
 import { coin, coins as aminoCoins } from '@cosmjs/amino';
@@ -95,16 +100,20 @@ export const AddLiquidityModal = ({
 
   const { address } = useChain(defaultChainName);
 
-  const poolName = currentPool?.poolAssets.map(({ token }) =>
-    getSymbolForDenom(token!.denom)
-  );
+  const poolName = currentPool?.poolAssets.map(({ token }) => {
+    const symbol = getSymbolByDenom(
+      osmosisAssetsList,
+      token!.denom
+    ) as CoinSymbol;
+    return symbol;
+  });
 
   const pool = prettyPool(currentPool);
 
   const currentInputTokens = singleToken
     ? [
         inputTokens.find(
-          ({ denom }) => denom === getOsmoDenomForSymbol(singleToken)
+          ({ denom }) => denom === getDenomBySymbol(osmosisAssetsList, singleToken)
         )!,
       ]
     : inputTokens;
@@ -117,9 +126,9 @@ export const AddLiquidityModal = ({
 
   const hasInsufficientAmount = currentInputTokens.some((t) => {
     const balance = balances.find((b) => b.denom === t.denom)?.amount || 0;
-    const symbol = getSymbolForDenom(t.denom);
+    const symbol = getSymbolByDenom(osmosisAssetsList, t.denom) as CoinSymbol;
     return new BigNumber(t.inputAmount).gt(
-      baseUnitsToDisplayUnits(symbol, balance)
+      convertBaseUnitToDisplayUnit(osmosisAssetsList, symbol, balance)
     );
   });
 
@@ -151,22 +160,22 @@ export const AddLiquidityModal = ({
     const allCoins = inputTokens.map(({ denom, inputAmount }) => ({
       denom,
       amount: new BigNumber(inputAmount)
-        .shiftedBy(getExponentByDenom(denom))
+        .shiftedBy(getExponentByDenom(osmosisAssetsList, denom) as Exponent)
         .toString(),
     }));
 
     let msgs = [];
 
     if (singleToken) {
       const inputCoin = allCoins.find(
-        (coin) => coin.denom === getOsmoDenomForSymbol(singleToken)
+        (coin) => coin.denom === getDenomBySymbol(osmosisAssetsList, singleToken)  
       )!;
-      const coinSymbol = getSymbolForDenom(inputCoin.denom);
-      const inputValue = baseUnitsToDollarValue(
-        prices,
-        coinSymbol,
-        inputCoin.amount
-      );
+      const coinSymbol = getSymbolByDenom(
+        osmosisAssetsList,
+        inputCoin.denom
+      ) as CoinSymbol;
+      const inputValue = convertBaseUnitToDollarValue(osmosisAssetsList, prices, coinSymbol, inputCoin.amount);
+
       // @ts-ignore
       const coinsNeeded = convertDollarValueToCoins(inputValue, pool, prices);
       // @ts-ignore

examples/provide-liquidity/components/pools/modals/BondSharesModal.tsx

@@ -17,8 +17,8 @@ import {
 import { LargeButton } from './ModalComponents';
 import {
   convertDollarValueToShares,
-  getSymbolForDenom,
   ExtendedPool,
+  osmosisAssetsList,
 } from '@/utils';
 import { PriceHash } from '@/utils/types';
 import BigNumber from 'bignumber.js';
@@ -27,6 +27,8 @@ import { useChain } from '@cosmos-kit/react';
 import { defaultChainName } from '@/config';
 import { coins as aminoCoins } from '@cosmjs/amino';
 import { Durations, useTx } from '@/hooks';
+import { getSymbolByDenom } from '@chain-registry/utils';
+import { CoinSymbol } from '@/utils/types';
 
 const { lockTokens } = osmosis.lockup.MessageComposer.withTypeUrl;
 
@@ -58,9 +60,13 @@ export const BondSharesModal = ({
   const { address } = useChain(defaultChainName);
   const [isMobile] = useMediaQuery('(max-width: 480px)');
 
-  const poolName = currentPool?.poolAssets.map(({ token }) =>
-    getSymbolForDenom(token!.denom)
-  );
+  const poolName = currentPool?.poolAssets.map(({ token }) => {
+    const symbol = getSymbolByDenom(
+      osmosisAssetsList,
+      token!.denom
+    ) as CoinSymbol;
+    return symbol;
+  });
 
   const unbondedShares = convertDollarValueToShares(
     currentPool?.myLiquidity || 0,

examples/provide-liquidity/components/pools/modals/PoolDetailModal.tsx

@@ -27,7 +27,7 @@ import {
   convertDollarValueToShares,
   convertDollarValueToCoins,
   convertGammTokenToDollarValue,
-  getSymbolForDenom,
+  osmosisAssetsList,
   ExtendedPool,
 } from '@/utils';
 import { PriceHash } from '@/utils/types';
@@ -39,6 +39,8 @@ import { daysToSeconds } from './BondSharesModal';
 import dayjs from 'dayjs';
 import { coins as aminoCoins } from '@cosmjs/amino';
 import { durations, Durations, PoolApr, useTx } from '@/hooks';
+import { getSymbolByDenom } from '@chain-registry/utils';
+import { CoinSymbol } from '@/utils/types';
 
 export const truncDecimals = (
   val: string | number | undefined,
@@ -90,9 +92,13 @@ export const PoolDetailModal = ({
 
   const poolId = pool?.id;
 
-  const poolName = pool?.poolAssets.map(({ token }) =>
-    getSymbolForDenom(token!.denom)
-  );
+  const poolName = pool?.poolAssets.map(({ token }) => {
+    const symbol = getSymbolByDenom(
+      osmosisAssetsList,
+      token!.denom
+    ) as CoinSymbol;
+    return symbol;
+  });
 
   const swapFee = new BigNumber(pool!.poolParams!.swapFee)
     .shiftedBy(2)

examples/provide-liquidity/components/pools/modals/RemoveLiquidityModal.tsx

@@ -21,7 +21,7 @@ import { LargeButton, PoolAssetDisplay } from './ModalComponents';
 import {
   convertDollarValueToCoins,
   convertDollarValueToShares,
-  getSymbolForDenom,
+  osmosisAssetsList,
   noDecimals,
   ExtendedPool,
 } from '@/utils';
@@ -35,6 +35,8 @@ import { defaultChainName } from '@/config';
 import { useChain } from '@cosmos-kit/react';
 import { coin, coins as aminoCoins } from '@cosmjs/amino';
 import { useTx } from '@/hooks';
+import { getSymbolByDenom } from '@chain-registry/utils';
+import { CoinSymbol } from '@/utils/types';
 
 const { exitPool } = osmosis.gamm.v1beta1.MessageComposer.withTypeUrl;
 
@@ -76,9 +78,13 @@ export const RemoveLiquidityModal = ({
     prices
   );
 
-  const poolName = currentPool?.poolAssets.map(({ token }) =>
-    getSymbolForDenom(token!.denom)
-  );
+  const poolName = currentPool?.poolAssets.map(({ token }) => {
+    const symbol = getSymbolByDenom(
+      osmosisAssetsList,
+      token!.denom
+    ) as CoinSymbol;
+    return symbol;
+  });
 
   const closeModal = () => {
     onClose();

examples/provide-liquidity/components/pools/modals/TokenInput.tsx

@@ -16,15 +16,16 @@ import { AddIcon, MinusIcon } from '@chakra-ui/icons';
 import {
   prettyPool,
   osmosisAssets,
-  baseUnitsToDisplayUnits,
+  osmosisAssetsList,
   calcMaxCoinsForPool,
-  getSymbolForDenom,
 } from '@/utils';
 import { getLogoUrlFromDenom } from '../PoolList';
 import { ChainLogo } from '../PoolCard';
 import { PoolPretty, PriceHash } from '@/utils/types';
 import BigNumber from 'bignumber.js';
 import { truncDecimals } from './PoolDetailModal';
+import { getSymbolByDenom,convertBaseUnitToDisplayUnit } from '@chain-registry/utils';
+import { CoinSymbol } from '@/utils/types';
 
 type PrettyAsset = Pick<
   ReturnType<typeof prettyPool>,
@@ -78,7 +79,7 @@ export const TokenInput = ({
   const balance = balances.find((b) => b.denom === token.denom);
 
   const availableBalance = balance
-    ? baseUnitsToDisplayUnits(token.symbol, balance.amount)
+    ?  convertBaseUnitToDisplayUnit(osmosisAssetsList, token.symbol, balance.amount)
     : '0';
 
   const displayAmountToValue = (amount: string) => {
@@ -141,10 +142,15 @@ export const TokenInput = ({
                   const coin = maxCoins.find(
                     ({ denom }) => denom === inputToken.denom
                   )!;
-                  const symbol = getSymbolForDenom(coin.denom);
+
+                  const symbol = getSymbolByDenom(
+                    osmosisAssetsList,
+                    coin.denom
+                  ) as CoinSymbol;
+
                   return {
                     ...inputToken,
-                    inputAmount: baseUnitsToDisplayUnits(symbol, coin.amount),
+                    inputAmount:  convertBaseUnitToDisplayUnit(osmosisAssetsList, symbol, coin.amount) 
                   };
                 })
               );

examples/provide-liquidity/components/wallet/Wallet.tsx

@@ -47,7 +47,7 @@ export const WalletSection = () => {
   const { getChainLogo } = useManager();
   const [osmoBalance, setOsmoBalance] = useState<Coin>();
   const [balanceStaked, setBalanceStaked] = useState<Coin | null>();
-  console.log('balanceStaked', balanceStaked);
+  // console.log('balanceStaked', balanceStaked);
 
   const chain = {
     chainName: defaultChainName,
@@ -68,16 +68,25 @@ export const WalletSection = () => {
   };
 
   const getBalance = async () => {
-    const client = await getSigningStargateClient();
-    const balance = await client?.getBalance(address as string, 'OSMO');
-    setOsmoBalance(balance);
+    try { 
+      const client = await getSigningStargateClient();
+      const balance = await client?.getBalance(address as string, 'uosmo');
+      setOsmoBalance(balance); 
+    } catch (error) {
+      console.log(error)
+    }
+
   };
 
   const getBalanceStaked = async () => {
-    const client = await getSigningStargateClient();
-    const staked = await client?.getBalanceStaked(address as string);
-
-    setBalanceStaked(staked);
+    try {
+     const client = await getSigningStargateClient();
+     const staked = await client?.getBalanceStaked(address as string);
+     setBalanceStaked(staked);
+    } catch (error) {
+      console.log(error)
+    }
+
   };
 
   useEffect(() => {
@@ -140,17 +149,17 @@ export const WalletSection = () => {
       <HStack w="256px" py={2} fontSize="13px" justify="space-between">
         <Flex gap={1}>
           <Text fontWeight="semibold">
-            Balance: {osmoBalance?.amount || '--'}
+            Balance: {osmoBalance?.amount ?? '--'}
           </Text>
-          <Text pt="1px" fontSize="12px" color="blackAlpha.700">
+          <Text pt="1px" fontSize="12px">
             {osmoBalance?.denom}
           </Text>
         </Flex>
         <Flex gap={1}>
           <Text fontWeight="semibold">
-            Staked: {balanceStaked?.amount || '--'}
+            Staked: {balanceStaked?.amount ?? '--'}
           </Text>
-          <Text pt="2px" fontSize="12px" color="blackAlpha.700">
+          <Text pt="2px" fontSize="12px">
             {balanceStaked?.denom}
           </Text>
         </Flex>