diff --git a/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx b/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx
index 953099cb5bf..c3d62656297 100644
--- a/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx
+++ b/src/components/MultiHopTrade/components/TradeInput/TradeInput.tsx
@@ -26,7 +26,11 @@ import { getMixPanel } from 'lib/mixpanel/mixPanelSingleton'
import { MixPanelEvent } from 'lib/mixpanel/types'
import { isKeplrHDWallet } from 'lib/utils'
import { selectIsSnapshotApiQueriesPending, selectVotingPower } from 'state/apis/snapshot/selectors'
-import { selectHasUserEnteredAmount, selectInputSellAsset } from 'state/slices/selectors'
+import {
+ selectHasUserEnteredAmount,
+ selectInputSellAsset,
+ selectIsAccountMetadataLoading,
+} from 'state/slices/selectors'
import {
selectActiveQuote,
selectFirstHop,
@@ -77,6 +81,7 @@ export const TradeInput = ({ isCompact, tradeInputRef }: TradeInputProps) => {
const [shouldShowArbitrumBridgeAcknowledgement, setShouldShowArbitrumBridgeAcknowledgement] =
useState(false)
const isKeplr = useMemo(() => !!wallet && isKeplrHDWallet(wallet), [wallet])
+ const isAccountMetadataLoading = useAppSelector(selectIsAccountMetadataLoading)
const sellAsset = useAppSelector(selectInputSellAsset)
const tradeQuoteStep = useAppSelector(selectFirstHop)
@@ -113,6 +118,7 @@ export const TradeInput = ({ isCompact, tradeInputRef }: TradeInputProps) => {
const isLoading = useMemo(
() =>
+ isAccountMetadataLoading ||
(!isAnyTradeQuoteLoaded && !isTradeQuoteRequestAborted) ||
isConfirmationLoading ||
// Only consider snapshot API queries as pending if we don't have voting power yet
@@ -124,6 +130,7 @@ export const TradeInput = ({ isCompact, tradeInputRef }: TradeInputProps) => {
isTradeQuoteRequestAborted,
isConfirmationLoading,
isVotingPowerLoading,
+ isAccountMetadataLoading,
],
)
diff --git a/src/components/MultiHopTrade/components/TradeInput/components/ConfirmSummary.tsx b/src/components/MultiHopTrade/components/TradeInput/components/ConfirmSummary.tsx
index 48bdb4e068f..81f7d3b4b84 100644
--- a/src/components/MultiHopTrade/components/TradeInput/components/ConfirmSummary.tsx
+++ b/src/components/MultiHopTrade/components/TradeInput/components/ConfirmSummary.tsx
@@ -238,6 +238,10 @@ export const ConfirmSummary = ({
translate,
])
+ const buttonText = useMemo(() => {
+ return
+ }, [quoteStatusTranslation])
+
return (
<>
>
diff --git a/src/components/MultiHopTrade/components/TradeInput/components/ManualAddressEntry.tsx b/src/components/MultiHopTrade/components/TradeInput/components/ManualAddressEntry.tsx
index 32188bdb4fe..e5047ce7157 100644
--- a/src/components/MultiHopTrade/components/TradeInput/components/ManualAddressEntry.tsx
+++ b/src/components/MultiHopTrade/components/TradeInput/components/ManualAddressEntry.tsx
@@ -15,7 +15,7 @@ import { useModal } from 'hooks/useModal/useModal'
import { useWallet } from 'hooks/useWallet/useWallet'
import { useWalletSupportsChain } from 'hooks/useWalletSupportsChain/useWalletSupportsChain'
import { parseAddressInputWithChainId } from 'lib/address/address'
-import { selectAccountIdsByAssetId } from 'state/slices/selectors'
+import { selectAccountIdsByAssetId, selectIsAccountMetadataLoading } from 'state/slices/selectors'
import { selectInputBuyAsset } from 'state/slices/tradeInputSlice/selectors'
import { tradeInput } from 'state/slices/tradeInputSlice/tradeInputSlice'
import { useAppDispatch, useAppSelector } from 'state/store'
@@ -28,6 +28,7 @@ type ManualAddressEntryProps = {
export const ManualAddressEntry: FC = memo(
({ description, shouldForceManualAddressEntry }: ManualAddressEntryProps): JSX.Element | null => {
const dispatch = useAppDispatch()
+ const isAccountMetadataLoading = useAppSelector(selectIsAccountMetadataLoading)
const {
formState: { isValidating },
@@ -57,6 +58,7 @@ export const ManualAddressEntry: FC = memo(
const { manualReceiveAddress } = useReceiveAddress(useReceiveAddressArgs)
const shouldShowManualReceiveAddressInput = useMemo(() => {
+ if (isAccountMetadataLoading) return false
if (shouldForceManualAddressEntry) return true
if (manualReceiveAddress) return false
// Ledger "supports" all chains, but may not have them connected
@@ -69,6 +71,7 @@ export const ManualAddressEntry: FC = memo(
wallet,
walletSupportsBuyAssetChain,
shouldForceManualAddressEntry,
+ isAccountMetadataLoading,
])
const chainAdapterManager = getChainAdapterManager()
diff --git a/src/components/MultiHopTrade/components/TradeInput/components/RecipientAddress.tsx b/src/components/MultiHopTrade/components/TradeInput/components/RecipientAddress.tsx
index b03ab45f711..04e1dbacb52 100644
--- a/src/components/MultiHopTrade/components/TradeInput/components/RecipientAddress.tsx
+++ b/src/components/MultiHopTrade/components/TradeInput/components/RecipientAddress.tsx
@@ -25,7 +25,7 @@ import type { TextPropTypes } from 'components/Text/Text'
import { useWallet } from 'hooks/useWallet/useWallet'
import { parseAddressInputWithChainId } from 'lib/address/address'
import { middleEllipsis } from 'lib/utils'
-import { selectInputBuyAsset } from 'state/slices/selectors'
+import { selectInputBuyAsset, selectIsAccountMetadataLoading } from 'state/slices/selectors'
import { tradeInput } from 'state/slices/tradeInputSlice/tradeInputSlice'
import { useAppDispatch, useAppSelector } from 'state/store'
@@ -42,6 +42,7 @@ export const RecipientAddress: React.FC = ({
}) => {
const translate = useTranslate()
const dispatch = useAppDispatch()
+ const isAccountMetadataLoading = useAppSelector(selectIsAccountMetadataLoading)
const wallet = useWallet().state.wallet
const useReceiveAddressArgs = useMemo(
() => ({
@@ -154,7 +155,7 @@ export const RecipientAddress: React.FC = ({
const handleFormSubmit = useMemo(() => handleSubmit(onSubmit), [handleSubmit, onSubmit])
- if (!receiveAddress || shouldForceManualAddressEntry) return null
+ if (!receiveAddress || shouldForceManualAddressEntry || isAccountMetadataLoading) return null
return isRecipientAddressEditing ? (