Merge pull request #80 from HausDAO/feat/connextHook

Feat/connext hook

src/hooks/useConnext.tsx

@@ -0,0 +1,84 @@
+import { useDebugValue } from "react";
+import { useQuery } from "react-query";
+
+import { EthAddress, fromWei } from "@daohaus/utils";
+
+import { create, SdkConfig } from "@connext/sdk";
+import { TARGETS } from "../targetDao";
+import { HAUS_RPC } from "@daohaus/keychain-utils";
+
+
+
+const fetch = async ({
+  originDomain,
+  destinationDomain,
+  chainID,
+}: {
+  originDomain: string;
+  destinationDomain: string;
+  chainID: string;
+}) => {
+  const params = {
+    originDomain: originDomain,
+    destinationDomain: destinationDomain,
+  };
+
+  const sdkConfig: SdkConfig = {
+    signerAddress: TARGETS.DAO_ADDRESS,
+    // Use `mainnet` when you're ready...
+    network: "testnet",
+    // Add more chains here! Use mainnet domains if `network: mainnet`.
+    // This information can be found at https://docs.connext.network/resources/supported-chains
+    chains: {
+      [originDomain]: {
+
+        providers: [HAUS_RPC[TARGETS.NETWORK_ID as keyof typeof HAUS_RPC]],
+
+
+      },
+      [destinationDomain]: {
+        providers: [HAUS_RPC[chainID as keyof typeof HAUS_RPC]],
+      },
+    },
+  };
+
+  try {
+    const { sdkBase } = await create(sdkConfig);
+    console.log("sdkBase: ", sdkBase);
+    const rFee = await sdkBase.estimateRelayerFee(params);
+    console.log("relayerFee: ", fromWei(rFee.toString()));
+
+    return {
+      relayerFeeWei: rFee.toString() || "0",
+      relayerFee: fromWei(rFee.toString() || "0") ,
+    };
+  } catch (error: any) {
+    console.error(error);
+    throw new Error(error?.message as string);
+  }
+};
+
+export const useConnext = ({
+  originDomain,
+  destinationDomain,
+  chainID,
+}: {
+  originDomain: string;
+  destinationDomain: string;
+  chainID: string;
+}) => {
+  const { data, ...rest } = useQuery(
+    ["connextData", { chainID, destinationDomain }],
+    () =>
+      fetch({
+        originDomain,
+        destinationDomain,
+        chainID,
+      }),
+    { enabled: !!destinationDomain }
+  );
+
+  useDebugValue(data ?? "Loading");
+
+  return { data, ...rest };
+};

src/pages/ReplicaConfig.tsx

@@ -11,6 +11,7 @@ import { fromWei } from "@daohaus/utils";
 import { useParams } from "react-router-dom";
 import { MolochFields } from "@daohaus/moloch-v3-fields";
 import { AppFieldLookup } from "../legos/fieldConfig";
+import { useConnext } from "../hooks/useConnext";
 
 const sdkConfig: SdkConfig = {
   signerAddress: "0x2b8aA42fFb2c9c7B9f0B1e1b935F7D8331b6dC7c",
@@ -39,26 +40,19 @@ export const ReplicaConfig = () => {
     destinationDomain: "1735356532",
   }
 
+  const originDomainID = TARGETS.DOMAIN_ID;
+
   const domainID = TARGETS.REPLICA_CHAIN_ADDRESSES.find(
     (r) => r.NETWORK_ID === chainID
   )?.DOMAIN_ID;
 
-  console.log('domainID: ', domainID);
-
-
-
-  useEffect(() => {
-    const run = async () => {
-      const { sdkBase } = await create(sdkConfig);
-      console.log('sdkBase: ', sdkBase);
-      const rFee = await sdkBase.estimateRelayerFee(params);
-      console.log('relayerFee: ', fromWei(rFee.toString()));
-      setRelayerFee(rFee.toString());
-    }
-    run();
-  })
+  const { isIdle, isLoading, error, data, refetch } = useConnext({
+    originDomain: originDomainID,
+    destinationDomain: domainID || "",
+    chainID: chainID || "",
+  });
 
-  if(!relayerFee || !chainID) return (
+  if(!data) return (
     <SingleColumnLayout title="Replicants">
       <ParLg>Loading...</ParLg> 
     </SingleColumnLayout>
@@ -72,7 +66,7 @@ export const ReplicaConfig = () => {
         targetNetwork={TARGETS.NETWORK_ID}
         customFields={{ ...MolochFields, ...AppFieldLookup }}
         defaultValues={{
-          relayFee: relayerFee,
+          relayFee: data?.relayerFee,
           chainID: chainID,
           domainID: domainID,
         }