fix(web): stake-simulator

Author: tractorss

web/package.json

@@ -75,6 +75,7 @@
   "dependencies": {
     "@cyntler/react-doc-viewer": "^1.16.3",
     "@kleros/kleros-sdk": "workspace:^",
+    "@kleros/kleros-v2-contracts": "workspace:^",
     "@kleros/ui-components-library": "^2.15.0",
     "@lifi/wallet-management": "^3.0.3",
     "@lifi/widget": "^3.2.0",

web/src/consts/index.ts

@@ -28,6 +28,7 @@ export const ETH_ADDRESS_REGEX = /^0x[a-fA-F0-9]{40}$/;
 export const ETH_SIGNATURE_REGEX = /^0x[a-fA-F0-9]{130}$/;
 
 export const isProductionDeployment = () => import.meta.env.REACT_APP_DEPLOYMENT === "mainnet";
+export const isTestnetDeployment = () => import.meta.env.REACT_APP_DEPLOYMENT === "testnet";
 
 export const isKlerosUniversity = () => getArbitratorType() === ArbitratorTypes.university;
 export const isKlerosNeo = () => getArbitratorType() === ArbitratorTypes.neo;

web/src/hooks/queries/useHomePageBlockQuery.ts

@@ -5,6 +5,7 @@ import { isUndefined } from "utils/index";
 
 import { graphql } from "src/graphql";
 import { HomePageBlockQuery } from "src/graphql/graphql";
+import useGenesisBlock from "../useGenesisBlock";
 export type { HomePageBlockQuery };
 
 const homePageBlockQuery = graphql(`
@@ -58,18 +59,20 @@ export type HomePageBlockStats = {
 };
 
 export const useHomePageBlockQuery = (blockNumber: number | undefined, allTime: boolean) => {
-  const isEnabled = !isUndefined(blockNumber) || allTime;
+  const genesisBlock = useGenesisBlock();
+  const isEnabled = !isUndefined(blockNumber) || allTime || !isUndefined(genesisBlock);
   const { graphqlBatcher } = useGraphqlBatcher();
 
   return useQuery<HomePageBlockStats>({
     queryKey: [`homePageBlockQuery${blockNumber}-${allTime}`],
     enabled: isEnabled,
     staleTime: Infinity,
     queryFn: async () => {
+      const targetBlock = Math.max(blockNumber!, genesisBlock!);
       const data = await graphqlBatcher.fetch({
         id: crypto.randomUUID(),
         document: homePageBlockQuery,
-        variables: { blockNumber },
+        variables: { blockNumber: targetBlock },
       });
 
       return processData(data, allTime);

web/src/hooks/useGenesisBlock.ts

@@ -0,0 +1,36 @@
+import { useEffect, useState } from "react";
+import { isKlerosNeo, isKlerosUniversity, isTestnetDeployment } from "~src/consts";
+
+/**
+ * @returns genesis block for kleros core contract
+ */
+const useGenesisBlock = () => {
+  const [genesisBlock, setGenesisBlock] = useState<number>();
+  useEffect(() => {
+    if (isKlerosUniversity()) {
+      import("@kleros/kleros-v2-contracts/deployments/arbitrumSepoliaDevnet/KlerosCoreUniversity.json").then((json) =>
+        setGenesisBlock(json.receipt.blockNumber)
+      );
+    }
+
+    if (isKlerosNeo()) {
+      import("@kleros/kleros-v2-contracts/deployments/arbitrum/KlerosCoreNeo.json").then((json) =>
+        setGenesisBlock(json.receipt.blockNumber)
+      );
+    }
+
+    if (isTestnetDeployment()) {
+      import("@kleros/kleros-v2-contracts/deployments/arbitrumSepolia/KlerosCore.json").then((json) =>
+        setGenesisBlock(json.receipt.blockNumber)
+      );
+    } else {
+      import("@kleros/kleros-v2-contracts/deployments/arbitrumSepoliaDevnet/KlerosCore.json").then((json) =>
+        setGenesisBlock(json.receipt.blockNumber)
+      );
+    }
+  }, []);
+
+  return genesisBlock;
+};
+
+export default useGenesisBlock;