[hotfix][662] add USDC token as default (#3567)

* [hotfix][662] add USDC as default

* move get usdc token to account service

src/app/core/constants/token.constant.ts

@@ -87,4 +87,17 @@ export const SOCIAL_MEDIA = {
     name: 'linkedin',
     icon: 'assets/icons/icons-svg/basic/linkedIn.svg',
   },
-};
+};
+
+export const USDC_ADDRESS = '0x80b5a32e4f032b2a058b4f29ec95eefeeb87adcd';
+export const USDC_COIN_ID = 'tether';
+export const USDC_TOKEN = {
+  name: '',
+  symbol: '',
+  decimals: 0,
+  denom: '-',
+  contract_address: USDC_ADDRESS,
+  balance: 0,
+  price: '',
+  value: 0,
+};

src/app/core/data-services/api-cw20-token.service.ts

@@ -4,12 +4,15 @@ import BigNumber from 'bignumber.js';
 import * as _ from 'lodash';
 import { filter, forkJoin, map, take } from 'rxjs';
 import { COIN_TOKEN_TYPE } from '../constants/common.constant';
-import { ETokenCoinTypeBE } from '../constants/token.constant';
+import { ETokenCoinTypeBE, USDC_ADDRESS, USDC_COIN_ID, USDC_TOKEN } from '../constants/token.constant';
 import { TokenService } from '../services/token.service';
 import { balanceOf, getBalance } from '../utils/common/parsing';
 import { ApiAccountService } from './api-account.service';
 import { EnvironmentService } from './environment.service';
 import { CW20_TOKENS_TEMPLATE, ERC20_TOKENS_TEMPLATE } from './template';
