refactor: extract status mapping methods

packages/arb-token-bridge-ui/src/hooks/useDeposits.ts

@@ -16,6 +16,7 @@ import {
   shouldIncludeSentTxs,
   shouldIncludeReceivedTxs
 } from '../util/SubgraphUtils'
+import { updateAdditionalDepositData } from '../util/deposits/helpers'
 
 export type CompleteDepositData = {
   deposits: Transaction[]
@@ -27,7 +28,19 @@ export const fetchCompleteDepositData = async (
   depositParams: FetchDepositParams
 ): Promise<CompleteDepositData> => {
   // get the original deposits
-  const deposits = await fetchDeposits(depositParams)
+
+  const depositsWithoutStatuses = await fetchDeposits(depositParams)
+
+  const deposits = await Promise.all(
+    depositsWithoutStatuses.map(depositTx =>
+      updateAdditionalDepositData(
+        depositTx,
+        depositParams.l1Provider,
+        depositParams.l2Provider
+      )
+    )
+  )
+
   // filter out pending deposits
   const pendingDepositsMap = new Map<string, boolean>()
   // get their complete transformed data (so that we get their exact status)

packages/arb-token-bridge-ui/src/hooks/useWithdrawals.ts

@@ -16,6 +16,7 @@ import {
   shouldIncludeSentTxs,
   shouldIncludeReceivedTxs
 } from '../util/SubgraphUtils'
+import { updateAdditionalWithdrawalData } from '../util/withdrawals/helpers'
 
 export type CompleteWithdrawalData = {
   withdrawals: L2ToL1EventResultPlus[]
@@ -27,7 +28,17 @@ const fetchCompleteWithdrawalData = async (
   params: FetchWithdrawalsParams
 ): Promise<CompleteWithdrawalData> => {
   // get the original deposits
-  const withdrawals = await fetchWithdrawals(params)
+  const withdrawalsWithoutStatuses = await fetchWithdrawals(params)
+
+  const withdrawals: L2ToL1EventResultPlus[] = await Promise.all(
+    withdrawalsWithoutStatuses.map(withdrawal =>
+      updateAdditionalWithdrawalData(
+        withdrawal,
+        params.l1Provider,
+        params.l2Provider
+      )
+    )
+  )
 
   // filter out pending withdrawals
   const pendingWithdrawalMap = new Map<string, boolean>()

packages/arb-token-bridge-ui/src/util/deposits/fetchDeposits.ts

@@ -1,6 +1,5 @@
 import { Provider } from '@ethersproject/providers'
 import { utils } from 'ethers'
-import { updateAdditionalDepositData } from './helpers'
 import {
   fetchDepositsFromSubgraph,
   FetchDepositsFromSubgraphResult
@@ -78,7 +77,7 @@ export const fetchDeposits = async ({
     searchString
   })
 
-  const ethDepositsFromSubgraph: Transaction[] = depositsFromSubgraph.map(
+  const mappedDepositsFromSubgraph: Transaction[] = depositsFromSubgraph.map(
     (tx: FetchDepositsFromSubgraphResult) => {
       const isEthDeposit = tx.type === 'EthDeposit'
 
@@ -126,11 +125,5 @@ export const fetchDeposits = async ({
     }
   )
 
-  const finalTransactions: Transaction[] = await Promise.all(
-    ethDepositsFromSubgraph.map(depositTx =>
-      updateAdditionalDepositData(depositTx, l1Provider, l2Provider)
-    )
-  )
-
-  return finalTransactions
+  return mappedDepositsFromSubgraph
 }

packages/arb-token-bridge-ui/src/util/withdrawals/fetchWithdrawals.ts

@@ -9,8 +9,7 @@ import {
   isTokenWithdrawal,
   mapETHWithdrawalToL2ToL1EventResult,
   mapTokenWithdrawalFromEventLogsToL2ToL1EventResult,
-  mapWithdrawalToL2ToL1EventResult,
-  updateAdditionalWithdrawalData
+  mapWithdrawalToL2ToL1EventResult
 } from './helpers'
 import { fetchWithdrawalsFromSubgraph } from './fetchWithdrawalsFromSubgraph'
 import { tryFetchLatestSubgraphBlockNumber } from '../SubgraphUtils'
@@ -177,13 +176,7 @@ export const fetchWithdrawals = async ({
     .filter((msg): msg is L2ToL1EventResultPlus => typeof msg !== 'undefined')
     .sort(sortByTimestampDescending)
 
-  const finalL2ToL1Txns: L2ToL1EventResultPlus[] = await Promise.all(
-    l2ToL1Txns.map(withdrawal =>
-      updateAdditionalWithdrawalData(withdrawal, l1Provider, l2Provider)
-    )
-  )
-
-  return finalL2ToL1Txns.map(tx => ({
+  return l2ToL1Txns.map(tx => ({
     ...tx,
 
     // attach the chain ids to the withdrawal object