Merge pull request #179 from shutter-network/feat/stop-polling

Feat/stop polling
shutter-network · Oct 22, 2024 · a67e4c6 · a67e4c6
2 parents d35e6da + e67618c
commit a67e4c6
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 8 deletions.
diff --git a/frontend/src/hooks/useFetchWithPolling.ts b/frontend/src/hooks/useFetchWithPolling.ts
@@ -5,10 +5,11 @@ const useFetchWithPolling = (url: string, interval: number) => {
     const [data, setData] = useState<any>(null);
     const [loading, setLoading] = useState<boolean>(false); // Change initial loading state
     const [error, setError] = useState<Error | null>(null);
+    const [stopPolling, setStopPolling] = useState(false);
     const backendUrl = process.env.REACT_APP_BACKEND_API
 
     useEffect(() => {
-        if (!url) return;
+        if (!url || stopPolling) return;
 
         const fetchData = async () => {
             try {
@@ -29,9 +30,9 @@ const useFetchWithPolling = (url: string, interval: number) => {
         const intervalId = setInterval(fetchData, interval);
 
         return () => clearInterval(intervalId);
-    }, [url, interval, backendUrl]);
+    }, [url, interval, backendUrl, stopPolling]);
 
-    return { data, loading, error };
+    return { data, loading, error, setStopPolling };
 };
 
 export default useFetchWithPolling;
diff --git a/frontend/src/pages/Transaction.tsx b/frontend/src/pages/Transaction.tsx
@@ -24,19 +24,26 @@ const Transaction: FC = () => {
     const explorerUrl = process.env.REACT_APP_EXPLORER_URL;
     let { txHash } = useParams();
     const [transaction, setTransaction] = useState<TransactionDetails | null>(null);
-    const { data: updatedData, loading, error } = useFetchWithPolling(`/api/transaction/${txHash}`, 10000);
+    const { data: updatedData, loading, error, setStopPolling } = useFetchWithPolling(`/api/transaction/${txHash}`, 10000);
+
+
+    const statusesWithBlockNumber = ['Shielded inclusion'];
+    const statusesWithEffectiveInclusionTime = ['Shielded inclusion', 'Unshielded inclusion']
+    const statusesWithEstimatedeInclusionTime = ['Submitted', 'Pending user transaction']
 
     useEffect(() => {
+        const finalisedStatuses = ['Shielded inclusion', 'Unshielded inclusion', 'Invalid', 'Not included', 'Cannot be decrypted']
+
         if (updatedData) {
             setTransaction(updatedData.message as TransactionDetails);
+            if (transaction? finalisedStatuses.includes(transaction.TxStatus): false){
+                setStopPolling(true)
+            }
         } else {
             setTransaction(null)
         }
-    }, [updatedData]);
+    }, [updatedData, setStopPolling, transaction]);
 
-    const statusesWithBlockNumber = ['Shielded inclusion'];
-    const statusesWithEffectiveInclusionTime = ['Shielded inclusion', 'Unshielded inclusion']
-    const statusesWithEstimatedeInclusionTime = ['Submitted', 'Pending user transaction']
 
     if (!transaction) {
         return (