Eason/bugfix

package.json

@@ -41,5 +41,5 @@
     "type": "git",
     "url": "https://github.com/hyperweb-io/create-hyperweb-app"
   },
-  "packageManager": "yarn@4.1.0"
+  "packageManager": "yarn@4.3.0"
 }

templates/chain-admin/components/common/Sidebar/SidebarContent.tsx

@@ -61,7 +61,7 @@ const ConnectButton = () => {
   const walletLogo =
     typeof walletInfo?.logo === 'string'
       ? walletInfo.logo
-      : walletInfo.logo.major || walletInfo.logo.minor;
+      : walletInfo?.logo?.major || walletInfo?.logo?.minor;
 
   return (
     <>

templates/chain-admin/components/contract/common/AttachFundsRadio.tsx

@@ -1,6 +1,6 @@
 import { useEffect, useMemo, useState } from 'react';
 import { Box } from '@interchain-ui/react';
-import { Asset } from '@chain-registry/v2-types';
+import { Asset } from '@chain-registry/types';
 import BigNumber from 'bignumber.js';
 import { TbCurrencyDollarOff } from 'react-icons/tb';
 import { LuListPlus } from 'react-icons/lu';

templates/chain-admin/components/contract/common/SelectAssetContent.tsx

@@ -1,5 +1,5 @@
 import { Dispatch, SetStateAction, useMemo } from 'react';
-import { assetLists } from '@chain-registry/v2';
+import { assetLists } from 'chain-registry';
 import { LuPlus } from 'react-icons/lu';
 
 import {

templates/chain-admin/components/contract/common/SelectAssetItem.tsx

@@ -1,6 +1,6 @@
 import { Dispatch, SetStateAction, useState } from 'react';
 import { HiOutlineTrash } from 'react-icons/hi';
-import { Asset } from '@chain-registry/v2-types';
+import { Asset } from '@chain-registry/types';
 import {
   Avatar,
   Box,
@@ -95,7 +95,7 @@ export const SelectAssetItem = ({
         >
           <PopoverTrigger>
             <SelectButton
-              onClick={() => {}}
+              onClick={() => { }}
               placeholder={selectedAssetWithAmount?.asset?.symbol ?? 'Select'}
               _css={{ width: isMobile ? '100px' : '140px' }}
             />
@@ -108,9 +108,8 @@ export const SelectAssetItem = ({
               py="10px"
               bg="$background"
               borderRadius="4px"
-              boxShadow={`0px 4px 20px 0px rgba(${
-                theme === 'light' ? '0,0,0' : '128,128,128'
-              }, 0.1)`}
+              boxShadow={`0px 4px 20px 0px rgba(${theme === 'light' ? '0,0,0' : '128,128,128'
+                }, 0.1)`}
               maxHeight="220px"
               overflowY="auto"
             >

templates/chain-admin/components/voting/Voting.tsx

@@ -58,7 +58,7 @@ export function Voting({ chainName }: VotingProps) {
   const { modal, open: openModal, close: closeModal, setTitle } = useModal('');
   const [tallies, setTallies] = useState<{ [key: string]: TallyResult }>({});
 
-  const chain = chains.find((c) => c.chain_name === chainName);
+  const chain = chains.find((c) => c.chainName === chainName);
 
   useEffect(() => {
     if (!data.proposals || data.proposals.length === 0) return;
@@ -86,7 +86,7 @@ export function Voting({ chainName }: VotingProps) {
                 };
               });
               break;
-            } catch (e) {}
+            } catch (e) { }
           }
         })();
       }
@@ -119,46 +119,46 @@ export function Voting({ chainName }: VotingProps) {
       {data.proposals?.length === 0
         ? empty
         : data.proposals?.map((proposal, index) => {
-            let tally = proposal.finalTallyResult;
-            if (
-              proposal.status === ProposalStatus.PROPOSAL_STATUS_VOTING_PERIOD
-            ) {
-              tally = tallies[proposal.id.toString()];
-            }
-            return (
-              <Box
-                my="$8"
-                key={proposal.id?.toString() || index}
-                position="relative"
-                attributes={{ onClick: () => onClickProposal(index) }}
-              >
-                {data.votes[proposal.id.toString()] ? (
-                  <Box
-                    position="absolute"
-                    px="$4"
-                    py="$2"
-                    top="$4"
-                    right="$6"
-                    borderRadius="$md"
-                    backgroundColor="$green400"
-                  >
-                    <Text color="$white" fontSize="$xs" fontWeight="$bold">
-                      Voted
-                    </Text>
-                  </Box>
-                ) : null}
-                <GovernanceProposalItem
-                  id={`# ${proposal.id?.toString()}`}
-                  key={proposal.submitTime?.getTime()}
-                  // @ts-ignore
-                  title={proposal.content?.title || proposal.title || ''}
-                  status={status(proposal.status)}
-                  votes={votes(tally!)}
-                  endTime={formatDate(proposal.votingEndTime)!}
-                />
-              </Box>
-            );
-          })}
+          let tally = proposal.finalTallyResult;
+          if (
+            proposal.status === ProposalStatus.PROPOSAL_STATUS_VOTING_PERIOD
+          ) {
+            tally = tallies[proposal.id.toString()];
+          }
+          return (
+            <Box
+              my="$8"
+              key={proposal.id?.toString() || index}
+              position="relative"
+              attributes={{ onClick: () => onClickProposal(index) }}
+            >
+              {data.votes[proposal.id.toString()] ? (
+                <Box
+                  position="absolute"
+                  px="$4"
+                  py="$2"
+                  top="$4"
+                  right="$6"
+                  borderRadius="$md"
+                  backgroundColor="$green400"
+                >
+                  <Text color="$white" fontSize="$xs" fontWeight="$bold">
+                    Voted
+                  </Text>
+                </Box>
+              ) : null}
+              <GovernanceProposalItem
+                id={`# ${proposal.id?.toString()}`}
+                key={proposal.submitTime?.getTime()}
+                // @ts-ignore
+                title={proposal.content?.title || proposal.title || ''}
+                status={status(proposal.status)}
+                votes={votes(tally!)}
+                endTime={formatDate(proposal.votingEndTime)!}
+              />
+            </Box>
+          );
+        })}
     </Box>
   );
 

