diff --git a/packages/mask/src/extension/options-page/DashboardComponents/ActionButton.tsx b/packages/mask/src/extension/options-page/DashboardComponents/ActionButton.tsx
index 449c69a66a4d..d01f32ccdfcf 100644
--- a/packages/mask/src/extension/options-page/DashboardComponents/ActionButton.tsx
+++ b/packages/mask/src/extension/options-page/DashboardComponents/ActionButton.tsx
@@ -114,9 +114,8 @@ export function ActionButtonPromise(props: ActionButtonPromiseProps) {
     } = props
 
     const [state, setState] = useState<ActionButtonPromiseState>('init')
-    const basicClass = classNames(classes.button, b.className)
-    const completeClass = classNames(basicClass, classes.success)
-    const failClass = classNames(basicClass, classes.failed)
+    const completeClass = classNames(classes.success, b.className)
+    const failClass = classNames(classes.failed, b.className)
 
     const run = () => {
         setState('wait')
@@ -145,16 +144,7 @@ export function ActionButtonPromise(props: ActionButtonPromiseProps) {
     }, [executor, noUpdateEffect])
 
     if (state === 'wait')
-        return (
-            <Button
-                {...b}
-                startIcon={circle}
-                disabled={!waitingOnClick}
-                children={waiting}
-                onClick={cancel}
-                className={basicClass}
-            />
-        )
+        return <Button {...b} startIcon={circle} disabled={!waitingOnClick} children={waiting} onClick={cancel} />
     if (state === 'complete')
         return (
             <Button
@@ -177,7 +167,7 @@ export function ActionButtonPromise(props: ActionButtonPromiseProps) {
                 onClick={failClick}
             />
         )
-    return <Button {...b} children={init} onClick={run} className={basicClass} />
+    return <Button {...b} children={init} onClick={run} />
 }
 const useStyles = makeStyles()({
     success: {
@@ -194,7 +184,4 @@ const useStyles = makeStyles()({
             backgroundColor: red[700],
         },
     },
-    button: {
-        borderRadius: 999,
-    },
 })
diff --git a/packages/mask/src/plugins/Collectible/SNSAdaptor/OpenSea/ActionBar.tsx b/packages/mask/src/plugins/Collectible/SNSAdaptor/OpenSea/ActionBar.tsx
index dd1557b11135..cce3789f3c96 100644
--- a/packages/mask/src/plugins/Collectible/SNSAdaptor/OpenSea/ActionBar.tsx
+++ b/packages/mask/src/plugins/Collectible/SNSAdaptor/OpenSea/ActionBar.tsx
@@ -8,9 +8,10 @@ import { MakeOfferDialog } from './MakeOfferDialog'
 import { PostListingDialog } from './PostListingDialog'
 import { CheckoutDialog } from './CheckoutDialog'
 import { ChainBoundary } from '../../../../web3/UI/ChainBoundary'
-import { useAccount, useChainId } from '@masknet/plugin-infra/web3'
+import { useAccount } from '@masknet/plugin-infra/web3'
 import { isSameAddress, NetworkPluginID } from '@masknet/web3-shared-base'
 import { useAssetOrder } from '../../hooks/useAssetOrder'
+import { ChainId } from '@masknet/web3-shared-evm'
 
 const useStyles = makeStyles()((theme) => {
     return {
@@ -35,7 +36,6 @@ export function ActionBar(props: ActionBarProps) {
     const { classes } = useStyles()
     const { asset } = CollectibleState.useContainer()
     const account = useAccount(NetworkPluginID.PLUGIN_EVM)
-    const chainId = useChainId(NetworkPluginID.PLUGIN_EVM)
     const { value: assetOrder } = useAssetOrder(asset.value?.address, asset.value?.tokenId)
 
     const {
@@ -54,7 +54,10 @@ export function ActionBar(props: ActionBarProps) {
     const isOwner = isSameAddress(asset.value.owner?.address, account)
     return (
         <Box className={classes.root} sx={{ padding: 1.5 }} display="flex" justifyContent="center">
-            <ChainBoundary expectedPluginID={NetworkPluginID.PLUGIN_EVM} expectedChainId={chainId} renderInTimeline>
+            <ChainBoundary
+                expectedPluginID={NetworkPluginID.PLUGIN_EVM}
+                expectedChainId={ChainId.Mainnet}
+                renderInTimeline>
                 {!isOwner && asset.value.auction ? (
                     <ActionButton
                         className={classes.button}
diff --git a/packages/mask/src/plugins/Trader/trader/native/useTradeCallback.ts b/packages/mask/src/plugins/Trader/trader/native/useTradeCallback.ts
index 9163d4298326..42c4e80693c5 100644
--- a/packages/mask/src/plugins/Trader/trader/native/useTradeCallback.ts
+++ b/packages/mask/src/plugins/Trader/trader/native/useTradeCallback.ts
@@ -24,5 +24,5 @@ export function useTradeCallback(trade: TradeComputed<NativeTokenWrapper> | null
             result = await unwrapCallback(false, tradeAmount)
         }
         return result
-    }, [wrapCallback, unwrapCallback])
+    }, [wrapCallback, unwrapCallback, trade])
 }
diff --git a/packages/plugin-infra/src/web3-state/Provider.ts b/packages/plugin-infra/src/web3-state/Provider.ts
index bf6a8898ce01..fc9c1e5464b3 100644
--- a/packages/plugin-infra/src/web3-state/Provider.ts
+++ b/packages/plugin-infra/src/web3-state/Provider.ts
@@ -72,7 +72,7 @@ export class ProviderState<
         this.setupProviders()
     }
 
-    private setupSubscriptions() {
+    protected setupSubscriptions() {
         const site = this.site
         if (!site) return
 
diff --git a/packages/plugin-infra/src/web3/useFungibleAssets.ts b/packages/plugin-infra/src/web3/useFungibleAssets.ts
index c68fc1bfcf7a..9ad4595ab5c0 100644
--- a/packages/plugin-infra/src/web3/useFungibleAssets.ts
+++ b/packages/plugin-infra/src/web3/useFungibleAssets.ts
@@ -45,6 +45,7 @@ export function useFungibleAssets<S extends 'all' | void = void, T extends Netwo
             })
         })
         const assets = await asyncIteratorToArray(iterator)
+
         const filteredAssets = assets.length && schemaType ? assets.filter((x) => x.schema === schemaType) : assets
 
         return filteredAssets
diff --git a/packages/plugins/EVM/src/state/Provider.ts b/packages/plugins/EVM/src/state/Provider.ts
index 3cb9c019728f..6bed3a8cc4cc 100644
--- a/packages/plugins/EVM/src/state/Provider.ts
+++ b/packages/plugins/EVM/src/state/Provider.ts
@@ -12,7 +12,8 @@ import {
     isValidChainId,
 } from '@masknet/web3-shared-evm'
 import { Providers } from './Connection/provider'
-import { ExtensionSite } from '@masknet/shared-base'
+import { ExtensionSite, mapSubscription, mergeSubscription } from '@masknet/shared-base'
+import { getEnumAsArray } from '@dimensiondev/kit'
 
 export class Provider extends ProviderState<ChainId, ProviderType, NetworkType, Web3Provider, Web3> {
     constructor(context: Plugin.Shared.SharedContext) {
@@ -23,9 +24,42 @@ export class Provider extends ProviderState<ChainId, ProviderType, NetworkType,
             getDefaultChainId: () => ChainId.Mainnet,
             getDefaultNetworkType: () => NetworkType.Ethereum,
             getDefaultProviderType: (site) =>
-                site === ExtensionSite.Popup ? ProviderType.MaskWallet : ProviderType.None,
+                getEnumAsArray(ExtensionSite).some(({ value }) => value === site)
+                    ? ProviderType.MaskWallet
+                    : ProviderType.None,
             getNetworkTypeFromChainId: (chainId: ChainId) =>
                 chainResolver.chainNetworkType(chainId) ?? NetworkType.Ethereum,
         })
     }
+
+    override setupSubscriptions() {
+        const site = this.site
+        if (!site) return
+
+        this.providerType = mapSubscription(this.storage.providers.subscription, (providers) => providers[site])
+
+        this.chainId = mapSubscription(
+            mergeSubscription(this.providerType, this.storage.accounts.subscription, this.context.chainId),
+            ([providerType, accounts, chainId]) => {
+                if (providerType === ProviderType.MaskWallet) return chainId
+                return accounts[providerType].chainId
+            },
+        )
+        this.account = mapSubscription(
+            mergeSubscription(this.providerType, this.storage.accounts.subscription, this.context.account),
+            ([providerType, accounts, maskAccount]) => {
+                if (providerType === ProviderType.MaskWallet) return maskAccount
+
+                return accounts[providerType].account
+            },
+        )
+        this.networkType = mapSubscription(
+            mergeSubscription(this.providerType, this.storage.accounts.subscription, this.context.chainId),
+            ([providerType, accounts, chainId]) => {
+                if (providerType === ProviderType.MaskWallet) return this.options.getNetworkTypeFromChainId(chainId)
+
+                return this.options.getNetworkTypeFromChainId(accounts[providerType].chainId)
+            },
+        )
+    }
 }
