feat: handler error in transfer

packages/adena-extension/src/common/provider/gno/gno-provider.ts

@@ -168,7 +168,7 @@ export class GnoProvider extends GnoJSONRPCProvider {
 
     const simulateResult = parseProto(responseValue, ResponseDeliverTx.decode);
     if (simulateResult.responseBase?.error) {
-      throw new Error(`Failed to estimate gas: ${simulateResult.responseBase.error.typeUrl}`);
+      throw new Error(simulateResult.responseBase.error.typeUrl);
     }
 
     return simulateResult.gasUsed.toInt();

packages/adena-extension/src/components/molecules/network-fee/network-fee.tsx

@@ -21,11 +21,13 @@ const NetworkFee: React.FC<NetworkFeeProps> = ({
 }) => {
   const hasSetting = !!onClickSetting;
 
-  const hasNetworkFee = !!value && !!denom;
+  const hasNetworkFee = !!Number(value) && !!denom;
+
+  const hasError = isError || !hasNetworkFee;
 
   return (
     <NetworkFeeContainer>
-      <NetworkFeeWrapper isError={isError}>
+      <NetworkFeeWrapper isError={hasError}>
         <span className='key'>{'Network Fee'}</span>
 
         <div className='network-fee-amount-wrapper'>

packages/adena-extension/src/hooks/wallet/transaction-gas/use-get-estimate-gas.ts

@@ -50,7 +50,15 @@ export const useGetEstimateGas = (
       );
 
       const estimatedGasAmounts = await Promise.all(
-        simulateTxs.map((tx) => transactionGasService.estimateGas(tx).catch(() => DEFAULT_GAS_FEE)),
+        simulateTxs.map((tx) =>
+          transactionGasService.estimateGas(tx).catch((e: Error) => {
+            if (e.message === '/std.InvalidPubKeyError') {
+              return DEFAULT_GAS_FEE;
+            }
+
+            return null;
+          }),
+        ),
       );
 
       return gasPriceTiers.map((tier, index) => {

packages/adena-extension/src/hooks/wallet/use-get-gnot-balance.ts

@@ -0,0 +1,28 @@
+import { GNOT_TOKEN } from '@common/constants/token.constant';
+import { useWalletContext } from '@hooks/use-context';
+import { useCurrentAccount } from '@hooks/use-current-account';
+import { useNetwork } from '@hooks/use-network';
+import { useQuery, UseQueryOptions, UseQueryResult } from '@tanstack/react-query';
+
+export const GET_GNOT_BALANCE_QUERY_KEY = 'wallet/useGetGnotBalance';
+
+export const useGetGnotBalance = (
+  options?: UseQueryOptions<number | null, Error>,
+): UseQueryResult<number | null> => {
+  const { gnoProvider } = useWalletContext();
+  const { currentAddress } = useCurrentAccount();
+  const { currentNetwork } = useNetwork();
+
+  return useQuery<number | null, Error>({
+    queryKey: [GET_GNOT_BALANCE_QUERY_KEY, currentAddress || '', currentNetwork.chainId],
+    queryFn: async () => {
+      if (!gnoProvider || !currentAddress) {
+        return null;
+      }
+
+      return gnoProvider.getBalance(currentAddress, GNOT_TOKEN.denom).catch(() => 0);
+    },
+    keepPreviousData: true,
+    ...options,
+  });
+};

packages/adena-extension/src/pages/popup/wallet/transfer-summary/index.tsx

@@ -1,11 +1,11 @@
 import { Document, isLedgerAccount } from 'adena-module';
 import BigNumber from 'bignumber.js';
-import React, { useCallback, useEffect, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import { useNavigate } from 'react-router-dom';
 import styled from 'styled-components';
 
 import UnknownTokenIcon from '@assets/common-unknown-token.svg';
-import { GasToken, GNOT_TOKEN } from '@common/constants/token.constant';
+import { GasToken } from '@common/constants/token.constant';
 import { DEFAULT_GAS_WANTED } from '@common/constants/tx.constant';
 import { isGRC20TokenModel, isNativeTokenModel } from '@common/validation/validation-token';
 import NetworkFeeSetting from '@components/pages/network-fee-setting/network-fee-setting/network-fee-setting';
@@ -15,6 +15,7 @@ import { useAdenaContext, useWalletContext } from '@hooks/use-context';
 import { useCurrentAccount } from '@hooks/use-current-account';
 import { useNetwork } from '@hooks/use-network';
 import { useTransferInfo } from '@hooks/use-transfer-info';
+import { useGetGnotBalance } from '@hooks/wallet/use-get-gnot-balance';
 import { useNetworkFee } from '@hooks/wallet/use-network-fee';
 import { TransactionMessage } from '@services/index';
 import mixins from '@styles/mixins';
@@ -31,19 +32,51 @@ const TransferSummaryContainer: React.FC = () => {
   const normalNavigate = useNavigate();
   const { navigate, goBack, params } = useAppNavigate<RoutePath.TransferSummary>();
   const summaryInfo = params;
-  const { wallet, gnoProvider } = useWalletContext();
+  const { wallet } = useWalletContext();
   const { transactionService } = useAdenaContext();
   const { currentAccount, currentAddress } = useCurrentAccount();
   const { currentNetwork } = useNetwork();
   const { setMemorizedTransferInfo } = useTransferInfo();
   const [isSent, setIsSent] = useState(false);
-  const [isErrorNetworkFee, setIsErrorNetworkFee] = useState(false);
   const [openedNetworkFeeSetting, setOpenedNetworkFeeSetting] = useState(false);
   const [document, setDocument] = useState<Document | null>(null);
 
   const useNetworkFeeReturn = useNetworkFee(document);
   const networkFee = useNetworkFeeReturn.networkFee;
 
+  const { data: currentBalance } = useGetGnotBalance();
+
+  const hasNetworkFee = useMemo(() => {
+    if (!currentBalance) {
+      return false;
+    }
+
+    if (!networkFee || !Number(networkFee.amount)) {
+      return false;
+    }
+
+    let leastUsedAmount = BigNumber(networkFee.amount);
+
+    if (summaryInfo.tokenMetainfo.type === 'gno-native') {
+      leastUsedAmount = leastUsedAmount.plus(BigNumber(summaryInfo.transferAmount.value));
+    }
+
+    const currentBalanceAmount = BigNumber(currentBalance).shiftedBy(GasToken.decimals * -1);
+    if (currentBalanceAmount.isLessThan(leastUsedAmount)) {
+      return false;
+    }
+
+    return true;
+  }, [currentBalance, networkFee?.amount, summaryInfo]);
+
+  const isNetworkFeeError = useMemo(() => {
+    if (!currentBalance || !Number(networkFee?.amount)) {
+      return false;
+    }
+
+    return !hasNetworkFee;
+  }, [currentBalance, networkFee, hasNetworkFee]);
+
   const getTransferBalance = useCallback(() => {
     const { value, denom } = summaryInfo.transferAmount;
 
@@ -155,36 +188,12 @@ const TransferSummaryContainer: React.FC = () => {
     });
   }, [summaryInfo, currentAccount, currentNetwork, networkFee]);
 
-  const hasNetworkFee = useCallback(async () => {
-    if (!gnoProvider || !currentAddress) {
-      return false;
-    }
-
-    const currentBalance = await gnoProvider.getBalance(currentAddress, GNOT_TOKEN.denom);
-
-    if (!networkFee) {
-      return false;
-    }
-
-    const leastUsedAmount = BigNumber(networkFee.amount);
-
-    if (summaryInfo.tokenMetainfo.type === 'gno-native') {
-      leastUsedAmount.plus(summaryInfo.transferAmount.value);
-    }
-
-    return BigNumber(currentBalance)
-      .shiftedBy(GasToken.decimals * -1)
-      .isGreaterThanOrEqualTo(leastUsedAmount);
-  }, [gnoProvider, currentAddress, networkFee, summaryInfo]);
-
   const transfer = useCallback(async () => {
     if (isSent || !currentAccount) {
       return false;
     }
 
-    const isNetworkFee = await hasNetworkFee();
-    if (!isNetworkFee) {
-      setIsErrorNetworkFee(true);
+    if (!hasNetworkFee) {
       return false;
     }
 
@@ -239,7 +248,6 @@ const TransferSummaryContainer: React.FC = () => {
 
   const onClickNetworkFeeSave = useCallback(() => {
     useNetworkFeeReturn.save();
-    setIsErrorNetworkFee(false);
     setOpenedNetworkFeeSetting(false);
   }, [useNetworkFeeReturn.save]);
 
@@ -277,7 +285,7 @@ const TransferSummaryContainer: React.FC = () => {
           tokenImage={summaryInfo.tokenMetainfo.image || `${UnknownTokenIcon}`}
           toAddress={summaryInfo.toAddress}
           transferBalance={getTransferBalance()}
-          isErrorNetworkFee={isErrorNetworkFee}
+          isErrorNetworkFee={isNetworkFeeError}
           networkFee={networkFee}
           memo={summaryInfo.memo}
           onClickBack={onClickBack}