diff --git a/packages/mask/src/components/shared/WalletStatusBox/index.tsx b/packages/mask/src/components/shared/WalletStatusBox/index.tsx
index 0d0072c08eb1..79a18da7f4c9 100644
--- a/packages/mask/src/components/shared/WalletStatusBox/index.tsx
+++ b/packages/mask/src/components/shared/WalletStatusBox/index.tsx
@@ -120,12 +120,12 @@ export function WalletStatusBox(props: WalletStatusBox) {
const { classes } = useStyles({
contentBackground: providerDescriptor?.backgroundGradient,
})
- const connection = useWeb3Connection(NetworkPluginID.PLUGIN_EVM)
+ const connection = useWeb3Connection()
const chainId = useChainId()
const account = useAccount()
const wallet = useWallet()
- const { value: balance = '0' } = useBalance()
- const { value: nativeToken } = useNativeToken(NetworkPluginID.PLUGIN_EVM)
+ const { value: balance = '0', loading: loadingBalance } = useBalance()
+ const { value: nativeToken, loading: loadingNativeToken } = useNativeToken()
const networkDescriptor = useNetworkDescriptor()
const { Others } = useWeb3State()
const { value: domain } = useReverseAddress(undefined, account)
@@ -200,30 +200,29 @@ export function WalletStatusBox(props: WalletStatusBox) {
- {networkDescriptor?.networkSupporterPluginID === NetworkPluginID.PLUGIN_EVM ? (
-
-
- {formatBalance(balance, nativeToken?.decimals, 3)} {nativeToken?.symbol}
-
-
- ) : null}
+
+
+
+ {loadingNativeToken || loadingBalance
+ ? '-'
+ : `${formatBalance(balance, nativeToken?.decimals, 3)} ${nativeToken?.symbol}`}
+
+
{!props.disableChange && (
- {networkDescriptor?.networkSupporterPluginID === NetworkPluginID.PLUGIN_EVM ? (
-
- ) : null}
+