fix: updated XCM UI for Pink token

src/components/assets/transfer/XcmBridge.vue

@@ -168,6 +168,16 @@
             </span>
           </div>
         </div>
+        <div v-if="token.metadata.symbol === 'PINK' && isWithdrawal" class="row--warning">
+          <div class="column--title">
+            <span class="text--dot">・</span>
+            <span class="text--warning">
+              {{
+                $t('assets.modals.xcmWarning.otherTokenAsFee', { amount: '0.7', feeToken: 'USDT' })
+              }}
+            </span>
+          </div>
+        </div>
       </div>
       <div v-if="errMsg && currentAccount" class="row--box-error">
         <span class="color--white"> {{ $t(errMsg) }}</span>
@@ -254,6 +264,7 @@ export default defineComponent({
       isLoadingApi,
       isInputDestAddrManually,
       isWithdrawalEthChain,
+      isWithdrawal,
       initializeXcmApi,
       inputHandler,
       bridge,
@@ -306,6 +317,7 @@ export default defineComponent({
       isReverseButton,
       isDepositEthChain,
       isWithdrawalEthChain,
+      isWithdrawal,
       setIsMobileDisplayTooltip,
       inputHandler,
       bridge,

src/hooks/xcm/useXcmBridge.ts

@@ -51,6 +51,8 @@ import {
 } from 'src/v2/services';
 import { Symbols } from 'src/v2/symbols';
 import { useRouter } from 'vue-router';
+import { XcmAssets } from 'src/store/assets/state';
+import { usdtMinFeeAmount } from 'src/modules/xcm/tokens';
 
 const { Acala, Astar, Karura, Polkadot, Shiden } = xcmChainObj;
 
@@ -80,6 +82,8 @@ export function useXcmBridge(selectedToken: Ref<Asset>) {
   const isDeposit = computed<boolean>(() =>
     srcChain.value ? checkIsDeposit(srcChain.value.name) : false
   );
+  const xcmAssets = computed<XcmAssets>(() => store.getters['assets/getAllAssets']);
+
   const isAstar = computed<boolean>(() => currentNetworkIdx.value === endpointKey.ASTAR);
 
   const isAstarNativeTransfer = computed<boolean>(() => {
@@ -118,6 +122,12 @@ export function useXcmBridge(selectedToken: Ref<Asset>) {
     ethWalletChains.includes(destChain.value.name)
   );
 
+  const isWithdrawal = computed<boolean>(() => {
+    if (!srcChain.value) return false;
+    const chains = [Chain.ASTAR, Chain.ASTAR_EVM, Chain.SHIDEN, Chain.SHIDEN_EVM];
+    return chains.some((it) => it === srcChain.value.name);
+  });
+
   const { accountData } = useBalance(currentAccount);
 
   const resetStates = (): void => {
@@ -300,6 +310,29 @@ export function useXcmBridge(selectedToken: Ref<Asset>) {
         return;
       }
     }
+    if (selectedToken.value.metadata.symbol === 'PINK') {
+      const pink = xcmAssets.value.assets.find(
+        (it) => it.metadata.symbol === 'PINK' && it.id === '18446744073709551633'
+      );
+      // Todo: remove after the runtime upgrade
+      if (isH160.value) {
+        errMsg.value = t('warning.xcmEvmTokenIsDisabled', {
+          token: 'PINK',
+        });
+        return;
+      } else {
+        const usdt = xcmAssets.value.assets.find(
+          (it) => it.metadata.symbol === 'USDT' && it.id === '4294969280'
+        );
+        const usdtBal = usdt ? usdt.userBalance : 0;
+        if (usdtMinFeeAmount > usdtBal) {
+          errMsg.value = t('warning.notEnoughFeeToken', {
+            token: 'USDT',
+          });
+          return;
+        }
+      }
+    }
   };
 
   const inputHandler = (event: any): void => {
@@ -671,6 +704,7 @@ export function useXcmBridge(selectedToken: Ref<Asset>) {
     isLoadingApi,
     isAstarNativeTransfer,
     isWithdrawalEthChain,
+    isWithdrawal,
     isInputDestAddrManually,
     inputHandler,
     bridge,

src/i18n/en-US/index.ts

@@ -91,6 +91,8 @@ export default {
     attention: 'Attention',
     testnetSwitchWarning:
       'We have switched our zkEVM testnet to zKyoto from zKatana. zKatana will no longer available.',
+    xcmEvmTokenIsDisabled: 'Withdrawing {token} via EVM wallets is temporarily disabled',
+    notEnoughFeeToken: "You don't have enough {token} for the withdrawal fee",
   },
   toast: {
     transactionFailed: 'Transaction failed with error: {message}',
@@ -637,6 +639,7 @@ export default {
         notInputExchanges: 'Do not input wallet address of exchanges',
         tooltip:
           'We keep {amount} {symbol} in the origin chain account to avoid losing the funds. When depositing from origin chain, only tokens that are above the minimum balance are transferable.',
+        otherTokenAsFee: '{amount} {feeToken} is used for withdrawal fee to AssetHub',
       },
       lockdropWarning: {
         warning:

src/modules/xcm/tokens/index.ts

@@ -11,6 +11,8 @@ import { ASTAR_DECIMALS } from '@astar-network/astar-sdk-core';
 // Ref: https://wiki.acala.network/get-started/acala-network/acala-account
 // Ref: https://wiki.acala.network/get-started/get-started/karura-account
 
+export const usdtMinFeeAmount = 0.7;
+
 export const xcmToken = {
   [endpointKey.ASTAR]: [
     {

src/v2/repositories/implementations/XcmRepository.ts

@@ -19,6 +19,8 @@ import { decodeAddress, evmToAddress } from '@polkadot/util-crypto';
 import { TokenId } from 'src/v2/config/types';
 import { Chain, XcmChain } from 'src/v2/models/XcmModels';
 import { FrameSystemAccountInfo } from 'src/v2/repositories/implementations/SystemRepository';
+import { ethers } from 'ethers';
+import { usdtMinFeeAmount } from 'src/modules/xcm/tokens';
 
 interface AssetConfig extends Struct {
   v1: {
@@ -373,8 +375,7 @@ export class XcmRepository implements IXcmRepository {
       const feeAssetIsRequired = true;
       // 4294969280 is the USDT id
       const feeAssetId = '4294969280';
-      // 700000 = 0.7 USDT
-      const feeAmount = 700000;
+      const feeAmount = Number(ethers.utils.parseUnits(String(usdtMinFeeAmount), 6).toString());
       return { feeAssetIsRequired, feeAssetId, feeAmount };
     }
     return { feeAssetIsRequired: false, feeAssetId: '', feeAmount: 0 };