requested changes

Author: aditya520

components/EntropyApiDataFetcher.tsx

@@ -1,15 +1,20 @@
 import { useEffect, useState } from "react";
 import * as chains from "viem-chains/chains";
 import { EntropyDeploymentsConfig } from "./EntropyDeploymentsConfig";
+import { z } from "zod";
 
-interface ApiChainConfig {
-  name: string;
-  network_id: number;
-  contract_addr: string;
-  reveal_delay_blocks: number;
-  gas_limit: number;
-  default_fee: number;
-}
+const ApiChainConfigSchema = z.object({
+  name: z.string(),
+  network_id: z.number(),
+  contract_addr: z.string(),
+  reveal_delay_blocks: z.number(),
+  gas_limit: z.number(),
+  default_fee: z.number(),
+});
+
+type ApiChainConfig = z.infer<typeof ApiChainConfigSchema>;
+
+const entropyDeploymentsSchema = z.array(ApiChainConfigSchema);
 
 export interface EntropyDeployment {
   address: string;
@@ -21,71 +26,58 @@ export interface EntropyDeployment {
   nativeCurrency?: string;
 }
 
+const getChainData = (network_id: number) => {
+  return Object.values(chains).find((chain) => chain.id === network_id);
+};
+
+const transformChainData = (chain: ApiChainConfig): [string, EntropyDeployment] => {
+  const chainData = getChainData(chain.network_id);
+  const configOverride = EntropyDeploymentsConfig[chain.network_id];
+
+  const deployment: EntropyDeployment = {
+    address: chain.contract_addr,
+    delay: `${chain.reveal_delay_blocks} block${
+      chain.reveal_delay_blocks !== 1 ? "s" : ""
+    }`,
+    gasLimit: chain.gas_limit.toLocaleString(),
+    default_fee: chain.default_fee,
+    // Use config override first, then viem data, then undefined
+    rpc: configOverride?.rpc ?? chainData?.rpcUrls?.default?.http?.[0],
+    explorer:
+      configOverride?.explorer ?? chainData?.blockExplorers?.default?.url,
+    nativeCurrency:
+      configOverride?.nativeCurrency ?? chainData?.nativeCurrency?.symbol,
+  };
+
+  return [chain.name, deployment];
+};
+
 const fetchEntropyDeployments = async (
   url: string
-): Promise<ApiChainConfig[]> => {
+): Promise<Record<string, EntropyDeployment>> => {
   try {
     const response = await fetch(url);
-    const data = await response.json();
-    return data as ApiChainConfig[];
+    const apiData = entropyDeploymentsSchema.parse(await response.json());
+    
+    return Object.fromEntries(apiData.map(transformChainData));
   } catch (error) {
     console.error("Error fetching entropy deployments:", error);
-    return [];
+    return {};
   }
 };
 
-export const getChainData = (network_id: number) => {
-  for (const chain of Object.values(chains)) {
-    if (chain.id === network_id) {
-      return chain;
-    }
-  }
-  return null;
-};
-
-interface EntropyApiDataFetcherProps {
-  url: string;
-  children: (
-    data: Record<string, EntropyDeployment>,
-    isLoading: boolean,
-    error: string | null
-  ) => React.ReactNode;
-}
-
-export function EntropyApiDataFetcher({
-  url,
-  children,
-}: EntropyApiDataFetcherProps) {
+export function useEntropyApiData(url: string) {
   const [data, setData] = useState<Record<string, EntropyDeployment>>({});
   const [isLoading, setIsLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
 
   useEffect(() => {
-    fetchEntropyDeployments(url)
-      .then((apiData: ApiChainConfig[]) => {
-        const transformedData = apiData.reduce((acc, chain) => {
-          const chainData = getChainData(chain.network_id);
-          const configOverride = EntropyDeploymentsConfig[chain.network_id];
-
-          acc[chain.name] = {
-            address: chain.contract_addr,
-            delay: `${chain.reveal_delay_blocks} block${
-              chain.reveal_delay_blocks !== 1 ? "s" : ""
-            }`,
-            gasLimit: chain.gas_limit.toLocaleString(),
-            default_fee: chain.default_fee,
-            // Use config override first, then viem data, then undefined
-            rpc: configOverride?.rpc || chainData?.rpcUrls?.default?.http?.[0],
-            explorer:
-              configOverride?.explorer ||
-              chainData?.blockExplorers?.default?.url,
-            nativeCurrency:
-              configOverride?.nativeCurrency ||
-              chainData?.nativeCurrency?.symbol,
-          };
-          return acc;
-        }, {} as Record<string, EntropyDeployment>);
+    setData({});
+    setIsLoading(true);
+    setError(null);
 
+    fetchEntropyDeployments(url)
+      .then((transformedData) => {
         setData(transformedData);
         setIsLoading(false);
       })
@@ -95,5 +87,5 @@ export function EntropyApiDataFetcher({
       });
   }, [url]);
 
-  return <>{children(data, isLoading, error)}</>;
+  return { data, isLoading, error };
 }

components/EntropyDeployments.tsx

@@ -0,0 +1,22 @@
+import { useEntropyApiData } from "./EntropyApiDataFetcher";
+import EntropyDeploymentTable from "./EntropyDeploymentTable";
+
+interface EntropyDeploymentsProps {
+  networkName: string;
+  url: string;
+  showReveal?: boolean;
+}
+
+export function EntropyDeployments({ networkName, url, showReveal = false }: EntropyDeploymentsProps) {
+  const { isLoading, error, data } = useEntropyApiData(url);
+
+  if (isLoading) {
+    return <p>Loading {networkName} data...</p>;
+  }
+
+  if (error) {
+    return <p>Error loading {networkName} data: {error}</p>;
+  }
+
+  return <EntropyDeploymentTable deployments={data} showReveal={showReveal} />;
+} 

components/EntropyFeeTable.tsx

@@ -71,7 +71,7 @@ const FeeTable = ({
                 "Loading..."
               ) : (
                 <>
-                  {fees[name]} <b>{deployment.nativeCurrency || "ETH"}</b>
+                  {fees[name]} <b>{deployment.nativeCurrency ?? "ETH"}</b>
                 </>
               )}
             </StyledTd>

components/EntropyFees.tsx

@@ -0,0 +1,21 @@
+import { useEntropyApiData } from "./EntropyApiDataFetcher";
+import EntropyFeeTable from "./EntropyFeeTable";
+
+interface EntropyFeesProps {
+  networkName: string;
+  url: string;
+}
+
+export function EntropyFees({ networkName, url }: EntropyFeesProps) {
+  const { isLoading, error, data } = useEntropyApiData(url);
+
+  if (isLoading) {
+    return <p>Loading {networkName} fees...</p>;
+  }
+
+  if (error) {
+    return <p>Error loading {networkName} fees: {error}</p>;
+  }
+
+  return <EntropyFeeTable deployments={data} />;
+} 

package-lock.json

@@ -38,7 +38,8 @@
     "toml": "^3.0.0",
     "viem": "^0.3.50",
     "viem-chains": "npm:viem@^2.32.1",
-    "wagmi": "^1.2.0"
+    "wagmi": "^1.2.0",
+    "zod": "^3.25.76"
   },
   "devDependencies": {
     "@pythnetwork/pyth-sdk-solidity": "^2.3.0",

package.json

@@ -1,22 +1,11 @@
-import { EntropyApiDataFetcher } from "../../components/EntropyApiDataFetcher";
-import EntropyDeploymentTable from "../../components/EntropyDeploymentTable";
+import EntropyDeployments from "../../components/EntropyDeployments";
 import { FORTUNA_API_URLS } from "../../components/constants";
 
 # Entropy Contract Addresses on EVM
 
 ## Mainnets
 
-<EntropyApiDataFetcher url={FORTUNA_API_URLS.MAINNET}>
-  {(data, isLoading, error) =>
-    isLoading ? (
-      <p>Loading mainnet data...</p>
-    ) : error ? (
-      <p>Error loading mainnet data: {error}</p>
-    ) : (
-      <EntropyDeploymentTable deployments={data} showReveal={true} />
-    )
-  }
-</EntropyApiDataFetcher>
+<EntropyDeployments networkName="mainnet" url={FORTUNA_API_URLS.MAINNET} showReveal={true} />
 
 **The default provider for above mainnet chains is `0x52DeaA1c84233F7bb8C8A45baeDE41091c616506`.**
 
@@ -27,17 +16,7 @@ The default provider fulfills the request by sending a transaction with a gas li
 
 ## Testnets
 
-<EntropyApiDataFetcher url={FORTUNA_API_URLS.TESTNET}>
-  {(data, isLoading, error) =>
-    isLoading ? (
-      <p>Loading testnet data...</p>
-    ) : error ? (
-      <p>Error loading testnet data: {error}</p>
-    ) : (
-      <EntropyDeploymentTable deployments={data} showReveal={true} />
-    )
-  }
-</EntropyApiDataFetcher>
+<EntropyDeployments networkName="testnet" url={FORTUNA_API_URLS.TESTNET} showReveal={true} />
 
 **The default provider for above testnet chains is `0x6CC14824Ea2918f5De5C2f75A9Da968ad4BD6344`.**
 

pages/entropy/contract-addresses.mdx

@@ -1,5 +1,4 @@
-import EntropyFeeTable from "../../components/EntropyFeeTable";
-import { EntropyApiDataFetcher } from "../../components/EntropyApiDataFetcher";
+import EntropyFees from "../../components/EntropyFees";
 import { FORTUNA_API_URLS } from "../../components/constants";
 import { Callout } from "nextra/components";
 
@@ -12,17 +11,7 @@ Note that the fees shown below will vary over time with prevailing gas prices on
   The fees for mainnet are dynamically set. Always use the on-chain method `entropy.getFeeV2(){:solidity}` to get the current fee.
 </Callout>
 
-<EntropyApiDataFetcher url={FORTUNA_API_URLS.MAINNET}>
-  {(data, isLoading, error) =>
-    isLoading ? (
-      <p>Loading mainnet fees...</p>
-    ) : error ? (
-      <p>Error loading mainnet fees: {error}</p>
-    ) : (
-      <EntropyFeeTable deployments={data} />
-    )
-  }
-</EntropyApiDataFetcher>
+<EntropyFees networkName="mainnet" url={FORTUNA_API_URLS.MAINNET} />
 
 ## Testnet
 
@@ -31,14 +20,4 @@ Note that the fees shown below will vary over time with prevailing gas prices on
   fees.
 </Callout>
 
-<EntropyApiDataFetcher url={FORTUNA_API_URLS.TESTNET}>
-  {(data, isLoading, error) =>
-    isLoading ? (
-      <p>Loading testnet fees...</p>
-    ) : error ? (
-      <p>Error loading testnet fees: {error}</p>
-    ) : (
-      <EntropyFeeTable deployments={data} />
-    )
-  }
-</EntropyApiDataFetcher>
+<EntropyFees networkName="testnet" url={FORTUNA_API_URLS.TESTNET} />