fix(coordinator): address PR comments

Author: NicoSerranoP

constants.ts

@@ -13,7 +13,7 @@ export const NEXT_PUBLIC_SECONDS_PER_BLOCK = Number(process.env.NEXT_PUBLIC_SECO
 
 // MACI Coordinator service
 export const PUBLIC_COORDINATOR_SERVICE_URL = process.env.NEXT_PUBLIC_COORDINATOR_SERVICE_URL ?? "";
-export const NAVIGATION_AFTER_SCHEDULE_DELAY_SECONDS = 0.3;
+export const NAVIGATION_AFTER_SCHEDULE_DELAY_SECONDS = 0.2;
 
 // UX improvements
 export const NEXT_MINIMUM_START_DELAY_IN_SECONDS = Number(process.env.NEXT_MINIMUM_START_DELAY_IN_SECONDS ?? 30);

plugins/maciVoting/components/PollCard.tsx

@@ -17,7 +17,7 @@ const PollCard = ({ pollId }: { pollId: bigint }) => {
   const [error, setError] = useState<string | undefined>(undefined);
   const [voteOption, setVoteOption] = useState<VoteOption | undefined>(undefined);
 
-  const { data: { voteStartDate, tallied, voteEnded, disabled, results } = {} } = useGetPollData(pollId);
+  const { data: { voteStartDate, voteEndDate, tallied, voteEnded, disabled, results } = {} } = useGetPollData(pollId);
   const { joinPollFunction, hasJoinedPoll, joinedPollData, isLoading: isLoadingJoinedPoll } = useJoinPoll(pollId);
   const { voteFunction } = useVote();
 
@@ -58,14 +58,23 @@ const PollCard = ({ pollId }: { pollId: bigint }) => {
       setVoteOption(option);
       await voteFunction(pollId, pollStateIndex, voiceCredits, option)
         .catch((error) => {
-          setError(error.message);
+          let message: string | undefined;
+          if (error.message.includes("0xa47dcd48")) {
+            const endDate = voteEndDate;
+            message = `The voting period finished at ${unixTimestampToDate(endDate!)}. You can no longer submit a vote.`;
+          }
+          if (error.message.includes("0x256eadc8")) {
+            const startDate = voteStartDate;
+            message = `The voting period has not begun. It will start at ${unixTimestampToDate(startDate!)}`;
+          }
+          setError(message);
         })
         .finally(() => {
           setVoteOption(undefined);
           setIsLoading(false);
         });
     },
-    [joinedPollData, pollId, voteFunction]
+    [joinedPollData, pollId, voteEndDate, voteFunction, voteStartDate]
   );
 
   const buttonMessage = useMemo(() => {
@@ -159,8 +168,8 @@ const PollCard = ({ pollId }: { pollId: bigint }) => {
         </div>
         <div className="flex flex-col justify-between gap-y-2">
           <p>
-            Submit your vote anonymously to the poll using any wallet. Results will be tallied after the voting period
-            ends.
+            Submit your vote anonymously to the poll <b>using any wallet</b>. Results will be tallied after the voting
+            period ends.
           </p>
           {voteStartDate &&
             voteStartDate > Math.round(Date.now() / 1000) &&

plugins/maciVoting/contexts/MaciContext.tsx

@@ -1,4 +1,4 @@
-import { PUBLIC_MACI_ADDRESS } from "@/constants";
+import { PUBLIC_CHAIN, PUBLIC_MACI_ADDRESS } from "@/constants";
 import { useAlerts } from "@/context/Alerts";
 import { Keypair, PrivateKey } from "@maci-protocol/domainobjs";
 import {
@@ -9,9 +9,10 @@ import {
 } from "@maci-protocol/sdk/browser";
 import { createContext, useCallback, useEffect, useMemo, useState, type ReactNode } from "react";
 import { keccak256, stringToHex } from "viem";
-import { useAccount, useSignMessage } from "wagmi";
-import { useEthersSigner } from "../hooks/useEthersSigner";
+import { useAccount, usePublicClient, useSignMessage } from "wagmi";
+import { clientToSigner, useEthersSigner } from "../hooks/useEthersSigner";
 import { type IMaciContextType } from "./types";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 
 export const DEFAULT_SG_DATA = "0x0000000000000000000000000000000000000000000000000000000000000000";
 export const DEFAULT_IVCP_DATA = "0x0000000000000000000000000000000000000000000000000000000000000000";
@@ -29,28 +30,38 @@ export const MaciProvider = ({ children }: { children: ReactNode }) => {
   const [maciKeypair, setMaciKeypair] = useState<Keypair | undefined>();
   const [stateIndex, setStateIndex] = useState<string | undefined>(undefined);
 
-  // Artifacts
-  const [artifacts, setArtifacts] = useState<
-    Awaited<ReturnType<typeof downloadPollJoiningArtifactsBrowser>> | undefined
-  >();
-
   // Wallet variables
   const { isConnected } = useAccount();
+  const publicClient = usePublicClient({ chainId: PUBLIC_CHAIN.id });
+  const queryClient = useQueryClient();
   const { signMessageAsync } = useSignMessage();
   const signer = useEthersSigner();
 
+  const { data: artifacts } = useQuery({
+    queryKey: ["artifacts"],
+    queryFn: async () => {
+      return await downloadPollJoiningArtifactsBrowser({
+        testing: true,
+        stateTreeDepth: 10,
+      });
+    },
+    enabled: isConnected && !!signer && !!publicClient,
+    refetchOnWindowFocus: false,
+    staleTime: Infinity,
+    gcTime: Infinity,
+  });
+
   // Functions
-  const deleteKeypair = useCallback(() => {
+  const deleteKeypair = useCallback(async () => {
     localStorage.removeItem("maciPrivateKey");
 
     setIsRegistered(false);
     setMaciKeypair(undefined);
     setStateIndex(undefined);
-
-    setArtifacts(undefined);
-
     setError(undefined);
-  }, []);
+
+    await queryClient.invalidateQueries({ queryKey: ["artifacts"] });
+  }, [queryClient]);
 
   const onSignup = useCallback(async () => {
     setError(undefined);
@@ -154,17 +165,20 @@ export const MaciProvider = ({ children }: { children: ReactNode }) => {
   // check if user is registered
   useEffect(() => {
     (async () => {
-      if (!isConnected || !signer || !maciKeypair) {
+      if (!isConnected || !publicClient || !maciKeypair) {
         setIsRegistered(false);
         setStateIndex(undefined);
         return;
       }
 
       try {
+        // this is a read-only operation so we read using public client to avoid signer's cache
+        const publicSigner = clientToSigner(publicClient);
+
         const { isRegistered: _isRegistered, stateIndex: _stateIndex } = await getSignedupUserData({
           maciAddress: PUBLIC_MACI_ADDRESS,
           maciPublicKey: maciKeypair.publicKey.serialize(),
-          signer,
+          signer: publicSigner,
         });
 
         setIsRegistered(_isRegistered);
@@ -175,18 +189,7 @@ export const MaciProvider = ({ children }: { children: ReactNode }) => {
         setError("Error checking if user is registered and generating state tree");
       }
     })();
-  }, [isConnected, maciKeypair, signer, stateIndex]);
-
-  // download poll joining artifacts and store them in state
-  useEffect(() => {
-    (async () => {
-      const downloadedArtifacts = await downloadPollJoiningArtifactsBrowser({
-        testing: true,
-        stateTreeDepth: 10,
-      });
-      setArtifacts(downloadedArtifacts);
-    })();
-  }, []);
+  }, [isConnected, maciKeypair, publicClient, stateIndex]);
 
   const value = useMemo<IMaciContextType>(
     () => ({

plugins/maciVoting/hooks/poll/useJoinPoll.tsx

@@ -1,23 +1,20 @@
-import { PUBLIC_MACI_ADDRESS, PUBLIC_MACI_DEPLOYMENT_BLOCK } from "@/constants";
+import { PUBLIC_CHAIN, PUBLIC_MACI_ADDRESS, PUBLIC_MACI_DEPLOYMENT_BLOCK } from "@/constants";
 import { generateMaciStateTreeWithEndKey, getJoinedUserData, joinPoll } from "@maci-protocol/sdk/browser";
 import { useCallback, useMemo, useState } from "react";
 import { usePublicClient } from "wagmi";
 import { DEFAULT_IVCP_DATA, DEFAULT_SG_DATA } from "../../contexts/MaciContext";
 import { clientToSigner, useEthersSigner } from "../useEthersSigner";
 import { useMaci } from "../useMaci";
-import { type IJoinPollData } from "../../contexts/types";
 import { useQuery, useQueryClient } from "@tanstack/react-query";
 
 export const useJoinPoll = (pollId?: bigint) => {
   const signer = useEthersSigner();
-  const publicClient = usePublicClient();
+  const publicClient = usePublicClient({ chainId: PUBLIC_CHAIN.id });
   const queryClient = useQueryClient();
   const { maciKeypair, isRegistered, stateIndex, artifacts } = useMaci();
 
   const [isLoading, setIsLoading] = useState(false);
   const [error, setError] = useState<string | undefined>();
-  // Keep track of newly joined poll data that will be returned when joining a poll
-  const [newlyJoinedPollData, setNewlyJoinedPollData] = useState<IJoinPollData | undefined>();
 
   // Query key for consistent cache access
   const joinedUserQueryKey = useMemo(
@@ -35,6 +32,7 @@ export const useJoinPoll = (pollId?: bigint) => {
 
       setIsLoading(true);
       try {
+        // this is a read-only operation so we read using public client to avoid signer's cache
         const publicSigner = clientToSigner(publicClient);
 
         const joinedUser = await getJoinedUserData({
@@ -72,10 +70,6 @@ export const useJoinPoll = (pollId?: bigint) => {
       return;
     }
 
-    if (joinedPollData) {
-      setNewlyJoinedPollData(joinedPollData);
-    }
-
     setIsLoading(true);
     setError(undefined);
 
@@ -103,9 +97,8 @@ export const useJoinPoll = (pollId?: bigint) => {
       });
 
       if (joinedData) {
-        setNewlyJoinedPollData(joinedData);
         // After successfully joining, manually invalidate the query to trigger a refetch
-        queryClient.invalidateQueries({ queryKey: joinedUserQueryKey });
+        await queryClient.invalidateQueries({ queryKey: joinedUserQueryKey });
       }
     } catch (error: any) {
       if (error.message?.includes("0xa3281672")) {
@@ -119,27 +112,13 @@ export const useJoinPoll = (pollId?: bigint) => {
     } finally {
       setIsLoading(false);
     }
-  }, [
-    pollId,
-    signer,
-    maciKeypair,
-    isRegistered,
-    artifacts,
-    joinedPollData,
-    stateIndex,
-    queryClient,
-    joinedUserQueryKey,
-  ]);
-
-  // Use the query data or the newly joined data if available
-  const effectiveJoinedPollData = newlyJoinedPollData ?? joinedPollData;
-  const effectiveHasJoinedPoll = Boolean(effectiveJoinedPollData);
+  }, [pollId, signer, maciKeypair, isRegistered, artifacts, stateIndex, queryClient, joinedUserQueryKey]);
 
   return {
     isLoading: isLoading || isLoadingQuery,
     error,
-    hasJoinedPoll: effectiveHasJoinedPoll,
-    joinedPollData: effectiveJoinedPollData,
+    hasJoinedPoll: Boolean(joinedPollData),
+    joinedPollData: joinedPollData,
     joinPollFunction,
   };
 };

plugins/maciVoting/hooks/useEthersSigner.tsx

@@ -13,6 +13,8 @@ export function clientToSigner(client: Client<Transport, Chain, Account> | Publi
   };
 
   const provider = new BrowserProvider(transport, network);
+
+  // in some cases we need a signer from a public client (which could not necessarily have an account.address linked). That is why we use zeroAddress as a fallback
   const signer = new JsonRpcSigner(provider, account ? account.address : zeroAddress);
   return signer;
 }

plugins/maciVoting/hooks/useGetPollData.tsx

@@ -19,6 +19,7 @@ export const useGetPollData = (pollId?: string | bigint) => {
     queryFn: async () => {
       if (!publicClient) return;
 
+      // this is a read-only operation so we read using public client to avoid signer's cache
       const publicSigner = clientToSigner(publicClient);
 
       const { startDate, endDate, isMerged } = await getPoll({

plugins/maciVoting/hooks/useProposal.tsx

@@ -53,7 +53,7 @@ export function useProposal(proposalId: string, autoRefresh = false) {
   // Creation event
   useEffect(() => {
     (async () => {
-      if (!proposalData || !publicClient) return;
+      if (!proposalData || !publicClient || proposalData.pollId === 0n) return;
 
       const snapshotBlock = BigInt(proposalData.parameters.snapshotBlock);
 
@@ -74,11 +74,8 @@ export function useProposal(proposalId: string, autoRefresh = false) {
         setProposalCreationEvent(log.args);
         setMetadata(fromHex(log.args.metadata as Hex, "string"));
       } catch (error) {
-        // we use proposalId = 0 for starting proposal creation
-        if (proposalId !== "0") {
-          // eslint-disable-next-line no-console
-          console.error("Could not fetch the proposal details", error);
-        }
+        // eslint-disable-next-line no-console
+        console.error("Could not fetch the proposal details:", error);
       }
     })();
   }, [proposalData, proposalId, publicClient]);