Release/euphoria 20240717

scripts/feature-flags/euphoria/config.json

@@ -1 +1 @@
-{ "devTest": false, "enhanceEventLog": false, "setTokenInfo": false }
+{ "devTest": false, "enhanceEventLog": true, "setTokenInfo": false }

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

@@ -125,6 +125,7 @@ export class ApiCw20TokenService {
     const name = await contract.name();
     const symbol = await contract.symbol();
     const decimals = await contract.decimals();
+
     return {
       ...USDC_TOKEN,
       tokenUrl: USDC_ADDRESS,

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

@@ -257,7 +257,7 @@ export class WalletService implements OnDestroy {
     };
 
     (window as any).ethereum?.on('accountsChanged', () => {
-      this.connectEvmWallet(true);
+      this.connectEvmWallet(true).then().catch();
     });
     (window as any).ethereum?.on('chainChanged', reconnect);
   }
@@ -427,7 +427,7 @@ export class WalletService implements OnDestroy {
   async connectEvmWallet(changedWallet = false) {
     const connected = await this.connectToChain();
     if (!changedWallet && !connected) {
-      return;
+      throw Error('Can not connect!');
     }
 
     getSigner(this.env.etherJsonRpc).then((signer) => {
@@ -461,10 +461,10 @@ export class WalletService implements OnDestroy {
           await addNetwork(this.env.evmChainInfo);
           break;
         case 4001:
-          // This error code : "User rejected the request."
-          return false;
+        // This error code : "User rejected the request."
         case -32002:
-          // This error code : "Request of type 'wallet_switchEthereumChain' already pending"
+        // This error code : "Request of type 'wallet_switchEthereumChain' already pending"
+        default:
           return false;
       }
     }

src/app/pages/evm-token/evm-token-summary/evm-token-summary.component.html

@@ -55,21 +55,23 @@
         <div class="d-flex align-items-center py-2">
           <span class="first-col text--gray-5">Official Site:</span>
           <a *ngIf="tokenDetail?.officialSite" [href]="tokenDetail?.officialSite" target="_blank"
-            rel="noopener noreferrer" class="text--primary">{{tokenDetail?.officialSite}}</a>
+            rel="noopener noreferrer" class="text--primary text-truncate">{{tokenDetail?.officialSite}}</a>
         </div>
       </td>
     </tr>
     <tr>
       <td colspan="2">
-        <div class="d-flex align-items-center py-2">
+        <div class="d-flex align-items-start py-2">
           <div class="first-col text--gray-5">
             Social Profiles:
           </div>
-          <div class="socials" *ngIf="tokenDetail?.socialProfiles?.length">
-            <a *ngFor="let item of tokenDetail?.socialProfiles" [href]="item?.url" target="_blank"
-              rel="noopener noreferrer">
-              <img [src]="item?.icon" alt="social-media">
-            </a>
+          <div *ngIf="tokenDetail?.socialProfiles?.length">
+            <div class="socials">
+              <a *ngFor="let item of tokenDetail?.socialProfiles" [href]="item?.url" target="_blank"
+                rel="noopener noreferrer">
+                <img [src]="item?.icon" alt="social-media">
+              </a>
+            </div>
           </div>
         </div>
       </td>

src/app/pages/evm-token/evm-token-summary/evm-token-summary.component.scss

@@ -1,5 +1,7 @@
 .box-token-info {
   table.aura-basic-table {
+    table-layout: fixed;
+
     tr,
     td {
       color: var(--aura-contract);

src/app/pages/token-cosmos/token-content/token-content.component.ts

@@ -106,12 +106,22 @@ export class TokenContentComponent implements OnInit {
       key: tab.key,
     }));
     this.tabsBackup = this.TABS;
-
+    
     this.route.queryParams.subscribe((params) => {
       this.paramQuery = params?.a || '';
       this.searchTemp = this.paramQuery;
       this.handleSearch();
       this.searchTemp = this.nameTagService.findNameTagByAddress(this.searchTemp);
+
+      if (this.featureFlag.isEnabled(FeatureFlags.SetTokenInfo)) {
+        if(!this.paramQuery){
+          this.TABS.push({
+            key: TokenTab.Info,
+            value: 'Info',
+          });
+          this.tabsBackup = this.TABS;
+        }
+      }
     });
 
     if (local.getItem(STORAGE_KEYS.IS_VERIFY_TAB) == 'true') {

src/app/pages/token-cosmos/token-summary/token-summary.component.html

@@ -110,21 +110,23 @@
         <div class="d-flex align-items-center py-2">
           <span class="first-col text--gray-5">Official Site:</span>
           <a *ngIf="tokenDetail?.officialSite" [href]="tokenDetail?.officialSite" target="_blank"
-            rel="noopener noreferrer" class="text--primary">{{tokenDetail?.officialSite}}</a>
+            rel="noopener noreferrer" class="text--primary text-truncate">{{tokenDetail?.officialSite}}</a>
         </div>
       </td>
     </tr>
     <tr>
       <td colspan="2">
-        <div class="d-flex align-items-center py-2">
+        <div class="d-flex align-items-start py-2">
           <div class="first-col text--gray-5">
             Social Profiles:
           </div>
-          <div class="socials" *ngIf="tokenDetail?.socialProfiles?.length">
-            <a *ngFor="let item of tokenDetail?.socialProfiles" [href]="item?.url" target="_blank"
-              rel="noopener noreferrer">
-              <img [src]="item?.icon" alt="social-media">
-            </a>
+          <div *ngIf="tokenDetail?.socialProfiles?.length">
+            <div class="socials">
+              <a *ngFor="let item of tokenDetail?.socialProfiles" [href]="item?.url" target="_blank"
+                rel="noopener noreferrer">
+                <img [src]="item?.icon" alt="social-media">
+              </a>
+            </div>
           </div>
         </div>
       </td>

src/app/pages/token-cosmos/token-summary/token-summary.component.scss

@@ -1,5 +1,7 @@
 .box-token-info {
   table.aura-basic-table {
+    table-layout: fixed;
+
     tr,
     td {
       color: var(--aura-contract);
@@ -13,7 +15,8 @@
     align-items: center;
     justify-content: flex-start;
     column-gap: 20px;
-
+    row-gap: 5px;
+    flex-wrap: wrap;
     img {
       min-width: 16px;
       max-width: 16px;

src/app/pages/transaction/evm-transaction/decode-message/decode-message.component.html

@@ -4,10 +4,10 @@
         <p *ngIf="index !== ''" class="name">
             {{index}} <span *ngIf="name">: {{ name }}</span>
         </p>
-        <div *ngIf="isAllowSwitchDecode" class="dropdown aura-dropdown btn-item">
+        <div style="height: 24px;" *ngIf="isAllowSwitchDecode" class="dropdown aura-dropdown btn-item">
             <button 
-                style="height: 26px; min-width: max-content;"
-                class="button button--sm button--md-mob button-pill button-outline button-dropdown w-100"
+                style="min-width: max-content;"
+                class="button button--sm button--md-mob button-pill button-outline button-dropdown w-100 h-100"
                 type="button"
                 data-bs-toggle="dropdown"
                 aria-expanded="false">
@@ -23,60 +23,53 @@
             </ul>
         </div>
     </div>
-    <div *ngIf="!isAllowSwitchDecode" class="data flex-grow-1">
-        <p class="mb-1 font-space-mono">{{value}}</p>
+    <div *ngIf="!isAllowSwitchDecode" class="data flex-grow-1" style="margin: auto 0px;">
+        <p class="font-space-mono" [class]="decode ? 'mb-1' : 'mb-0'">{{value}}</p>
         <p class="mb-0 font-space-mono" [innerHTML]="decode | highlight_function"></p>
     </div>
-    <div *ngIf="isAllowSwitchDecode" class="data flex-grow-1" [class]="isEvmContract ? 'd-flex align-items-center' : ''">
+    <div *ngIf="isAllowSwitchDecode" style="margin: auto 0px;" class="data flex-grow-1" [class]="isEvmContract ? 'd-flex align-items-center' : ''">
         <img
           [src]="'assets/images/icons/token-contract.svg' | imageS3"
           width="16px"
           height="16px"
+          alt="contract"
+          style="margin-right: 2px;"
           *ngIf="isEvmContract" />
         <a
          *ngIf="isLink && type === 'Decode'"
           class="text--primary font-space-mono d-inline-block"
-          [class]="isEvmContract ? 'p-1' : ''"
           routerLink="/{{ isEvmContract ? 'evm-contracts' : 'address' }}/{{ data }}">
             {{data}}
         </a>
         <span class="font-space-mono" *ngIf="!isLink || type === 'Hex'">{{data}}</span>
     </div>
 </div>
 <div class="decode-message">
-    <div *ngIf="isDataField" class="d-flex align-items-start highlight">
+    <div *ngIf="isDataField" class="d-flex align-items-start highlight" [style]="!isMobile ? 'column-gap: 25px;' : ''">
         <div class="flex-grow-1 data-field-msg">
             <div *ngIf="type === 'Hex'">
                 <p class="font-space-mono">{{ data }}</p>
             </div>
             <div *ngIf="type === 'Decode'">
-                <div class="data-item" [style]="isMobile ? 'grid-template-columns: minmax(40px, max-content) 1fr' : ''">
+                <div class="data-item" [style]="isMobile ? 'grid-template-columns: 1fr' : ''">
                     <ng-container *ngFor="let item of data">
-                        <p class="item-name">{{item?.name}}</p>
-                        <a *ngIf="item?.isLink" class="text--primary font-space-mono" routerLink="/address/{{ item?.decode }}">
-                            {{item?.decode}}
+                        <p class="item-name" style="margin: auto 0px;">{{item?.name}}</p>
+                        <a
+                          *ngIf="item?.isLink"
+                          class="text--primary font-space-mono"
+                          [class]="item?.isEvmContract ? 'd-flex align-items-center' : ''"
+                          routerLink="/{{ item?.isEvmContract ? 'evm-contracts' : 'address' }}/{{ item?.decode }}">
+                            <img
+                              [src]="'assets/images/icons/token-contract.svg' | imageS3"
+                              width="16px"
+                              height="16px"
+                              alt="contract"
+                              style="margin-right: 2px;"
+                              *ngIf="item?.isEvmContract" />
+                            <span>{{item?.decode}}</span>
                         </a>
-                        <div *ngIf="!item?.isLink" class="font-space-mono">
-                            <div *ngIf="item?.type === 'tuple'" class="d-flex flex-wrap gap-2 align-items-center">
-                                <div *ngFor="let dataDecoded of item?.decode" [class]="dataDecoded?.isEvmContract ? 'd-flex align-items-center' : ''">
-                                    <img
-                                      [src]="'assets/images/icons/token-contract.svg' | imageS3"
-                                      width="16px"
-                                      height="16px"
-                                      *ngIf="dataDecoded?.isEvmContract" />
-                                    <a
-                                      *ngIf="dataDecoded?.isLink"
-                                      class="text--primary font-space-mono d-inline-block"
-                                      [class]="dataDecoded?.isEvmContract ? 'p-1' : ''"
-                                      routerLink="/{{ dataDecoded?.isEvmContract ? 'evm-contracts' : 'address' }}/{{ dataDecoded?.name }}">
-                                        {{dataDecoded?.name}}
-                                    </a>
-                                    <p class="font-space-mono" *ngIf="!dataDecoded?.isLink" >{{dataDecoded?.name}}</p>
-                                </div>
-                            </div>
-                            <div *ngIf="item?.type !== 'tuple'">
-                                <p class="font-space-mono">{{item?.decode}}</p>
-                            </div>
+                        <div *ngIf="!item?.isLink">
+                            <p class="font-space-mono">{{item?.decode}}</p>
                         </div>
                     </ng-container>
                 </div>

src/app/pages/transaction/evm-transaction/decode-message/decode-message.component.scss

@@ -1,4 +1,5 @@
 .decode-message {
+    padding: 2px 0px;
     column-gap: 8px;
     .data{
         font-size: 14px;
@@ -18,6 +19,9 @@
         font-size: 12px;
         white-space: nowrap;
         margin: 0;
+        min-width: 32px;
+        height: 24px;
+        max-width: max-content;
     }
     button.button {
         background-color: #494C58;

src/app/pages/transaction/evm-transaction/decode-message/decode-message.component.ts

@@ -46,12 +46,6 @@ export class DecodeMessageComponent implements OnInit {
     const addresses = [];
     for (const item of data) {
       if(item?.isLink) addresses.push(item?.decode);
-      else if(item?.type === 'tuple') {
-        item?.decode?.split(',')?.forEach((tupleItem) => {
-          if (tupleItem?.startsWith('0x')) {
-            addresses.push(tupleItem);
-          }})
-      } 
     }
     return _.uniq(addresses.filter(Boolean));
   }
@@ -72,36 +66,12 @@ export class DecodeMessageComponent implements OnInit {
         this.contractService.findEvmContractList(addresses).subscribe({
           next: (evmList) => {
             this.data = Array.isArray(this.decode) && this.decode?.map((item) => {
-              if (item?.type !== 'tuple') {
-                const isEvmContract = !!evmList?.evm_smart_contract?.find(contract => contract?.address === item?.decode?.toString()?.toLowerCase());
+              const isEvmContract = !!evmList?.evm_smart_contract?.find(contract => contract?.address === item?.decode?.toString()?.toLowerCase());
 
-                return {
-                  ...item,
-                  isEvmContract,
-                  isArray: false,
-                };
-              }
-              if (item?.type === 'tuple') {
-                const links = item?.decode?.split(',')?.map((tupleItem: string) => {
-                  if (tupleItem?.startsWith('0x')) {
-                  const isEvmContract = !!evmList?.evm_smart_contract?.find(contract => contract?.address === tupleItem?.toString()?.toLowerCase());
-                    return {
-                      isEvmContract,
-                      name: tupleItem,
-                      isLink: true,
-                    };
-                  }
-                  return {
-                    name: tupleItem,
-                    isLink: false,
-                  };
-                });
-                return {
-                  ...item,
-                  isArray: true,
-                  decode: links,
-                };
-              }
+              return {
+                ...item,
+                isEvmContract,
+              };
             });
             this.detectRef.detectChanges();
           },

src/app/pages/transaction/evm-transaction/evm-message/evm-message.component.ts

@@ -261,8 +261,20 @@ export class EvmMessageComponent {
                   const tupleType = `(${item?.components?.map(this.mappingFunctionName)?.join(', ')}) ${item?.name}`;
                   const replaceTuple = new RegExp(`\\b${item?.type} ${item?.name}\\b`, 'g');
                   decoded[0].decode = decoded[0]?.decode?.replace(replaceTuple, tupleType);
-                }
 
+                  item?.components?.forEach((tupleParam, tidx) => {
+                    const tupleDecode = {
+                      indexed: tupleParam?.indexed,
+                      name: tupleParam?.name,
+                      type: tupleParam?.type,
+                      isLink: tupleParam?.type === 'address',
+                      decode: paramsDecode.args[idx][tidx]?.toString(),
+                    }
+                    data.push(tupleDecode);
+                  });
+                  return;        
+                } 
+
                 const param = {
                   indexed: item?.indexed,
                   name: item.name,

src/app/pages/transaction/evm-transaction/evm-transaction-event-log/evm-transaction-event-log.component.html

@@ -2,8 +2,8 @@
   <div class="event-number">{{ index + 1 }}</div>
   <div class="event-content w-100">
     <div class="d-flex flex-wrap mb-3">
-      <div class="col-12 col-lg-1 mb-2 mb-lg-0 text--gray-4 body">
-        {{ 'Contract' }}
+      <div class="col-12 col-lg-1 mb-2 mb-lg-0 text--gray-4">
+        <div class="row-name">Contract</div>
       </div>
 
       <div class="col-12 col-lg-11 row">
@@ -16,8 +16,10 @@
       </div>
     </div>
 
-    <div class="d-flex flex-wrap mb-3">
-      <div class="col-12 col-lg-1 mb-2 mb-lg-0 text--gray-4 body">Topics</div>
+    <div class="d-flex flex-wrap mb-2">
+      <div class="col-12 col-lg-1 mb-2 mb-lg-0 text--gray-4">
+        <div class="row-name" style="margin-top: 5px;">Topics</div>
+      </div>
       <div class="col-12 col-lg-11 d-flex flex-column gap-2">
         <div [featureFlag]="'EnhanceEventLog'" [flagEnabled]="false">
           <ng-container *ngFor="let top of eventLog.topics; index as idx">
@@ -55,8 +57,8 @@
     </div>
 
     <div class="d-flex flex-wrap mb-3" *ngIf="eventLog.data">
-      <div class="col-12 col-lg-1 mb-2 mb-lg-0 text--gray-4 body">
-        <span style="line-height: 28px">Data</span>
+      <div class="col-12 col-lg-1 mb-2 mb-lg-0 text--gray-4">
+        <div class="row-name" style="margin-top: 9px;">Data</div>
       </div>
       <div class="col-12 col-lg-11">
         <div class="highlight font-space-mono" [featureFlag]="'EnhanceEventLog'" [flagEnabled]="false">

src/app/pages/transaction/evm-transaction/evm-transaction-event-log/evm-transaction-event-log.component.scss

@@ -8,6 +8,13 @@
     gap: 8px;
   }
 
+  .row-name {
+    font-size: 14px;
+    line-height: 16px;
+    font-weight: 400;
+    margin-top: 2px;
+  }
+
   .item-topic {
     min-height: 40px;
     &:last-child {