feat: calculates fast confirmation times

packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelSummary.tsx

@@ -1,4 +1,5 @@
 import React, { useMemo } from 'react'
+import { InformationCircleIcon } from '@heroicons/react/24/outline'
 import { twMerge } from 'tailwind-merge'
 
 import { formatAmount } from '../../util/NumberUtils'
@@ -13,10 +14,12 @@ import { useNetworksRelationship } from '../../hooks/useNetworksRelationship'
 import { NativeCurrencyPrice, useIsBridgingEth } from './NativeCurrencyPrice'
 import { useAppState } from '../../state'
 import { Loader } from '../common/atoms/Loader'
+import { Tooltip } from '../common/Tooltip'
 import { isTokenNativeUSDC } from '../../util/TokenUtils'
 import { NoteBox } from '../common/NoteBox'
 import { DISABLED_CHAIN_IDS } from './useTransferReadiness'
 import { useIsBatchTransferSupported } from '../../hooks/TransferPanel/useIsBatchTransferSupported'
+import { getConfirmationTime } from '../../util/WithdrawalUtils'
 
 export type TransferPanelSummaryToken = {
   symbol: string
@@ -259,6 +262,37 @@ export function TransferPanelSummary({ token }: TransferPanelSummaryProps) {
           )}
         </span>
       </div>
+      {(isDestinationChainArbitrumOne || isDestinationChainArbitrumSepolia) && (
+        <div
+          className={twMerge(
+            'grid grid-cols-[260px_auto] items-center text-sm font-light'
+          )}
+        >
+          <ConfirmationTimeInfo chainId={networks.sourceChain.id} />
+        </div>
+      )}
     </TransferPanelSummaryContainer>
   )
 }
+
+function ConfirmationTimeInfo({ chainId }: { chainId: number }) {
+  const { confirmationTimeInReadableFormat, isDefaultConfirmationTime } =
+    getConfirmationTime(chainId)
+  return (
+    <>
+      <span>Confirmation time:</span>
+      <span className="flex items-center font-medium">
+        {confirmationTimeInReadableFormat}
+        {!isDefaultConfirmationTime && (
+          <Tooltip
+            content={
+              'Fast Withdrawals relies on a committee of validators. In the event of a committee outage, your withdrawal falls back to the 7 day challenge period secured by Arbitrum Fraud Proofs.'
+            }
+          >
+            <InformationCircleIcon className="ml-1 h-3 w-3" />
+          </Tooltip>
+        )}
+      </span>
+    </>
+  )
+}

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

@@ -9,6 +9,7 @@ import {
   getL1BlockTime,
   isNetwork
 } from '../util/networks'
+import { getConfirmationTime } from '../util/WithdrawalUtils'
 
 const DEPOSIT_TIME_MINUTES = {
   mainnet: 15,
@@ -121,6 +122,12 @@ export function getWithdrawalConfirmationDate({
   // For new txs createdAt won't be defined yet, we default to the current time in that case
   const createdAtDate = createdAt ? dayjs(createdAt) : dayjs()
 
+  const { confirmationTimeInSeconds, fastWithdrawalActive } =
+    getConfirmationTime(withdrawalFromChainId)
+  if (fastWithdrawalActive && confirmationTimeInSeconds) {
+    return createdAtDate.add(confirmationTimeInSeconds, 'second')
+  }
+
   const baseChainId = getBaseChainIdByChainId({
     chainId: withdrawalFromChainId
   })

packages/arb-token-bridge-ui/src/util/WithdrawalUtils.ts

@@ -9,6 +9,7 @@ import { BigNumber } from 'ethers'
 import { GasEstimates } from '../hooks/arbTokenBridge.types'
 import { Address } from './AddressUtils'
 import { captureSentryErrorWithExtraData } from './SentryUtils'
+import { getBridgeUiConfigForChain } from './bridgeUiConfig'
 
 export async function withdrawInitTxEstimateGas({
   amount,
@@ -105,3 +106,54 @@ export async function withdrawInitTxEstimateGas({
     }
   }
 }
+
+const SECONDS_IN_MINUTE = 60
+const SECONDS_IN_HOUR = 3600
+const SECONDS_IN_DAY = 86400
+const DEFAULT_CONFIRMATION_TIME = 7 * SECONDS_IN_DAY
+const DEFAULT_FAST_WITHDRAWAL_TIME = SECONDS_IN_DAY
+
+function formatDuration(seconds: number): string {
+  if (seconds < SECONDS_IN_MINUTE) return `${seconds} seconds`
+  if (seconds < SECONDS_IN_HOUR)
+    return `${Math.round(seconds / SECONDS_IN_MINUTE)} minutes`
+  if (seconds < SECONDS_IN_DAY)
+    return `${Math.round(seconds / SECONDS_IN_HOUR)} hours`
+  return `${Math.round(seconds / SECONDS_IN_DAY)} days`
+}
+
+/**
+ * Calculate confirmation time for bridge transactions.
+ * @param {number} chainId - The ID of the parent chain.
+ */
+export function getConfirmationTime(chainId: number) {
+  const { fastWithdrawalTime, fastWithdrawalActive } =
+    getBridgeUiConfigForChain(chainId)
+
+  const isDefaultConfirmationTime = !fastWithdrawalActive
+  const isDefaultFastWithdrawal = fastWithdrawalActive && !fastWithdrawalTime
+  const isCustomFastWithdrawal = fastWithdrawalActive && !!fastWithdrawalTime
+
+  let confirmationTimeInSeconds: number
+
+  if (isDefaultFastWithdrawal) {
+    confirmationTimeInSeconds = DEFAULT_FAST_WITHDRAWAL_TIME
+  } else if (isCustomFastWithdrawal) {
+    confirmationTimeInSeconds = fastWithdrawalTime / 1000
+  } else {
+    confirmationTimeInSeconds = DEFAULT_CONFIRMATION_TIME
+  }
+
+  const confirmationTimeInReadableFormat = formatDuration(
+    confirmationTimeInSeconds
+  )
+
+  return {
+    fastWithdrawalActive,
+    isDefaultConfirmationTime,
+    isDefaultFastWithdrawal,
+    isCustomFastWithdrawal,
+    confirmationTimeInSeconds,
+    confirmationTimeInReadableFormat
+  }
+}

packages/arb-token-bridge-ui/src/util/orbitChainsList.ts

@@ -16,6 +16,8 @@ export type BridgeUiConfig = {
     description?: string
   }
   nativeTokenData?: NativeCurrencyBase
+  fastWithdrawalTime?: number
+  fastWithdrawalActive?: boolean
 }
 
 export type OrbitChainConfig = ChainWithRpcUrl & {
@@ -435,7 +437,9 @@ export const orbitMainnets: {
         symbol: 'DMT',
         decimals: 18,
         logoUrl: '/images/SankoLogo.png'
-      }
+      },
+      fastWithdrawalTime: 900000, // 15 minutes
+      fastWithdrawalActive: true
     }
   }
 }
@@ -538,7 +542,9 @@ export const orbitTestnets: { [key in number]: OrbitChainConfig } = {
         symbol: 'BERD',
         decimals: 18,
         logoUrl: ''
-      }
+      },
+      fastWithdrawalTime: 1800000, // 30 minutes
+      fastWithdrawalActive: true
     }
   },
   12325: {