From 90778b076abfd20e73e977ffc478f342482ee67b Mon Sep 17 00:00:00 2001
From: digiwand <20778143+digiwand@users.noreply.github.com>
Date: Tue, 29 Oct 2024 17:05:54 +0700
Subject: [PATCH] fix: Permit dataTree should not enforce ERC20 18 digit
 decimals if token is not ERC20

---
 .../confirm/info/typed-sign/typed-sign.tsx    | 21 ++++++-------------
 .../hooks/useGetTokenStandardAndDetails.ts    |  6 +++++-
 2 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx b/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx
index c1830b05bd4a..7e6567e01568 100644
--- a/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx
+++ b/ui/pages/confirmations/components/confirm/info/typed-sign/typed-sign.tsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useState } from 'react';
+import React from 'react';
 import { useSelector } from 'react-redux';
 import { isValidAddress } from 'ethereumjs-util';
 
@@ -14,11 +14,11 @@ import {
 import { ConfirmInfoSection } from '../../../../../../components/app/confirm/info/row/section';
 import { useI18nContext } from '../../../../../../hooks/useI18nContext';
 import { SignatureRequestType } from '../../../../types/confirm';
+import { useGetTokenStandardAndDetails } from '../../../../hooks/useGetTokenStandardAndDetails';
 import {
   isOrderSignatureRequest,
   isPermitSignatureRequest,
 } from '../../../../utils';
-import { fetchErc20Decimals } from '../../../../utils/token';
 import { useConfirmContext } from '../../../../context/confirm';
 import { selectUseTransactionSimulations } from '../../../../selectors/preferences';
 import { ConfirmInfoRowTypedSignData } from '../../row/typed-sign-data/typedSignData';
@@ -30,7 +30,6 @@ const TypedSignInfo: React.FC = () => {
   const useTransactionSimulations = useSelector(
     selectUseTransactionSimulations,
   );
-  const [decimals, setDecimals] = useState<number>(0);
 
   if (!currentConfirmation?.msgParams) {
     return null;
@@ -43,18 +42,10 @@ const TypedSignInfo: React.FC = () => {
 
   const isPermit = isPermitSignatureRequest(currentConfirmation);
   const isOrder = isOrderSignatureRequest(currentConfirmation);
-  const chainId = currentConfirmation.chainId as string;
-
-  useEffect(() => {
-    (async () => {
-      if (!isPermit && !isOrder) {
-        return;
-      }
-      const tokenDecimals = await fetchErc20Decimals(verifyingContract);
-      setDecimals(tokenDecimals);
-    })();
-  }, [verifyingContract]);
+  const tokenContract = isPermit || isOrder ? verifyingContract : undefined;
+  const { decimalsNumber } = useGetTokenStandardAndDetails(tokenContract);
 
+  const chainId = currentConfirmation.chainId as string;
   const msgData = currentConfirmation.msgParams?.data as string;
 
   return (
@@ -95,7 +86,7 @@ const TypedSignInfo: React.FC = () => {
         >
           <ConfirmInfoRowTypedSignData
             data={msgData}
-            tokenDecimals={decimals}
+            tokenDecimals={decimalsNumber}
             chainId={chainId}
           />
         </ConfirmInfoRow>
diff --git a/ui/pages/confirmations/hooks/useGetTokenStandardAndDetails.ts b/ui/pages/confirmations/hooks/useGetTokenStandardAndDetails.ts
index 88dfb0a12b9d..b4ad2b5d51ef 100644
--- a/ui/pages/confirmations/hooks/useGetTokenStandardAndDetails.ts
+++ b/ui/pages/confirmations/hooks/useGetTokenStandardAndDetails.ts
@@ -16,8 +16,12 @@ import {
  * @returns
  */
 export const useGetTokenStandardAndDetails = (
-  tokenAddress: Hex | string | undefined,
+  tokenAddress?: Hex | string | undefined,
 ) => {
+  if (!tokenAddress) {
+    return { decimalsNumber: undefined };
+  }
+
   const { value: details } = useAsyncResult<TokenDetailsERC20>(
     async () =>
       (await memoizedGetTokenStandardAndDetails(