+import { getEthersProvider } from '../utils/ethers';
+import { ERC20_ABI } from 'src/app/pages/account/account-detail/token-table/ABI/erc20-abi';
+import { Contract } from 'ethers';
 
 export interface IAsset {
   name: string;
@@ -45,18 +48,19 @@ export class ApiCw20TokenService {
     private tokenService: TokenService,
   ) {}
 
-  getByOwner(address: string) {
+  getByOwner(address: string, evmAddress: string) {
     return forkJoin([
       this.queryCw20TokenByOwner(address),
       this.queryERC20TokenByOwner(address),
       this.apiAccount.getAccountByAddress(address, true),
+      this.getUSDCToken(evmAddress),
       this.tokenService.tokensMarket$.pipe(
         filter((data) => _.isArray(data)),
         take(1),
       ),
     ]).pipe(
       map((data) => {
-        const [cw20Tokens, erc20Tokens, account, coinsMarkets] = data;
+        const [cw20Tokens, erc20Tokens, account, USDCToken, coinsMarkets] = data;
 
         const nativeToken = this.parseNativeToken(account, coinsMarkets);
 
@@ -71,6 +75,15 @@ export class ApiCw20TokenService {
           BigNumber(token.balance).gt(0),
         );
 
+        const usdcCoin = this.parseUSDCToken(USDCToken, coinsMarkets);
+
+        const idx = tokens?.findIndex((f) => f.contract_address?.toLowerCase() === USDC_ADDRESS);
+        if (idx >= 0) {
+          tokens[idx] = usdcCoin;
+        } else {
+          tokens.push(usdcCoin);
+        }
+
         const allTokens = [nativeToken, ...tokens];
 
         const totalValue = allTokens
@@ -88,6 +101,51 @@ export class ApiCw20TokenService {
     );
   }
 
+  createContract() {
+    try {
+      const provider = getEthersProvider(this.env.etherJsonRpc);
+
+      let contract = new Contract(USDC_ADDRESS, ERC20_ABI, provider);
+      return contract;
+    } catch (error) {
+      console.error(error);
+    }
+
+    return null;
+  }
+
+  async getUSDCToken(address: string) {
+    const contract = this.createContract();
+    const balance = await contract.balanceOf(address);
+    const name = await contract.name();
+    const symbol = await contract.symbol();
+
+    return {
+      ...USDC_TOKEN,
+      tokenUrl: USDC_ADDRESS,
+      name: name?.toString(),
+      symbol: symbol?.toString(),
+      balance: Number(balance?.toString()),
+    };
+  }
+
+  parseUSDCToken(token, coinsMarkets) {
+    const USDCMarket = coinsMarkets?.find((item) => item.coinId === USDC_COIN_ID);
+
+    return {
+      ...token,
+      change: null,
+      isValueUp: true,
+      type: USDCMarket?.type,
+      tokenUrl: USDC_ADDRESS,
+      denom: USDCMarket?.denom,
+      decimals: USDCMarket?.decimal,
+      price: USDCMarket?.currentPrice,
+      priceChangePercentage24h: USDCMarket?.priceChangePercentage24h,
+      value: Number(USDCMarket?.currentPrice) * token?.balance,
+    };
+  }
+
   parseErc20Tokens(tokens, coinsMarkets) {
     return tokens?.map((item) => {
       const coinMarket = coinsMarkets.find((coin) => coin.type === ETokenCoinTypeBE.ERC20 && coin.denom === item.denom);

src/app/core/services/account.service.ts

@@ -26,7 +26,7 @@ export class AccountService extends CommonService {
   }
 
   getAssetCW20ByOwner(payload): Observable<any> {
-    return this.apiCw20TokenService.getByOwner(payload?.account_address);
+    return this.apiCw20TokenService.getByOwner(payload?.account_address, payload?.evm_address);
   }
 
   getAssetCW721ByOwner(payload): Observable<any> {

src/app/pages/account/account-detail/token-table/ABI/erc20-abi.ts

@@ -0,0 +1,223 @@
+export const ERC20_ABI = [
+  {
+    constant: true,
+    inputs: [],
+    name: 'name',
+    outputs: [
+      {
+        name: '',
+        type: 'string',
+      },
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    constant: false,
+    inputs: [
+      {
+        name: '_spender',
+        type: 'address',
+      },
+      {
+        name: '_value',
+        type: 'uint256',
+      },
+    ],
+    name: 'approve',
+    outputs: [
+      {
+        name: '',
+        type: 'bool',
+      },
+    ],
+    payable: false,
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    constant: true,
+    inputs: [],
+    name: 'totalSupply',
+    outputs: [
+      {
+        name: '',
+        type: 'uint256',
+      },
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    constant: false,
+    inputs: [
+      {
+        name: '_from',
+        type: 'address',
+      },
+      {
+        name: '_to',
+        type: 'address',
+      },
+      {
+        name: '_value',
+        type: 'uint256',
+      },
+    ],
+    name: 'transferFrom',
+    outputs: [
+      {
+        name: '',
+        type: 'bool',
+      },
+    ],
+    payable: false,
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    constant: true,
+    inputs: [],
+    name: 'decimals',
+    outputs: [
+      {
+        name: '',
+        type: 'uint8',
+      },
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    constant: true,
+    inputs: [
+      {
+        name: '_owner',
+        type: 'address',
+      },
+    ],
+    name: 'balanceOf',
+    outputs: [
+      {
+        name: 'balance',
+        type: 'uint256',
+      },
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    constant: true,
+    inputs: [],
+    name: 'symbol',
+    outputs: [
+      {
+        name: '',
+        type: 'string',
+      },
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    constant: false,
+    inputs: [
+      {
+        name: '_to',
+        type: 'address',
+      },
+      {
+        name: '_value',
+        type: 'uint256',
+      },
+    ],
+    name: 'transfer',
+    outputs: [
+      {
+        name: '',
+        type: 'bool',
+      },
+    ],
+    payable: false,
+    stateMutability: 'nonpayable',
+    type: 'function',
+  },
+  {
+    constant: true,
+    inputs: [
+      {
+        name: '_owner',
+        type: 'address',
+      },
+      {
+        name: '_spender',
+        type: 'address',
+      },
+    ],
+    name: 'allowance',
+    outputs: [
+      {
+        name: '',
+        type: 'uint256',
+      },
+    ],
+    payable: false,
+    stateMutability: 'view',
+    type: 'function',
+  },
+  {
+    payable: true,
+    stateMutability: 'payable',
+    type: 'fallback',
+  },
+  {
+    anonymous: false,
+    inputs: [
+      {
+        indexed: true,
+        name: 'owner',
+        type: 'address',
+      },
+      {
+        indexed: true,
+        name: 'spender',
+        type: 'address',
+      },
+      {
+        indexed: false,
+        name: 'value',
+        type: 'uint256',
+      },
+    ],
+    name: 'Approval',
+    type: 'event',
+  },
+  {
+    anonymous: false,
+    inputs: [
+      {
+        indexed: true,
+        name: 'from',
+        type: 'address',
+      },
+      {
+        indexed: true,
+        name: 'to',
+        type: 'address',
+      },
+      {
+        indexed: false,
+        name: 'value',
+        type: 'uint256',
+      },
+    ],
+    name: 'Transfer',
+    type: 'event',
+  },
+];
+1;

src/app/pages/account/account-detail/token-table/token-table.component.ts

@@ -98,10 +98,13 @@ export class TokenTableComponent implements OnChanges {
   }
 
   getListToken() {
-    const { accountAddress } = transferAddress(this.chainInfo.bech32Config.bech32PrefixAccAddr, this.address);
-
+    const { accountAddress, accountEvmAddress } = transferAddress(
+      this.chainInfo.bech32Config.bech32PrefixAccAddr,
+      this.address,
+    );
     const payload = {
       account_address: accountAddress?.toLowerCase(),
+      evm_address: accountEvmAddress?.toLowerCase(),
       keyword: this.textSearch,
     };
 
@@ -189,6 +192,7 @@ export class TokenTableComponent implements OnChanges {
             this.pageData.length = 0;
             this.dataSource.data = [];
           }
+
           this.totalAssets.emit(this.pageData?.length || 0);
           this.totalValue.emit(res?.totalValue);
           this.setTokenFilter(this.listTokenType[0]);