add disbaled field and fix heimdall fetch

BuidlGuidl · Aug 21, 2024 · ae12dbf · ae12dbf
1 parent 41c6d7d
commit ae12dbf
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 9 deletions.
diff --git a/packages/nextjs/hooks/useFetchContractAbi.ts b/packages/nextjs/hooks/useFetchContractAbi.ts
@@ -11,9 +11,10 @@ type FetchContractAbiParams = {
   contractAddress: string;
   chainId: number;
   publicClient: UsePublicClientReturnType;
+  disabled?: boolean;
 };
 
-const useFetchContractAbi = ({ contractAddress, chainId, publicClient }: FetchContractAbiParams) => {
+const useFetchContractAbi = ({ contractAddress, chainId, publicClient, disabled = false }: FetchContractAbiParams) => {
   const [implementationAddress, setImplementationAddress] = useState<string | null>(null);
 
   const fetchAbi = async () => {
@@ -46,14 +47,15 @@ const useFetchContractAbi = ({ contractAddress, chainId, publicClient }: FetchCo
 
       const abiString = await fetchContractABIFromEtherscan(contractAddress, chainId);
       const parsedAbi = parseAndCorrectJSON(abiString);
+
       return { abi: parsedAbi, address: contractAddress };
     }
   };
 
   const { data, error, isLoading } = useQuery({
     queryKey: ["contractAbi", { contractAddress, chainId: chainId }],
     queryFn: fetchAbi,
-    enabled: isAddress(contractAddress) && chainId !== 31337,
+    enabled: !disabled && isAddress(contractAddress) && chainId !== 31337,
     retry: false,
   });
 

diff --git a/packages/nextjs/pages/[contractAddress]/[network].tsx b/packages/nextjs/pages/[contractAddress]/[network].tsx
@@ -59,12 +59,12 @@ const ContractDetailPage = ({ addressFromUrl, chainIdFromUrl }: ServerSideProps)
   const { contractAddress, network } = router.query as ParsedQueryContractDetailsPage;
   const [localContractAbi, setLocalContractAbi] = useState<string>("");
   const [isUseLocalAbi, setIsUseLocalAbi] = useState(false);
-  const [contractData, setContractData] = useState<ContractData | null>(null);
-  const contractName = contractAddress;
-  const { setMainChainId, chainId, setImplementationAddress } = useAbiNinjaState(state => ({
+  const [localContractData, setLocalContractData] = useState<ContractData | null>(null);
+  const { setMainChainId, chainId, setImplementationAddress, contractAbi } = useAbiNinjaState(state => ({
     setMainChainId: state.setMainChainId,
     chainId: state.mainChainId,
     setImplementationAddress: state.setImplementationAddress,
+    contractAbi: state.contractAbi,
   }));
 
   const { addChain, chains } = useGlobalState(state => ({
@@ -86,9 +86,19 @@ const ContractDetailPage = ({ addressFromUrl, chainIdFromUrl }: ServerSideProps)
     error: fetchError,
     isLoading,
     implementationAddress,
-  } = useFetchContractAbi({ contractAddress, chainId: parseInt(network), publicClient });
+  } = useFetchContractAbi({
+    contractAddress,
+    chainId: parseInt(network),
+    publicClient,
+    disabled: contractAbi.length > 0,
+  });
 
-  const effectiveContractData = isUseLocalAbi && contractData ? contractData : fetchedContractData;
+  const effectiveContractData =
+    contractAbi.length > 0
+      ? { abi: contractAbi, address: contractAddress }
+      : isUseLocalAbi && localContractData
+      ? localContractData
+      : fetchedContractData;
 
   const error = isUseLocalAbi ? null : fetchError;
 
@@ -114,7 +124,7 @@ const ContractDetailPage = ({ addressFromUrl, chainIdFromUrl }: ServerSideProps)
       const parsedAbi = parseAndCorrectJSON(localContractAbi);
       if (parsedAbi) {
         setIsUseLocalAbi(true);
-        setContractData({ abi: parsedAbi, address: contractAddress });
+        setLocalContractData({ abi: parsedAbi, address: contractAddress });
         notification.success("ABI successfully loaded.");
       } else {
         throw new Error("Parsed ABI is null or undefined");
@@ -150,7 +160,7 @@ const ContractDetailPage = ({ addressFromUrl, chainIdFromUrl }: ServerSideProps)
               <span className="loading loading-spinner text-primary h-14 w-14"></span>
             </div>
           ) : effectiveContractData && effectiveContractData?.abi?.length > 0 ? (
-            <ContractUI key={contractName} initialContractData={effectiveContractData} />
+            <ContractUI key={contractAddress} initialContractData={effectiveContractData} />
           ) : (
             <div className="bg-base-200 flex flex-col border shadow-xl rounded-2xl px-6 lg:px-8 m-4 overflow-auto">
               <div className="flex items-center">