Fix pulling new data

1Hive · Jul 29, 2024 · 429e670 · 429e670
1 parent 70e605f
commit 429e670
Show file tree

Hide file tree

Showing 3 changed files with 58 additions and 43 deletions.
diff --git a/apps/web/components/CheckPassport.tsx b/apps/web/components/CheckPassport.tsx
@@ -1,5 +1,3 @@
-/* eslint-disable @typescript-eslint/no-shadow */
-/* eslint-disable react-hooks/rules-of-hooks */
 "use client";
 import React, { ReactElement, useEffect, useState } from "react";
 import { Address } from "viem";
@@ -37,10 +35,6 @@ export function CheckPassport({
   children,
   enableCheck = true,
 }: CheckPassportProps) {
-  if (!enableCheck) {
-    return <>{children}</>;
-  }
-
   const { address: walletAddr } = useAccount();
   const { ref, openModal, closeModal } = useModal();
   const [score, setScore] = useState<number>(0);
@@ -49,36 +43,37 @@ export function CheckPassport({
   const [isSubmiting, setIsSubmiting] = useState<boolean>(false);
 
   useEffect(() => {
+    if (!enableCheck) {
+      return;
+    }
     if (shouldOpenModal) {
       openModal();
       setShouldOpenModal(false);
     }
   }, [shouldOpenModal]);
 
-  useEffect(() => {
-    if (walletAddr) {
-      refetchPassportUser();
-    }
-  }, [walletAddr]);
-
-  const { data: passportUserData, refetch: refetchPassportUser } =
-    useSubgraphQuery<getPassportUserQuery>({
-      query: getPassportUserDocument,
-      variables: { userId: walletAddr?.toLowerCase() },
-      enabled: !!walletAddr,
-      //TODO: add changeScope = passportUserData
-    });
+  const { data: passportUserData } = useSubgraphQuery<getPassportUserQuery>({
+    query: getPassportUserDocument,
+    variables: { userId: walletAddr?.toLowerCase() },
+    enabled: !!walletAddr && enableCheck,
+    //TODO: add changeScope = passportUserData
+  });
   const passportUser = passportUserData?.passportUser;
 
   const { data: passportStrategyData } =
     useSubgraphQuery<getPassportStrategyQuery>({
       query: getPassportStrategyDocument,
-      variables: { strategyId: strategyAddr.toLowerCase() },
-      //TODO: add changeScope = passportStrategyData
+      variables: { strategyId: strategyAddr },
+      enabled: enableCheck,
+      //TODO: add changeScope = passport
     });
 
   const passportStrategy = passportStrategyData?.passportStrategy;
 
+  if (!enableCheck) {
+    return <>{children}</>;
+  }
+
   //force active passport for testing
   if (!isProd) {
     (window as any).togglePassportEnable = (enable: boolean): string => {
@@ -90,7 +85,6 @@ export function CheckPassport({
       }
     };
   }
-  console.log(passportStrategy, strategyAddr);
 
   const handleCheckPassport = (
     e: React.MouseEvent<HTMLDivElement, MouseEvent>,
@@ -106,7 +100,7 @@ export function CheckPassport({
   };
 
   const checkPassportRequirements = (
-    walletAddr: Address,
+    _walletAddr: Address,
     e: React.MouseEvent<HTMLDivElement, MouseEvent>,
   ) => {
     if (passportUser) {
@@ -119,17 +113,17 @@ export function CheckPassport({
       console.debug("No passport found, Submitting passport...");
       e.preventDefault();
       e.stopPropagation();
-      submitAndWriteScorer(walletAddr);
+      submitAndWriteScorer(_walletAddr);
     }
   };
 
   const checkScoreRequirement = (
-    score: number | string,
-    threshold: number | string,
+    _score: number | string,
+    _threshold: number | string,
     e?: React.MouseEvent<HTMLDivElement, MouseEvent>,
   ) => {
-    score = Number(score);
-    threshold = Number(threshold) / CV_PERCENTAGE_SCALE;
+    _score = Number(_score);
+    _threshold = Number(_threshold) / CV_PERCENTAGE_SCALE;
     if (score > threshold) {
       console.debug("Score meets threshold, moving forward...");
       setScore(score);
@@ -144,14 +138,14 @@ export function CheckPassport({
     }
   };
 
-  const submitAndWriteScorer = async (walletAddr: Address) => {
+  const submitAndWriteScorer = async (_walletAddr: Address) => {
     openModal();
     setIsSubmiting(true);
     try {
-      const passportResponse = await submitPassport(walletAddr);
+      const passportResponse = await submitPassport(_walletAddr);
       console.debug(passportResponse);
       if (passportResponse?.data?.score) {
-        await writeScorer(walletAddr);
+        await writeScorer(_walletAddr);
       }
       // gitcoin passport score no need for formating
       if (passportResponse?.data?.score) {

diff --git a/apps/web/hooks/useSubgraphQuery.ts b/apps/web/hooks/useSubgraphQuery.ts
@@ -62,12 +62,12 @@ export function useSubgraphQuery<
     error: undefined,
   });
 
-  const latestResponse = useRef(response);
+  const latestResponse = useRef({ variables, response });
   const subscritionId = useRef<SubscriptionId>();
   const fetchingRef = useRef(false);
 
   useEffect(() => {
-    latestResponse.current = response; // Update ref on every response change
+    latestResponse.current.response = response; // Update ref on every response change
   }, [response]);
 
   if (!config) {
@@ -101,7 +101,9 @@ export function useSubgraphQuery<
         unsubscribe(subscritionId.current);
       }
       try {
-        toast.dismiss(pendingRefreshToastId);
+        if (toast.isActive(pendingRefreshToastId)) {
+          toast.dismiss(pendingRefreshToastId);
+        }
       } catch (error) {
         // ignore when toast is already dismissed
       }
@@ -157,7 +159,7 @@ export function useSubgraphQuery<
     }
     if (
       result.data &&
-      (!isEqual(result.data, latestResponse.current.data) ||
+      (!isEqual(result.data, latestResponse.current.response.data) ||
         retryCount >= CHANGE_EVENT_MAX_RETRIES ||
         !mounted.current)
     ) {
@@ -185,7 +187,10 @@ export function useSubgraphQuery<
     } else {
       console.debug(
         `⚡ Subgraph result not yet updated, retrying with incremental delays... (retry count: ${retryCount + 1}/${CHANGE_EVENT_MAX_RETRIES})`,
-        { latestResult: latestResponse.current.data, result: result.data },
+        {
+          latestResult: latestResponse.current.response.data,
+          result: result.data,
+        },
       );
       const delay = CHANGE_EVENT_INITIAL_DELAY * 2 ** retryCount;
       await delayAsync(delay);
@@ -194,19 +199,36 @@ export function useSubgraphQuery<
   };
 
   useEffect(() => {
-    if (!enabled || fetching) {
+    if (
+      !enabled ||
+      fetching ||
+      (!!latestResponse.current.response.data &&
+        isEqual(variables, latestResponse.current.variables)) || // Skip if variables are the same
+      !!latestResponse.current.response.error
+    ) {
       return;
     }
-    const init = async () => {
+
+    latestResponse.current.variables = variables; // Update ref on every variable change
+
+    (async () => {
       setFetching(true);
       fetchingRef.current = true;
-      const resp = await fetch();
+      let resp;
+      // If we are already fetching, we should refetch with the toast
+      if (
+        !!latestResponse.current.response.data ||
+        !!latestResponse.current.response.error
+      ) {
+        resp = await refetch();
+      } else {
+        resp = await fetch();
+      }
       setResponse(resp);
       setFetching(false);
       fetchingRef.current = false;
-    };
-    init();
-  }, [enabled]);
+    })();
+  }, [enabled, variables]);
 
   return {
     ...response,

diff --git a/apps/web/hooks/useTransactionNotification.tsx b/apps/web/hooks/useTransactionNotification.tsx
@@ -97,7 +97,6 @@ export const useTransactionNotification = ({
             : "Error processing transaction",
           showClickToExplorer: !!transactionData?.hash,
         };
-        console.log("transactionData?.hash", transactionData?.hash);
         toastOptions = {
           type: "error",
           onClick: clickToExplorer,