reduce popup dismiss time on l2; (#2262)

src/constants/misc.ts

@@ -9,6 +9,10 @@ export const NetworkContextName = 'NETWORK'
 export const DEFAULT_DEADLINE_FROM_NOW = 60 * 30
 export const L2_DEADLINE_FROM_NOW = 60 * 5
 
+// transaction popup dismisal amounts
+export const DEFAULT_TXN_DISMISS_MS = 25000
+export const L2_TXN_DISMISS_MS = 5000
+
 // used for rewards deadlines
 export const BIG_INT_SECONDS_IN_WEEK = JSBI.BigInt(60 * 60 * 24 * 7)
 

src/state/application/hooks.ts

+import { DEFAULT_TXN_DISMISS_MS } from 'constants/misc'
 import { useCallback, useMemo } from 'react'
 import { useAppDispatch, useAppSelector } from 'state/hooks'
 import { useActiveWeb3React } from '../../hooks/web3'
@@ -50,12 +51,12 @@ export function useToggleVoteModal(): () => void {
 }
 
 // returns a function that allows adding a popup
-export function useAddPopup(): (content: PopupContent, key?: string) => void {
+export function useAddPopup(): (content: PopupContent, key?: string, removeAfterMs?: number) => void {
   const dispatch = useAppDispatch()
 
   return useCallback(
-    (content: PopupContent, key?: string) => {
-      dispatch(addPopup({ content, key }))
+    (content: PopupContent, key?: string, removeAfterMs?: number) => {
+      dispatch(addPopup({ content, key, removeAfterMs: removeAfterMs ?? DEFAULT_TXN_DISMISS_MS }))
     },
     [dispatch]
   )

src/state/application/reducer.ts

 import { createReducer, nanoid } from '@reduxjs/toolkit'
+import { DEFAULT_TXN_DISMISS_MS } from 'constants/misc'
 import {
   addPopup,
   PopupContent,
@@ -43,7 +44,7 @@ export default createReducer(initialState, (builder) =>
     .addCase(setOpenModal, (state, action) => {
       state.openModal = action.payload
     })
-    .addCase(addPopup, (state, { payload: { content, key, removeAfterMs = 25000 } }) => {
+    .addCase(addPopup, (state, { payload: { content, key, removeAfterMs = DEFAULT_TXN_DISMISS_MS } }) => {
       state.popupList = (key ? state.popupList.filter((popup) => popup.key !== key) : state.popupList).concat([
         {
           key: key || nanoid(),

src/state/transactions/updater.tsx

+import { DEFAULT_TXN_DISMISS_MS, L2_TXN_DISMISS_MS } from 'constants/misc'
 import { useCallback, useEffect, useMemo } from 'react'
 import { useAppDispatch, useAppSelector } from 'state/hooks'
-import { SupportedChainId } from '../../constants/chains'
+import { L2_CHAIN_IDS, SupportedChainId } from '../../constants/chains'
 import { useActiveWeb3React } from '../../hooks/web3'
 import { retry, RetryableError, RetryOptions } from '../../utils/retry'
 import { updateBlockNumber } from '../application/actions'
@@ -52,6 +53,9 @@ export default function Updater(): null {
   // show popup on confirm
   const addPopup = useAddPopup()
 
+  // speed up popup dismisall time if on L2
+  const isL2 = Boolean(chainId && L2_CHAIN_IDS.includes(chainId))
+
   const getReceipt = useCallback(
     (hash: string) => {
       if (!library || !chainId) throw new Error('No library or chainId')
@@ -106,7 +110,8 @@ export default function Updater(): null {
                     summary: transactions[hash]?.summary,
                   },
                 },
-                hash
+                hash,
+                isL2 ? L2_TXN_DISMISS_MS : DEFAULT_TXN_DISMISS_MS
               )
 
               // the receipt was fetched before the block, fast forward to that block to trigger balance updates
@@ -128,7 +133,7 @@ export default function Updater(): null {
     return () => {
       cancels.forEach((cancel) => cancel())
     }
-  }, [chainId, library, transactions, lastBlockNumber, dispatch, addPopup, getReceipt])
+  }, [chainId, library, transactions, lastBlockNumber, dispatch, addPopup, getReceipt, isL2])
 
   return null
 }