templates/chain-admin/hooks/asset-list/useAssets.ts

@@ -100,7 +100,7 @@ export const useAssets = (chainName: string) => {
         const dollarValue = calcCoinDollarValue(prices, { amount, denom });
         return {
           symbol,
-          logoUrl: asset.logo_URIs?.png || asset.logo_URIs?.svg,
+          logoUrl: asset.logoURIs?.png || asset.logoURIs?.svg,
           prettyChainName: getPrettyChainName(denom),
           displayAmount: convRawToDispAmount(denom, amount),
           dollarValue,

templates/chain-admin/hooks/asset-list/useChainAssetsPrices.ts

@@ -8,19 +8,19 @@ type CoinGeckoUSD = { usd: number };
 type CoinGeckoUSDResponse = Record<CoinGeckoId, CoinGeckoUSD>;
 
 const getAssetsWithGeckoIds = (assets: Asset[]) => {
-  return assets.filter((asset) => !!asset?.coingecko_id);
+  return assets.filter((asset) => !!asset?.coingeckoId);
 };
 
 const getGeckoIds = (assets: Asset[]) => {
-  return assets.map((asset) => asset.coingecko_id) as string[];
+  return assets.map((asset) => asset.coingeckoId) as string[];
 };
 
 const formatPrices = (
   prices: CoinGeckoUSDResponse,
   assets: Asset[]
 ): Record<string, number> => {
   return Object.entries(prices).reduce((priceHash, cur) => {
-    const denom = assets.find((asset) => asset.coingecko_id === cur[0])!.base;
+    const denom = assets.find((asset) => asset.coingeckoId === cur[0])!.base;
     return { ...priceHash, [denom]: cur[1].usd };
   }, {});
 };

templates/chain-admin/hooks/asset-list/useChainUtils.ts

@@ -2,7 +2,7 @@ import { useMemo } from 'react';
 import { useWalletManager } from '@interchain-kit/react';
 import { Asset, AssetList } from '@chain-registry/types';
 import { asset_lists as ibcAssetLists } from '@chain-registry/assets';
-import { assets as chainAssets, ibc } from 'chain-registry';
+import { assetLists as chainAssets, ibcData as ibc } from 'chain-registry';
 import { Coin } from '@interchainjs/react/types';
 import BigNumber from 'bignumber.js';
 
@@ -18,14 +18,14 @@ export const useChainUtils = (chainName: string) => {
     starshipData?.v1 ?? {};
 
   const isStarshipChain = starshipChains.some(
-    (chain) => chain.chain_name === chainName
+    (chain) => chain.chainName === chainName
   );
 
   const filterAssets = (assetList: AssetList[]): Asset[] => {
     return (
       assetList
-        .find(({ chain_name }) => chain_name === chainName)
-        ?.assets?.filter(({ type_asset }) => type_asset !== 'ics20') || []
+        .find(({ chainName }) => chainName === chainName)
+        ?.assets?.filter(({ typeAsset }) => typeAsset !== 'ics20') || []
     );
   };
 
@@ -66,7 +66,7 @@ export const useChainUtils = (chainName: string) => {
       (asset) =>
         asset.symbol === symbol &&
         (!chainName ||
-          asset.traces?.[0].counterparty.chain_name.toLowerCase() ===
+          asset.traces?.[0].counterparty.chainName.toLowerCase() ===
             chainName.toLowerCase())
     );
     const base = asset?.base;
@@ -78,7 +78,7 @@ export const useChainUtils = (chainName: string) => {
 
   const getExponentByDenom = (denom: CoinDenom): Exponent => {
     const asset = getAssetByDenom(denom);
-    const unit = asset.denom_units.find(({ denom }) => denom === asset.display);
+    const unit = asset.denomUnits.find(({ denom }) => denom === asset.display);
     return unit?.exponent || 0;
   };
 
@@ -102,7 +102,7 @@ export const useChainUtils = (chainName: string) => {
       return chainName;
     }
     const asset = ibcAssets.find((asset) => asset.base === ibcDenom);
-    const ibcChainName = asset?.traces?.[0].counterparty.chain_name;
+    const ibcChainName = asset?.traces?.[0].counterparty.chainName;
     if (!ibcChainName)
       throw Error('chainName not found for ibcDenom: ' + ibcDenom);
     return ibcChainName;
@@ -140,15 +140,15 @@ export const useChainUtils = (chainName: string) => {
 
     let ibcInfo = ibc.find(
       (i) =>
-        i.chain_1.chain_name === fromChainName &&
-        i.chain_2.chain_name === toChainName
+        i.chain1.chainName === fromChainName &&
+        i.chain2.chainName === toChainName
     );
 
     if (!ibcInfo) {
       ibcInfo = ibc.find(
         (i) =>
-          i.chain_1.chain_name === toChainName &&
-          i.chain_2.chain_name === fromChainName
+          i.chain1.chainName === toChainName &&
+          i.chain2.chainName === fromChainName
       );
       flipped = true;
     }
@@ -157,9 +157,9 @@ export const useChainUtils = (chainName: string) => {
       throw new Error('cannot find IBC info');
     }
 
-    const key = flipped ? 'chain_2' : 'chain_1';
-    const sourcePort = ibcInfo.channels[0][key].port_id;
-    const sourceChannel = ibcInfo.channels[0][key].channel_id;
+    const key = flipped ? 'chain2' : 'chain1';
+    const sourcePort = ibcInfo.channels[0][key].portId;
+    const sourceChannel = ibcInfo.channels[0][key].channelId;
 
     return { sourcePort, sourceChannel };
   };

templates/chain-admin/hooks/common/useStarshipChains.ts

@@ -3,7 +3,7 @@ import { AssetList, Chain } from '@chain-registry/types';
 import {
   Chain as ChainV2,
   AssetList as AssetListV2,
-} from '@chain-registry/v2-types';
+} from '@chain-registry/types';
 
 import { StarshipConfig } from '@/starship';
 import { convertKeysToCamelCase } from '@/utils';
@@ -33,7 +33,8 @@ export const useStarshipChains = () => {
 
         const assets = (await Promise.all(
           chains.map((chain) =>
-            fetcher<AssetList>(`${baseUrl}/chains/${chain.chain_id}/assets`)
+            // @ts-ignore
+            fetcher<AssetList>(`${baseUrl}/chains/${chain.chain_id}/assets`) // if use chainId, got error: Cannot read properties of undefined (reading 'chainName') at const { connect, disconnect, address, wallet } = useChain(selectedChain)
           )
         ).then((assetLists) => assetLists.filter(Boolean))) as AssetList[];
 

templates/chain-admin/hooks/staking/useAssetsPrices.ts

@@ -1,4 +1,4 @@
-import { assets } from 'chain-registry';
+import { assetLists as assets } from 'chain-registry';
 import { useQuery } from '@tanstack/react-query';
 import { AssetList } from '@chain-registry/types';
 import { useChainStore } from '@/contexts';
@@ -17,7 +17,7 @@ const handleError = (resp: Response) => {
 
 const getGeckoIdsFromAssets = (assets: AssetList[]) => {
   return assets
-    .map((asset) => asset.assets[0].coingecko_id)
+    .map((asset) => asset.assets[0].coingeckoId)
     .filter(Boolean) as string[];
 };
 
@@ -27,7 +27,7 @@ const formatPrices = (
 ): Prices => {
   return Object.entries(prices).reduce((priceHash, cur) => {
     const assetList = assets.find(
-      (asset) => asset.assets[0].coingecko_id === cur[0]
+      (asset) => asset.assets[0].coingeckoId === cur[0]
     )!;
     const denom = assetList.assets[0].base;
     return { ...priceHash, [denom]: cur[1].usd };
@@ -53,7 +53,7 @@ export const useAssetsPrices = () => {
     starshipData?.v1 ?? {};
 
   const isStarshipChain = starshipChains.some(
-    (chain) => chain.chain_name === selectedChain
+    (chain) => chain.chainName === selectedChain
   );
 
   return useQuery({

templates/chain-admin/hooks/voting/useVotingData.ts

@@ -51,7 +51,7 @@ export function useVotingData(chainName: string) {
   const { data: rpcEndpoint, isFetching } = useRpcEndpoint(chainName);
 
   const getVote = createGetVote(rpcEndpoint);
-  const chain = chains.find((c) => c.chain_name === chainName);
+  const chain = chains.find((c) => c.chainName === chainName);
   const isReady = !!address && !!rpcEndpoint;
 
   const proposalsQuery = useGetProposals({

templates/chain-admin/package.json

@@ -15,11 +15,11 @@
   "resolutions": {
     "react": "18.2.0",
     "react-dom": "18.2.0",
-    "@types/react": "18.0.25",
-    "@types/react-dom": "18.0.9"
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0"
   },
   "dependencies": {
-    "@chain-registry/assets": "1.63.5",
+    "@chain-registry/assets": "1.70.240",
     "@interchain-kit/core": "^0.2.1",
     "@interchain-kit/keplr-extension": "^0.2.1",
     "@interchain-kit/leap-extension": "^0.2.1",
@@ -31,7 +31,7 @@
     "@tanstack/react-query": "4.32.0",
     "ace-builds": "1.35.0",
     "bignumber.js": "9.1.2",
-    "chain-registry": "1.62.3",
+    "chain-registry": "2.0.9",
     "dayjs": "1.11.11",
     "hyperwebjs": "^0.0.5",
     "interchain-kit": "^0.2.1",
@@ -46,13 +46,13 @@
     "zustand": "4.5.2"
   },
   "devDependencies": {
-    "@chain-registry/types": "0.44.3",
+    "@chain-registry/types": "2.0.9",
     "@starship-ci/cli": "^2.10.2",
     "@tanstack/react-query-devtools": "4.32.0",
     "@types/node": "18.11.9",
     "@types/node-gzip": "^1",
-    "@types/react": "18.0.25",
-    "@types/react-dom": "18.0.9",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
     "eslint": "8.28.0",
     "eslint-config-next": "13.0.5",
     "generate-lockfile": "0.0.12",

templates/chain-admin/pages/_app.tsx

@@ -3,7 +3,7 @@ import '@interchain-ui/react/styles';
 
 import type { AppProps } from 'next/app';
 import { ChainProvider } from '@interchain-kit/react';
-import { chains, assetLists } from '@chain-registry/v2';
+import { chains, assetLists } from 'chain-registry';
 import { QueryClientProvider, QueryClient } from '@tanstack/react-query';
 import { Box, Toaster, useTheme } from '@interchain-ui/react';
 // import { ReactQueryDevtools } from '@tanstack/react-query-devtools';