Merge pull request #3733 from ethereum/fix_etherscan_1

Misc fix etherscan

apps/etherscan/src/app/app.tsx

@@ -36,6 +36,7 @@ const App = () => {
   const [receipts, setReceipts] = useLocalStorage("receipts", [])
   const [contracts, setContracts] = useState([] as string[])
   const [themeType, setThemeType] = useState("dark" as ThemeType)
+  const timer = useRef(null)
 
   const clientInstanceRef = useRef(clientInstance)
   clientInstanceRef.current = clientInstance
@@ -80,31 +81,35 @@ const App = () => {
   }, [])
 
   useEffect(() => {
-    if (!clientInstance) {
+    let receiptsNotVerified: Receipt[] = receipts.filter((item: Receipt) => {
-      return
+      return item.status === "Pending in queue" || item.status === "Max rate limit reached"
-    }
-
-    const receiptsNotVerified: Receipt[] = receipts.filter((item: Receipt) => {
-      return item.status === "Pending in queue"
     })
 
     if (receiptsNotVerified.length > 0) {
-      const timer1 = setInterval(() => {
+      if (timer.current) {
-        receiptsNotVerified.forEach(async (item) => {
+        clearInterval(timer.current)
-          if (!clientInstanceRef.current) {
+        timer.current = null
-            return {}
       }
+      timer.current = setInterval(async () => {
         const { network, networkId } = await getNetworkName(clientInstanceRef.current)
+        if (!clientInstanceRef.current) {
+          return
+        }
+        
         if (network === "vm") {
-            return {}
+          return
         }
+        let newReceipts = receipts
+        for (const item of receiptsNotVerified) {          
+          await new Promise(r => setTimeout(r, 500)) // avoid api rate limit exceed.
+          console.log('checking receipt', item.guid)
           const status = await getReceiptStatus(
             item.guid,
             apiKey,
             getEtherScanApi(network, networkId)
           )
           if (status.result === "Pass - Verified" || status.result === "Already Verified") {
-            const newReceipts = receipts.map((currentReceipt: Receipt) => {
+            newReceipts = newReceipts.map((currentReceipt: Receipt) => {
               if (currentReceipt.guid === item.guid) {
                 return {
                   ...currentReceipt,
@@ -113,19 +118,19 @@ const App = () => {
               }
               return currentReceipt
             })                      
-
-            clearInterval(timer1)
-            setReceipts(newReceipts)
-
-            return () => {
-              clearInterval(timer1)
           }          
         }
-          return {}
+        receiptsNotVerified = newReceipts.filter((item: Receipt) => {
+          return item.status === "Pending in queue" || item.status === "Max rate limit reached"
         })
-      }, 5000)
+        if (timer.current && receiptsNotVerified.length === 0) {
+          clearInterval(timer.current)
+          timer.current = null
+        }
+        setReceipts(newReceipts)
+      }, 10000)
     }
-  }, [receipts, clientInstance, apiKey, setReceipts])
+  }, [receipts])
 
   return (
     <AppContext.Provider

apps/etherscan/src/app/types/Receipt.ts

@@ -1,4 +1,4 @@
-export type ReceiptStatus = "Pending in queue" | "Pass - Verified" | "Already Verified"
+export type ReceiptStatus = "Pending in queue" | "Pass - Verified" | "Already Verified" | "Max rate limit reached"
 
 export interface Receipt {
   guid: string

apps/etherscan/src/app/views/ReceiptsView.tsx

@@ -6,6 +6,7 @@ import { Receipt } from "../types"
 import { AppContext } from "../AppContext"
 import { SubmitButton } from "../components"
 import { Navigate } from "react-router-dom"
+import { Button } from "react-bootstrap"
 
 interface FormValues {
   receiptGuid: string
@@ -35,7 +36,7 @@ export const ReceiptsView: React.FC = () => {
       )
       setResults({
         succeed: result.status === '1' ? true : false,
-        message: result.result
+        message: result.result || (result.status === '0' ? 'Verification failed' : result.message)
       })
     } catch (error: any) {
       setResults({
@@ -47,7 +48,7 @@ export const ReceiptsView: React.FC = () => {
 
   return (
     <AppContext.Consumer>
-      {({ apiKey, clientInstance, receipts }) => {
+      {({ apiKey, clientInstance, receipts, setReceipts }) => {
         if (!apiKey && clientInstance && clientInstance.call) clientInstance.call('notification' as any, 'toast', 'Please add API key to continue')
         return !apiKey ? (
           <Navigate
@@ -108,6 +109,7 @@ export const ReceiptsView: React.FC = () => {
             />
 
             <ReceiptsTable receipts={receipts} />
+            <Button title="Clear the list of receipt" onClick={() => { setReceipts([]) }} >Clear</Button>
           </div>
         )
       }