diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain.tsx
index 2d9d797c46..689fca821b 100644
--- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain.tsx
+++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain.tsx
@@ -27,7 +27,6 @@ import { useNetworksRelationship } from '../../hooks/useNetworksRelationship'
 import { TransferDisabledDialog } from './TransferDisabledDialog'
 import { getBridgeUiConfigForChain } from '../../util/bridgeUiConfig'
 import { useUpdateUSDCTokenData } from './TransferPanelMain/hooks'
-import { Balances } from '../../hooks/TransferPanel/useSelectedTokenBalances'
 import { useBalances } from '../../hooks/useBalances'
 import { DestinationNetworkBox } from './TransferPanelMain/DestinationNetworkBox'
 import { SourceNetworkBox } from './TransferPanelMain/SourceNetworkBox'
@@ -268,13 +267,7 @@ export function TransferPanelMain() {
 
   const destinationAddressOrWalletAddress = destinationAddress || walletAddress
 
-  const {
-    ethParentBalance,
-    erc20ParentBalances,
-    updateErc20ParentBalances,
-    ethChildBalance,
-    updateErc20ChildBalances
-  } = useBalances()
+  const { updateErc20ParentBalances, updateErc20ChildBalances } = useBalances()
 
   const { updateUSDCBalances } = useUpdateUSDCBalances({
     walletAddress: destinationAddressOrWalletAddress
@@ -319,19 +312,6 @@ export function TransferPanelMain() {
     isTeleportMode
   ])
 
-  // TODO: move into a hook (FS-714)
-  // when customFeeTokenBalances is moved to an independent hook file, use `setAmount` directly in useMaxAmount and do not pass `customFeeTokenBalances` as a prop
-  const customFeeTokenBalances: Balances = useMemo(() => {
-    if (!nativeCurrency.isCustom) {
-      return { parentBalance: ethParentBalance, childBalance: ethChildBalance }
-    }
-
-    return {
-      parentBalance: erc20ParentBalances?.[nativeCurrency.address] ?? null,
-      childBalance: ethChildBalance
-    }
-  }, [nativeCurrency, ethParentBalance, ethChildBalance, erc20ParentBalances])
-
   const showUSDCSpecificInfo =
     !isTeleportMode &&
     ((isTokenMainnetUSDC(selectedToken?.address) && isArbitrumOne) ||
@@ -348,17 +328,11 @@ export function TransferPanelMain() {
 
   return (
     <div className="flex flex-col pb-6 lg:gap-y-1">
-      <SourceNetworkBox
-        customFeeTokenBalances={customFeeTokenBalances}
-        showUsdcSpecificInfo={showUSDCSpecificInfo}
-      />
+      <SourceNetworkBox showUsdcSpecificInfo={showUSDCSpecificInfo} />
 
       <SwitchNetworksButton />
 
-      <DestinationNetworkBox
-        customFeeTokenBalances={customFeeTokenBalances}
-        showUsdcSpecificInfo={showUSDCSpecificInfo}
-      />
+      <DestinationNetworkBox showUsdcSpecificInfo={showUSDCSpecificInfo} />
 
       <TransferDisabledDialog />
     </div>
diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx
index 4df5ac0201..d860364eb7 100644
--- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx
+++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/DestinationNetworkBox.tsx
@@ -18,22 +18,18 @@ import { useBalances } from '../../../hooks/useBalances'
 import { CommonAddress } from '../../../util/CommonAddressUtils'
 import { isNetwork } from '../../../util/networks'
 import { EstimatedGas } from '../EstimatedGas'
-import {
-  Balances,
-  useSelectedTokenBalances
-} from '../../../hooks/TransferPanel/useSelectedTokenBalances'
+import { useSelectedTokenBalances } from '../../../hooks/TransferPanel/useSelectedTokenBalances'
 import { useNativeCurrency } from '../../../hooks/useNativeCurrency'
 import { useDialog } from '../../common/Dialog'
 import {
   NetworkButton,
   NetworkSelectionContainer
 } from '../../common/NetworkSelectionContainer'
+import { useNativeCurrencyBalances } from './useNativeCurrencyBalances'
 
 function DestinationNetworkBalance({
-  customFeeTokenBalances,
   showUsdcSpecificInfo
 }: {
-  customFeeTokenBalances: Balances
   showUsdcSpecificInfo: boolean
 }) {
   const {
@@ -46,6 +42,7 @@ function DestinationNetworkBalance({
 
   const { ethParentBalance, ethChildBalance, erc20ChildBalances } =
     useBalances()
+  const nativeCurrencyBalances = useNativeCurrencyBalances()
   const selectedTokenBalances = useSelectedTokenBalances()
 
   const nativeCurrency = useNativeCurrency({ provider: childChainProvider })
@@ -97,11 +94,7 @@ function DestinationNetworkBalance({
     return (
       <TokenBalance
         on={isDepositMode ? NetworkType.childChain : NetworkType.parentChain}
-        balance={
-          isDepositMode
-            ? customFeeTokenBalances.childBalance
-            : customFeeTokenBalances.parentBalance
-        }
+        balance={nativeCurrencyBalances.destinationBalance}
         forToken={nativeCurrency}
         prefix="Balance: "
       />
@@ -110,7 +103,7 @@ function DestinationNetworkBalance({
 
   return (
     <ETHBalance
-      balance={isDepositMode ? ethChildBalance : ethParentBalance}
+      balance={nativeCurrencyBalances.destinationBalance}
       on={isDepositMode ? NetworkType.childChain : NetworkType.parentChain}
       prefix="Balance: "
     />
@@ -118,10 +111,8 @@ function DestinationNetworkBalance({
 }
 
 export function DestinationNetworkBox({
-  customFeeTokenBalances,
   showUsdcSpecificInfo
 }: {
-  customFeeTokenBalances: Balances
   showUsdcSpecificInfo: boolean
 }) {
   const { address: walletAddress } = useAccount()
@@ -148,7 +139,6 @@ export function DestinationNetworkBox({
             {destinationAddressOrWalletAddress &&
               utils.isAddress(destinationAddressOrWalletAddress) && (
                 <DestinationNetworkBalance
-                  customFeeTokenBalances={customFeeTokenBalances}
                   showUsdcSpecificInfo={showUsdcSpecificInfo}
                 />
               )}
diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx
index b41ba30d1c..714e85102b 100644
--- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx
+++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/SourceNetworkBox.tsx
@@ -11,7 +11,6 @@ import { useAppState } from '../../../state'
 import { useNetworks } from '../../../hooks/useNetworks'
 import { useNativeCurrency } from '../../../hooks/useNativeCurrency'
 import { useNetworksRelationship } from '../../../hooks/useNetworksRelationship'
-import { Balances } from '../../../hooks/TransferPanel/useSelectedTokenBalances'
 import {
   ETH_BALANCE_ARTICLE_LINK,
   USDC_LEARN_MORE_LINK
@@ -32,10 +31,8 @@ import { useSelectedTokenDecimals } from '../../../hooks/TransferPanel/useSelect
 import { useBalanceOnSourceChain } from '../../../hooks/useBalanceOnSourceChain'
 
 export function SourceNetworkBox({
-  customFeeTokenBalances,
   showUsdcSpecificInfo
 }: {
-  customFeeTokenBalances: Balances
   showUsdcSpecificInfo: boolean
 }) {
   const [networks] = useNetworks()
@@ -47,9 +44,7 @@ export function SourceNetworkBox({
   const nativeCurrency = useNativeCurrency({ provider: childChainProvider })
   const [{ amount, amount2 }] = useArbQueryParams()
   const { setAmount, setAmount2 } = useSetInputAmount()
-  const { maxAmount, maxAmount2 } = useMaxAmount({
-    customFeeTokenBalances
-  })
+  const { maxAmount, maxAmount2 } = useMaxAmount()
   const [sourceNetworkSelectionDialogProps, openSourceNetworkSelectionDialog] =
     useDialog()
   const isBatchTransferSupported = useIsBatchTransferSupported()
@@ -124,7 +119,6 @@ export function SourceNetworkBox({
             maxAmount={maxAmount}
             isMaxAmount={isMaxAmount}
             decimals={decimals}
-            customFeeTokenBalances={customFeeTokenBalances}
           />
 
           {isBatchTransferSupported && (
@@ -137,7 +131,6 @@ export function SourceNetworkBox({
               maxAmount={maxAmount2}
               isMaxAmount={isMaxAmount2}
               decimals={nativeCurrency.decimals}
-              customFeeTokenBalances={customFeeTokenBalances}
             />
           )}
 
diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/useMaxAmount.ts b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/useMaxAmount.ts
index b9c6d9a14d..f7d6d6b4ce 100644
--- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/useMaxAmount.ts
+++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/useMaxAmount.ts
@@ -4,20 +4,13 @@ import { utils } from 'ethers'
 import { useNetworksRelationship } from '../../../hooks/useNetworksRelationship'
 import { useNetworks } from '../../../hooks/useNetworks'
 import { useAppState } from '../../../state'
-import {
-  Balances,
-  useSelectedTokenBalances
-} from '../../../hooks/TransferPanel/useSelectedTokenBalances'
+import { useSelectedTokenBalances } from '../../../hooks/TransferPanel/useSelectedTokenBalances'
 import { defaultErc20Decimals } from '../../../defaults'
 import { useGasSummary } from '../../../hooks/TransferPanel/useGasSummary'
 import { useNativeCurrency } from '../../../hooks/useNativeCurrency'
-import { useBalances } from '../../../hooks/useBalances'
+import { useNativeCurrencyBalances } from './useNativeCurrencyBalances'
 
-export function useMaxAmount({
-  customFeeTokenBalances
-}: {
-  customFeeTokenBalances: Balances
-}) {
+export function useMaxAmount() {
   const {
     app: { selectedToken }
   } = useAppState()
@@ -26,36 +19,30 @@ export function useMaxAmount({
   const { childChainProvider, isDepositMode } =
     useNetworksRelationship(networks)
   const nativeCurrency = useNativeCurrency({ provider: childChainProvider })
-  const { ethParentBalance, ethChildBalance } = useBalances()
 
   const { estimatedParentChainGasFees, estimatedChildChainGasFees } =
     useGasSummary()
 
+  const nativeCurrencyBalances = useNativeCurrencyBalances()
+
   const nativeCurrencyMaxAmount = useMemo(() => {
-    const customFeeTokenParentBalance = customFeeTokenBalances.parentBalance
+    const nativeCurrencySourceBalance = nativeCurrencyBalances.sourceBalance
+
+    if (!nativeCurrencySourceBalance) {
+      return undefined
+    }
+
     // For custom fee token deposits, we can set the max amount, as the fees will be paid in ETH
-    if (
-      nativeCurrency.isCustom &&
-      isDepositMode &&
-      customFeeTokenParentBalance
-    ) {
+    if (nativeCurrency.isCustom && isDepositMode) {
       return utils.formatUnits(
-        customFeeTokenParentBalance,
+        nativeCurrencySourceBalance,
         nativeCurrency.decimals
       )
     }
 
     // ETH deposits and ETH/custom fee token withdrawals
-    const nativeCurrencyBalance = isDepositMode
-      ? ethParentBalance
-      : ethChildBalance
-
-    if (!nativeCurrencyBalance) {
-      return undefined
-    }
-
     const nativeCurrencyBalanceFormatted = utils.formatUnits(
-      nativeCurrencyBalance,
+      nativeCurrencySourceBalance,
       nativeCurrency.decimals
     )
 
@@ -80,14 +67,12 @@ export function useMaxAmount({
 
     return nativeCurrencyBalanceFormatted
   }, [
-    customFeeTokenBalances.parentBalance,
     estimatedChildChainGasFees,
     estimatedParentChainGasFees,
-    ethChildBalance,
-    ethParentBalance,
     isDepositMode,
     nativeCurrency.decimals,
-    nativeCurrency.isCustom
+    nativeCurrency.isCustom,
+    nativeCurrencyBalances.sourceBalance
   ])
 
   const maxAmount = useMemo(() => {
diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/useNativeCurrencyBalances.ts b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/useNativeCurrencyBalances.ts
new file mode 100644
index 0000000000..799148769a
--- /dev/null
+++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMain/useNativeCurrencyBalances.ts
@@ -0,0 +1,48 @@
+import { useMemo } from 'react'
+import { BigNumber } from 'ethers'
+
+import { useNativeCurrency } from '../../../hooks/useNativeCurrency'
+import { useNetworks } from '../../../hooks/useNetworks'
+import { useNetworksRelationship } from '../../../hooks/useNetworksRelationship'
+import { useBalances } from '../../../hooks/useBalances'
+
+export function useNativeCurrencyBalances(): {
+  sourceBalance: BigNumber | null
+  destinationBalance: BigNumber | null
+} {
+  const [networks] = useNetworks()
+  const { childChainProvider, isDepositMode } =
+    useNetworksRelationship(networks)
+  const nativeCurrency = useNativeCurrency({ provider: childChainProvider })
+
+  const { ethParentBalance, erc20ParentBalances, ethChildBalance } =
+    useBalances()
+
+  return useMemo(() => {
+    if (!nativeCurrency.isCustom) {
+      return {
+        sourceBalance: isDepositMode ? ethParentBalance : ethChildBalance,
+        destinationBalance: isDepositMode ? ethChildBalance : ethParentBalance
+      }
+    }
+
+    const customFeeTokenParentBalance =
+      erc20ParentBalances?.[nativeCurrency.address] ?? null
+    const customFeeTokenChildBalance = ethChildBalance
+
+    return {
+      sourceBalance: isDepositMode
+        ? customFeeTokenParentBalance
+        : customFeeTokenChildBalance,
+      destinationBalance: isDepositMode
+        ? customFeeTokenChildBalance
+        : customFeeTokenParentBalance
+    }
+  }, [
+    nativeCurrency,
+    erc20ParentBalances,
+    ethChildBalance,
+    isDepositMode,
+    ethParentBalance
+  ])
+}
diff --git a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMainInput.tsx b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMainInput.tsx
index c10a404096..a58e79aec7 100644
--- a/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMainInput.tsx
+++ b/packages/arb-token-bridge-ui/src/components/TransferPanel/TransferPanelMainInput.tsx
@@ -10,12 +10,8 @@ import { useMemo } from 'react'
 import { TokenButton, TokenButtonOptions } from './TokenButton'
 import { useNetworks } from '../../hooks/useNetworks'
 import { useNetworksRelationship } from '../../hooks/useNetworksRelationship'
-import {
-  Balances,
-  useSelectedTokenBalances
-} from '../../hooks/TransferPanel/useSelectedTokenBalances'
+import { useSelectedTokenBalances } from '../../hooks/TransferPanel/useSelectedTokenBalances'
 import { useAppState } from '../../state'
-import { useBalances } from '../../hooks/useBalances'
 import { TransferReadinessRichErrorMessage } from './useTransferReadinessUtils'
 import { ExternalLink } from '../common/ExternalLink'
 import { useTransferDisabledDialogStore } from './TransferDisabledDialog'
@@ -24,59 +20,39 @@ import { useNativeCurrency } from '../../hooks/useNativeCurrency'
 import { Loader } from '../common/atoms/Loader'
 import { sanitizeAmountQueryParam } from '../../hooks/useArbQueryParams'
 import { truncateExtraDecimals } from '../../util/NumberUtils'
+import { useNativeCurrencyBalances } from './TransferPanelMain/useNativeCurrencyBalances'
 
 function MaxButton({
-  customFeeTokenBalances,
   className = '',
   ...rest
-}: React.ButtonHTMLAttributes<HTMLButtonElement> & {
-  customFeeTokenBalances: Balances
-}) {
+}: React.ButtonHTMLAttributes<HTMLButtonElement>) {
   const {
     app: { selectedToken }
   } = useAppState()
   const [networks] = useNetworks()
-  const { isDepositMode, childChainProvider } =
-    useNetworksRelationship(networks)
+  const { isDepositMode } = useNetworksRelationship(networks)
 
-  const { ethParentBalance, ethChildBalance } = useBalances()
   const selectedTokenBalances = useSelectedTokenBalances()
-  const nativeCurrency = useNativeCurrency({ provider: childChainProvider })
+  const nativeCurrencyBalances = useNativeCurrencyBalances()
 
   const maxButtonVisible = useMemo(() => {
-    const ethBalance = isDepositMode ? ethParentBalance : ethChildBalance
-    const customFeeTokenBalance = isDepositMode
-      ? customFeeTokenBalances.parentBalance
-      : customFeeTokenBalances.childBalance
+    const nativeCurrencySourceBalance = nativeCurrencyBalances.sourceBalance
+
     const tokenBalance = isDepositMode
       ? selectedTokenBalances.parentBalance
       : selectedTokenBalances.childBalance
 
     if (selectedToken) {
-      if (!tokenBalance) {
-        return false
-      }
-
-      return !tokenBalance.isZero()
+      return tokenBalance && !tokenBalance.isZero()
     }
 
-    if (nativeCurrency.isCustom) {
-      return customFeeTokenBalance && !customFeeTokenBalance.isZero()
-    }
-
-    if (!ethBalance) {
-      return false
-    }
-
-    return !ethBalance.isZero()
+    return nativeCurrencySourceBalance && !nativeCurrencySourceBalance.isZero()
   }, [
+    nativeCurrencyBalances.sourceBalance,
     isDepositMode,
-    ethParentBalance,
-    ethChildBalance,
-    customFeeTokenBalances,
-    selectedTokenBalances,
-    selectedToken,
-    nativeCurrency.isCustom
+    selectedTokenBalances.parentBalance,
+    selectedTokenBalances.childBalance,
+    selectedToken
   ])
 
   if (!maxButtonVisible) {
@@ -98,10 +74,8 @@ function MaxButton({
 }
 
 function SourceChainTokenBalance({
-  customFeeTokenBalances,
   balanceOverride
 }: {
-  customFeeTokenBalances: Balances
   balanceOverride?: AmountInputOptions['balance']
 }) {
   const {
@@ -111,7 +85,7 @@ function SourceChainTokenBalance({
   const { isDepositMode, childChainProvider } =
     useNetworksRelationship(networks)
 
-  const { ethParentBalance, ethChildBalance } = useBalances()
+  const nativeCurrencyBalances = useNativeCurrencyBalances()
   const selectedTokenBalances = useSelectedTokenBalances()
 
   const nativeCurrency = useNativeCurrency({ provider: childChainProvider })
@@ -120,17 +94,9 @@ function SourceChainTokenBalance({
     ? selectedTokenBalances.parentBalance
     : selectedTokenBalances.childBalance
 
-  const ethBalance = isDepositMode ? ethParentBalance : ethChildBalance
-  const customFeeTokenBalance = isDepositMode
-    ? customFeeTokenBalances.parentBalance
-    : customFeeTokenBalances.childBalance
-
-  const nativeCurrencyBalance = nativeCurrency.isCustom
-    ? customFeeTokenBalance
-    : ethBalance
-
   const balance =
-    balanceOverride ?? (selectedToken ? tokenBalance : nativeCurrencyBalance)
+    balanceOverride ??
+    (selectedToken ? tokenBalance : nativeCurrencyBalances.sourceBalance)
 
   const formattedBalance = balance
     ? formatAmount(balance, {
@@ -238,7 +204,6 @@ export type TransferPanelMainInputProps =
     maxButtonOnClick: React.ButtonHTMLAttributes<HTMLButtonElement>['onClick']
     value: string
     options?: AmountInputOptions
-    customFeeTokenBalances: Balances
     maxAmount: string | undefined
     isMaxAmount: boolean
     decimals: number
@@ -254,7 +219,6 @@ export const TransferPanelMainInput = React.memo(
     isMaxAmount,
     decimals,
     options,
-    customFeeTokenBalances,
     ...rest
   }: TransferPanelMainInputProps) => {
     const [localValue, setLocalValue] = useState(value)
@@ -310,14 +274,8 @@ export const TransferPanelMainInput = React.memo(
             <div className="flex flex-col items-end">
               <TokenButton options={options} />
               <div className="flex items-center space-x-1 px-3 pb-2 pt-1">
-                <SourceChainTokenBalance
-                  customFeeTokenBalances={customFeeTokenBalances}
-                  balanceOverride={options?.balance}
-                />
-                <MaxButton
-                  onClick={handleMaxButtonClick}
-                  customFeeTokenBalances={customFeeTokenBalances}
-                />
+                <SourceChainTokenBalance balanceOverride={options?.balance} />
+                <MaxButton onClick={handleMaxButtonClick} />
               </div>
             </div>
           </div>