fix: add optional chain when get balances

packages/mask/src/plugins/Collectible/SNSAdaptor/MakeOfferDialog.tsx

@@ -36,6 +36,7 @@ import { PluginTraderMessages } from '../../Trader/messages'
 import { Trans } from 'react-i18next'
 import getUnixTime from 'date-fns/getUnixTime'
 import { rightShift, ZERO } from '@masknet/web3-shared-base/utils/number'
+import type { Coin } from '../../Trader/types'
 
 const useStyles = makeStyles()((theme) => {
     return {
@@ -110,7 +111,23 @@ export function MakeOfferDialog(props: MakeOfferDialogProps) {
         })
     }, [asset?.value, token, account, amount, expirationDateTime, isAuction])
 
-    const { openDialog: openSwapDialog } = useRemoteControlledDialog(PluginTraderMessages.swapDialogUpdated)
+    const { setDialog: openSwapDialog } = useRemoteControlledDialog(PluginTraderMessages.swapDialogUpdated)
+
+    const onConvertClick = useCallback(() => {
+        if (!token?.value) return
+        openSwapDialog({
+            open: true,
+            traderProps: {
+                coin: {
+                    id: token.value.address,
+                    name: token.value.name ?? '',
+                    symbol: token.value.symbol ?? '',
+                    contract_address: token.value.address,
+                    decimals: token.value.decimals,
+                } as Coin,
+            },
+        })
+    }, [token.value, openSwapDialog])
 
     useEffect(() => {
         setAmount('')
@@ -246,7 +263,7 @@ export function MakeOfferDialog(props: MakeOfferDialogProps) {
                                         className={classes.button}
                                         variant="contained"
                                         size="large"
-                                        onClick={openSwapDialog}>
+                                        onClick={onConvertClick}>
                                         Convert ETH
                                     </ActionButton>
                                 ) : null}

packages/mask/src/plugins/Trader/SNSAdaptor/trader/TradeForm.tsx

@@ -245,7 +245,7 @@ export const TradeForm = memo<AllTradeFormProps>(
             if (isLessThan(inputAmount, MINIMUM_AMOUNT)) return t('plugin_trade_error_input_amount_less_minimum_amount')
             if (!inputToken || !outputToken) return t('plugin_trader_error_amount_absence')
             if (!trades.length) return t('plugin_trader_error_insufficient_lp')
-            if (inputTokenBalanceAmount.isLessThan(inputTokenTradeAmount.plus(focusedTrade?.value?.fee ?? 0)))
+            if (inputTokenBalanceAmount.isLessThan(inputTokenTradeAmount))
                 return t('plugin_trader_error_insufficient_balance', {
                     symbol: inputToken?.symbol,
                 })

packages/mask/src/plugins/Trader/SNSAdaptor/trader/Trader.tsx

@@ -170,7 +170,7 @@ export function Trader(props: TraderProps) {
     // Query the balance of native tokens on target chain
     useAsync(async () => {
         if (chainId && currentProvider && currentAccount) {
-            const cacheBalance = currentBalancesSettings.value[currentProvider][chainId]
+            const cacheBalance = currentBalancesSettings.value[currentProvider]?.[chainId]
 
             let balance: string