Release/euphoria 20240730 (#3665)

* [Feat][695] Update UI method evm page (#3651) * feat: update method logic check * fix: not show method with create contract * fix: logic check create contract
aura-nw · Jul 30, 2024 · c3985a4 · c3985a4
1 parent 13554e7
commit c3985a4
Show file tree

Hide file tree

Showing 4 changed files with 55 additions and 16 deletions.
diff --git a/src/app/pages/transaction/evm-transaction/evm-message/evm-message.component.ts b/src/app/pages/transaction/evm-transaction/evm-message/evm-message.component.ts
@@ -334,8 +334,7 @@ export class EvmMessageComponent {
   getMethodName(methodId) {
     this.transactionService.getListMappingName(methodId).subscribe((res) => {
       this.method = mappingMethodName(res, methodId);
-      if (!this.isEvmContract) this.method = 'Send';
-      if (!this.transaction?.to) this.method = 'Create Contract';
+      if (this.transaction?.to && !this.isEvmContract) this.method = 'Send';
     });
   }
 }
diff --git a/src/app/pages/transaction/evm-transaction/evm-transaction.component.html b/src/app/pages/transaction/evm-transaction/evm-transaction.component.html
@@ -44,18 +44,24 @@ <h1 class="text--white mb-0">EVM Transaction Details</h1>
 
           <div class="row mb-2 body justify-content-between justify-content-lg-start">
             <div class="col-auto col-lg-2 text--gray-4">Status</div>
-            <div class="col-auto col-lg-10 d-flex align-items-center">
-              <img
-                [src]="
-                  transaction?.code == evmSuccessCode
-                    ? ('assets/icons/icons-svg/color/success.svg' | imageS3)
-                    : ('assets/icons/icons-svg/color/fail.svg' | imageS3)
-                "
-                width="20px"
-                height="20px" />
-              <span class="ml-2 {{ transaction?.status === 'Success' ? 'text--green-3' : 'text--red-3' }}">
-                {{ transaction?.status | uppercase }}
-              </span>
+            <div class="status-container col-auto col-lg-10 d-flex align-items-center flex-nowrap">
+              <div class="d-flex align-items-center">
+                <img
+                  [src]="
+                    transaction?.code == evmSuccessCode
+                      ? ('assets/icons/icons-svg/color/success.svg' | imageS3)
+                      : ('assets/icons/icons-svg/color/fail.svg' | imageS3)
+                  "
+                  alt="status"
+                  width="20px"
+                  height="20px" />
+                <span class="ml-2 {{ transaction?.status === 'Success' ? 'text--green-3' : 'text--red-3' }}">
+                  {{ transaction?.status | uppercase }}
+                </span>
+              </div>
+              <div class="method">
+                <span>{{ method }}</span>
+              </div>
             </div>
           </div>
           <div class="row mb-2 body justify-content-between justify-content-lg-start">

diff --git a/src/app/pages/transaction/evm-transaction/evm-transaction.component.scss b/src/app/pages/transaction/evm-transaction/evm-transaction.component.scss
@@ -18,4 +18,26 @@
 
 #contentError.line-claim-v {
   -webkit-line-clamp: 3;
+}
+
+.status-container {
+  column-gap: 12px;
+
+  .method {
+    height: 24px;
+    display: flex;
+    padding: 4px 10px;
+    align-items: center;
+    gap: 4px;
+    border-radius: 6px;
+    background: var(--aura-gray-9);
+
+    span {
+      color: var(--aura-gray-3);
+      text-align: center;
+      font-size: 12px;
+      font-weight: 500;
+      line-height: 16px;
+    }
+  }
 }
diff --git a/src/app/pages/transaction/evm-transaction/evm-transaction.component.ts b/src/app/pages/transaction/evm-transaction/evm-transaction.component.ts
@@ -9,6 +9,7 @@ import { ContractService } from 'src/app/core/services/contract.service';
 import { TransactionService } from 'src/app/core/services/transaction.service';
 import { getBalance } from 'src/app/core/utils/common/parsing';
 import { hex2a } from 'src/app/core/utils/ethers/utils';
+import { mappingMethodName } from 'src/app/global/global';
 
 @Component({
   selector: 'app-evm-transaction',
@@ -70,6 +71,7 @@ export class EvmTransactionComponent implements OnChanges {
   isDisplayMore = false;
   topicLength = 4;
   isEvmContract = false;
+  method = ''
 
   constructor(
     private transactionService: TransactionService,
@@ -126,16 +128,26 @@ export class EvmTransactionComponent implements OnChanges {
     }
   }
 
+  getMethod() {
+    const methodId = this.transaction?.inputData?.substring(0, 8);
+    this.transactionService.getListMappingName(methodId).subscribe((res) => {
+      this.method = mappingMethodName(res, methodId);
+      if (this.transaction.to && !this.isEvmContract) this.method = 'Send';
+    });
+  }
+
   checkEvmContract() {
     if (this.transaction?.to) {
       this.contractService.findEvmContract(this.transaction.to).subscribe({
         next: (res) => {
           if (res?.evm_smart_contract?.length > 0)
             this.isEvmContract = true;
-          else this.transaction.memo = hex2a(this.transaction.inputData as any);
+          else this.transaction.memo = hex2a(this.transaction.inputData);
+
+          this.getMethod();
         },
       });
-    }
+    } else this.getMethod();
   }
 
   parseEvmTx(tx: unknown): typeof this.transaction {