diff --git a/packages/web3-providers/src/debank/index.ts b/packages/web3-providers/src/debank/index.ts
index c0e264d10d3f..1eff214e7f8f 100644
--- a/packages/web3-providers/src/debank/index.ts
+++ b/packages/web3-providers/src/debank/index.ts
@@ -11,6 +11,7 @@ import {
 import { formatAssets, formatTransactions } from './format'
 import type { WalletTokenRecord, HistoryResponse, GasPriceDictResponse } from './type'
 import type { FungibleTokenAPI, HistoryAPI, GasOptionAPI } from '../types'
+import { getAllEVMNativeAssets } from '../helpers'
 
 const DEBANK_API = 'https://api.debank.com'
 const DEBANK_OPEN_API = 'https://openapi.debank.com'
@@ -73,6 +74,9 @@ export class DeBankAPI
             }),
         )
         const result = (await response.json()) as WalletTokenRecord[] | undefined
+        if (!result?.length) {
+            return createPageable(getAllEVMNativeAssets(), createIndicator(options?.indicator))
+        }
         try {
             return createPageable(
                 formatAssets(
diff --git a/packages/web3-providers/src/helpers.ts b/packages/web3-providers/src/helpers.ts
index 9dc385ce6bea..46d4c2353f6d 100644
--- a/packages/web3-providers/src/helpers.ts
+++ b/packages/web3-providers/src/helpers.ts
@@ -1,4 +1,5 @@
 import urlcat from 'urlcat'
+import { createNativeToken, NETWORK_DESCRIPTORS } from '@masknet/web3-shared-evm'
 
 export function isProxyENV() {
     try {
@@ -18,3 +19,10 @@ const CORS_PROXY = 'https://cors.r2d2.to'
 export function courier(url: string) {
     return urlcat(`${CORS_PROXY}?:url`, { url })
 }
+
+export function getAllEVMNativeAssets() {
+    return NETWORK_DESCRIPTORS.filter((x) => x.isMainnet).map((x) => ({
+        ...createNativeToken(x.chainId),
+        balance: '0',
+    }))
+}
diff --git a/packages/web3-providers/src/zerion/index.ts b/packages/web3-providers/src/zerion/index.ts
index 3c72631d0e69..1d782edd53a8 100644
--- a/packages/web3-providers/src/zerion/index.ts
+++ b/packages/web3-providers/src/zerion/index.ts
@@ -14,6 +14,7 @@ import type {
 } from './type'
 import { formatAssets, formatTransactions } from './format'
 import type { FungibleTokenAPI, HistoryAPI } from '../types'
+import { getAllEVMNativeAssets } from '../helpers'
 
 const ZERION_API = 'wss://api-v4.zerion.io'
 // cspell:disable-next-line
@@ -130,6 +131,7 @@ export class ZerionAPI
             result = [...result, ...assets.flat()]
         }
 
+        if (!result.length) return createPageable(getAllEVMNativeAssets(), createIndicator(options?.indicator))
         return createPageable(result, createIndicator(options?.indicator))
     }