Merge pull request #1627 from kleros/fix/fix-dispute-template-previews-in-dev-ui

fix(web): fix-dispute-template-presets-in-dev-ui

Author: jaybuidl

web/src/pages/DisputeTemplateView/FetchDisputeRequestInput.tsx

@@ -46,12 +46,12 @@ const StyledA = styled.a`
 const presets = [
   {
     title: "Escrow",
-    txnHash: "0xfa24d589a0c26c71d06f6e0a151460783f70b51c174a08c04768f458c7817cd1",
+    txnHash: "0x85e60cb407c9a38e625263cc762ff4283d01f38201825e1d20109d8664cfa7d4",
     chainId: 421614,
   },
   {
     title: "Curated Lists",
-    txnHash: "0xd9ab4908fc5447d532bc287f49e2f2beb754fc62024b806f05a9abf706be7c06",
+    txnHash: "0x6e5ad6f7436ef8570b50b0fbec76a11ccedbed85030c670e59d8f6617a499108",
     chainId: 421614,
   },
   {

web/src/utils/getDisputeRequestParamsFromTxn.ts

@@ -1,12 +1,33 @@
-import { getPublicClient } from "@wagmi/core";
-import { GetTransactionReceiptReturnType, decodeEventLog, getEventSelector } from "viem";
+import { GetTransactionReceiptReturnType, createPublicClient, decodeEventLog, getEventSelector, http } from "viem";
+import * as chains from "viem/chains";
 
 import { iArbitrableV2Abi } from "hooks/contracts/generated";
 import { isUndefined } from "utils/index";
 
+/**
+ * Gets the chain object for the given chain id.
+ * @param chainId - Chain id of the target EVM chain.
+ * @returns Viem's chain object.
+ */
+const getChain = (chainId: number) => {
+  for (const chain of Object.values(chains)) {
+    if ("id" in chain) {
+      if (chain.id === chainId) {
+        return chain;
+      }
+    }
+  }
+
+  throw new Error(`Chain with id ${chainId} not found`);
+};
+
+// Warning  : do not import this in any pages except DisputeTemplatePreview, this has a large bundle size.
 export const getDisputeRequestParamsFromTxn = async (hash: `0x${string}`, chainId: number) => {
   try {
-    const publicClient = getPublicClient({ chainId });
+    const publicClient = createPublicClient({
+      chain: getChain(chainId),
+      transport: http(),
+    });
 
     const txn: GetTransactionReceiptReturnType = await publicClient.getTransactionReceipt({
       hash,
@@ -28,6 +49,8 @@ export const getDisputeRequestParamsFromTxn = async (hash: `0x${string}`, chainI
       _arbitrable: disputeRequestEvent.address,
     };
   } catch (e) {
+    console.log("Error getting txn :", { e });
+
     return undefined;
   }
 };