Merge pull request #2156 from aura-nw/baseline/main_20230731

Baseline/main 20230731

src/app/pages/account/account-detail/account-detail.component.html

@@ -32,13 +32,23 @@
             </div>
             <div
               *ngIf="commonService.setNameTag(currentAddress) !== currentAddress"
-              class="d-flex align-items-center mt-2">
-              <app-name-tag
-                [value]="currentAddress"
-                [fullText]="true"
-                [isLink]="false"
-                [extendUrl]="true"
-                [widthAuto]="true"></app-name-tag>
+              class="d-inline-flex align-items-center aura-tooltip-contain">
+              <div class="d-inline-flex aura-tooltip-object">
+                <span class="d-none d-lg-flex">{{ commonService.setNameTag(currentAddress) || '-' }}</span>
+                <span class="d-flex d-lg-none justify-content-center">{{
+                  (commonService.setNameTag(currentAddress) | cutStringPipe : 8 : 8) || '-'
+                }}</span>
+              </div>
+              <a
+                target="_blank"
+                [href]="extendLink(commonService.findUrlNameTag(currentAddress))"
+                *ngIf="commonService.findUrlNameTag(currentAddress)">
+                <i
+                  _ngcontent-wrg-c372=""
+                  class="ph-arrow-square-out-fill text--primary body-01 h3-mob ml-1 mt-1 cursor-pointer"></i>
+              </a>
+              <app-tooltip-customize [content]="'Public name: ' + commonService.setNameTag(currentAddress)">
+              </app-tooltip-customize>
             </div>
           </div>
           <div class="mt-6 mt-xl-4">
@@ -118,7 +128,7 @@ <h2 class="mb-4 mb-lg-3 text--white">Coins & Tokens ({{ totalAssets || 0 }})</h2
     <ng-container *ngIf="currentTab === tabsData.Transactions">
       <div class="card" *ngIf="!isNoData">
         <div class="card-body p-4 p-lg-6">
-          <ngx-simplebar *ngIf="dataSource && dataSource.data">
+          <ng-container *ngIf="dataSource && dataSource.data">
             <ng-container *ngIf="dataSource.data.length > 0; else noValues">
               <div class="table-responsive aura-table-contain spacer-tooltip">
                 <ng-container>
@@ -209,7 +219,7 @@ <h2 class="mb-4 mb-lg-3 text--white">Coins & Tokens ({{ totalAssets || 0 }})</h2
             <ng-template #noValues>
               <app-table-no-data *ngIf="!transactionLoading"></app-table-no-data>
             </ng-template>
-          </ngx-simplebar>
+          </ng-container>
           <div *ngIf="transactionLoading" class="">
             <app-loading-sprint></app-loading-sprint>
           </div>

src/app/pages/account/account-detail/account-detail.component.scss

@@ -156,4 +156,9 @@ section.account-detail {
 }
 app-soulbound-feature-tokens {
   width: 100%;
+}
+::ng-deep{
+  app-tooltip-customize{
+    transform: translate(-50%, -8px);
+  }
 }

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

@@ -494,4 +494,9 @@ export class AccountDetailComponent implements OnInit, AfterViewInit {
       this.totalSBT = res.data.length;
     });
   }
+
+  extendLink(url) {
+    url = url.match(/^https?:/) ? url : '//' + url;
+    return url;
+  }
 }

src/app/pages/account/account-detail/nft-list/nft-list.component.html

@@ -58,7 +58,10 @@ <h2 class="mb-0 text--white">NFTs ({{ pageData?.length || 0 }} NFTs)</h2>
                   <span
                     class="text--primary hover-link"
                     (click)="handleRouterLink('/tokens/token-nft/' + item.contract_address)"
-                    >{{ item.token_name }}</span
+                    >
+                    <span class="d-none d-lg-inline-block">{{ item.token_name | cutStringPipe : 16 }}</span>
+                    <span class="d-inline-block d-lg-none">{{ item.token_name | cutStringPipe : 12 }}</span>
+                    </span
                   >
                 </div>
                 <div class="mt-1 nft__info">
@@ -68,7 +71,8 @@ <h2 class="mb-0 text--white">NFTs ({{ pageData?.length || 0 }} NFTs)</h2>
                     (click)="
                       handleRouterLink('/tokens/token-nft/' + item.contract_address + '/' + encodeData(item.token_id))
                     ">
-                    {{ item.token_id }}
+                    <span class="d-none d-lg-inline-block">{{ item.token_id | cutStringPipe : 12 }}</span>
+                    <span class="d-inline-block d-lg-none">{{ item.token_id | cutStringPipe : 9 }}</span>
                   </span>
                 </div>
               </div>

src/app/pages/code-ids/code-id-detail/code-id-contracts-tab/code-id-contracts-tab.component.html

@@ -11,7 +11,7 @@
           </th>
           <td mat-cell *matCellDef="let data">
             <ng-container *ngIf="template.matColumnDef === 'contract_address'">
-              <app-name-tag [value]="data[template.matColumnDef]" [url]="template.isUrl"></app-name-tag>
+              <app-name-tag [value]="data[template.matColumnDef]" [url]="template.isUrl" [tooltipRight]="true"></app-name-tag>
             </ng-container>
             <ng-container *ngIf="template.matColumnDef === 'tx_hash'">
               <a

src/app/pages/code-ids/code-id-list/code-id-list.component.html

@@ -58,13 +58,13 @@ <h1 class="mb-0 text--white">Code IDs</h1>
               </button>
             </div>
           </form>
-          <div class="d-flex justify-content-between align-items-center mt-4 mt-lg-0">
+          <div class="d-flex justify-content-between align-items-center my-4 my-lg-0">
             <div class="text--gray-5 caption-mob fw-normal-mob flex-shrink-0">
               A total of {{ pageData?.length | number }} Code ID{{ pageData?.length > 1 ? 's' : '' }} found
             </div>
           </div>
         </div>
-        <div class="table-responsive aura-table-contain mt-4 mt-lg-0" *ngIf="pageData?.length > 0; else noValues">
+        <div class="overflow-scroll-x spacer-tooltip aura-table-contain" *ngIf="pageData?.length > 0; else noValues">
           <table mat-table matSort [dataSource]="dataSource" class="aura-table contract-table">
             <ng-container *ngFor="let template of templates; index as i">
               <ng-container [matColumnDef]="template.matColumnDef">

src/app/pages/contracts/contracts-detail/contract-info-card/contract-info-card.component.html

@@ -7,59 +7,37 @@
           <td></td>
         </tr>
         <tr>
-          <td class="text--gray-5 body-02-mob">Public Name Tag:</td>
+          <td class="text--gray-5 body-02-mob">Public Name:</td>
           <td colspan="2">
             <ng-container
               *ngIf="commonService.setNameTag(contractDetail?.address) !== contractDetail?.address; else NoNameTag">
-              <app-name-tag
+              <!-- <app-name-tag
                 [value]="contractDetail?.address"
                 [isLink]="false"
                 [extendUrl]="true"
-                [widthAuto]="true"></app-name-tag>
+                [widthAuto]="true"></app-name-tag> -->
+              <div class="d-flex">
+                <span class="d-none d-lg-flex">{{ commonService.setNameTag(contractDetail?.address) || '-' }}</span>
+                <span class="d-flex d-lg-none justify-content-center">{{
+                  (commonService.setNameTag(contractDetail?.address) | cutStringPipe : 8 : 8) || '-'
+                }}</span>
+                <a
+                  target="_blank"
+                  [href]="extendLink(commonService.findUrlNameTag(contractDetail?.address))"
+                  *ngIf="commonService.findUrlNameTag(contractDetail?.address)">
+                  <i
+                    _ngcontent-wrg-c372=""
+                    class="ph-arrow-square-out-fill text--primary body-01 h3-mob ml-1 cursor-pointer"></i>
+                </a>
+              </div>
             </ng-container>
-            <ng-template #NoNameTag>Not Available</ng-template>
+            <ng-template #NoNameTag>-</ng-template>
           </td>
         </tr>
         <tr>
           <td class="text--gray-5 body-02-mob">Private Name Tag:</td>
           <td colspan="2"></td>
         </tr>
-        <!-- 
-        <tr class="d-table-row">
-          <td colspan="3">
-            <div class="text--gray-5 body-02-mob mb-1">Contract Creator:</div>
-            <div>
-              <span class="mr-1 mr-lg-2">
-                <app-name-tag
-                  [value]="contractDetail?.creator"
-                  [widthAuto]="true"
-                  [url]="
-                    contractDetail?.creator?.length > lengthNormalAddress ? 'contracts' : 'account'
-                  "></app-name-tag>
-              </span>
-              at txn
-              <a class="text--primary ml-1 ml-lg-2" [routerLink]="['/transaction', contractDetail?.tx_hash]">
-                {{ contractDetail?.tx_hash | cutStringPipe : 8 : 8 }}
-              </a>
-            </div>
-          </td>
-        </tr> -->
-
-        <!-- <tr class="d-none d-lg-table-row">
-          <td class="text--gray-5 body-02-mob">Contract Creator:</td>
-          <td colspan="2">
-            <span class="mr-1 mr-lg-2">
-              <app-name-tag
-                [value]="contractDetail?.creator"
-                [widthAuto]="true"
-                [url]="contractDetail?.creator?.length > lengthNormalAddress ? 'contracts' : 'account'"></app-name-tag>
-            </span>
-            at txn
-            <a class="text--primary" [routerLink]="['/transaction', contractDetail?.tx_hash]">
-              {{ contractDetail?.tx_hash | cutStringPipe : 8 : 8 }}
-            </a>
-          </td>
-        </tr> -->
 
         <tr>
           <td class="text--gray-5">Token Tracker:</td>

src/app/pages/contracts/contracts-detail/contract-info-card/contract-info-card.component.ts

@@ -26,4 +26,9 @@ export class ContractInfoCardComponent implements OnInit, OnChanges {
       }
     }, 500);
   }
+
+  extendLink(url) {
+    url = url.match(/^https?:/) ? url : '//' + url;
+    return url;
+  }
 }

src/app/pages/contracts/contracts-detail/contracts-overview-card/contracts-overview-card.component.html

@@ -15,7 +15,7 @@ <h6 class="h3-mob mb-0 text--white">Contract Overview</h6>
       <tr>
         <td class="text--gray-5 body-02-mob">Balance:</td>
         <td>
-          {{ contractBalance | mask : 'separator.6' }}
+          <span [appBigNumber]="contractBalance" [decimal]="6"></span>
           {{ denom }}
         </td>
       </tr>
@@ -57,9 +57,9 @@ <h6 class="h3-mob mb-0 text--white">Contract Overview</h6>
       <tr>
         <td class="text--gray-5 body-02-mob border_none">Aura Value:</td>
         <td class="border_none">
-          ${{ contractPrice | number : global.formatNumber2Decimal }}
+          <span [appBigNumber]="contractBalance" [decimal]="6" [tokenPrice]="global.price.aura"></span>
           <span class="text--gray-5 ml-1 caption-mob fw-normal break-word text-nowrap">
-            >(@ ${{ global.price.aura | mask : 'separator.6' }}/{{ denom | uppercase }})
+            (${{ global.price.aura | mask : 'separator.6' }}/{{ denom | uppercase }})
           </span>
         </td>
       </tr>

src/app/pages/contracts/contracts-detail/contracts-overview-card/contracts-overview-card.component.ts

@@ -1,9 +1,10 @@
 import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
-import { TYPE_ACCOUNT } from 'src/app/core/constants/account.constant';
+import { LENGTH_CHARACTER } from 'src/app/core/constants/common.constant';
 import { EnvironmentService } from 'src/app/core/data-services/environment.service';
-import { Globals } from '../../../../global/global';
 import { ContractService } from 'src/app/core/services/contract.service';
-import { LENGTH_CHARACTER } from 'src/app/core/constants/common.constant';
+import { TokenService } from 'src/app/core/services/token.service';
+import { balanceOf } from 'src/app/core/utils/common/parsing';
+import { Globals } from '../../../../global/global';
 
 @Component({
   selector: 'app-contracts-overview-card',
@@ -15,25 +16,26 @@ export class ContractsOverviewCardComponent implements OnInit, OnChanges {
   contractBalance;
   contractPrice;
   priceToken = 0;
-  selectedToken = '$0.00';
-  assetsType = TYPE_ACCOUNT;
   lengthNormalAddress = LENGTH_CHARACTER.ADDRESS;
-
   denom = this.environmentService.configValue.chain_info.currencies[0].coinDenom;
 
   constructor(
     public global: Globals,
     private environmentService: EnvironmentService,
     private contractService: ContractService,
+    private tokenService: TokenService,
   ) {}
 
   ngOnInit() {}
 
   async ngOnChanges(changes: SimpleChanges) {
     const balanceReq = await this.contractService.getContractBalance(this.contractDetail.address);
-    if (balanceReq?.data) {
-      this.contractBalance = balanceReq.data.balances[0] ? balanceReq.data.balances[0] : 0;
-      this.contractPrice = this.contractBalance * this.priceToken || 0;
-    }
+    this.contractBalance = balanceReq?.data?.balances[0]?.amount ? balanceReq?.data?.balances[0]?.amount : 0;
+    this.tokenService.getTokenMarketData({ contractAddress: [this.contractDetail.address] }).subscribe((res) => {
+      if (res?.length > 0) {
+        this.priceToken = res[0].current_price;
+        this.contractPrice = this.contractBalance * this.priceToken || 0;
+      }
+    });
   }
 }

src/app/pages/contracts/contracts-list/contracts-list.component.html

@@ -86,13 +86,13 @@ <h1 class="mb-4 mb-lg-6 text--white">Contracts</h1>
             </div>
           </form>
 
-          <div class="d-flex justify-content-between align-items-center mt-4 mt-lg-0">
+          <div class="d-flex justify-content-between align-items-center my-4 my-lg-0">
             <div class="text--gray-5 caption-mob fw-normal-mob flex-shrink-0 mb-lg-6">
               A total of {{ pageData?.length | number }} Contract{{ pageData?.length > 1 ? 's' : '' }} found
             </div>
           </div>
         </div>
-        <div class="overflow-scroll-x aura-table-contain mt-4 mt-lg-0" *ngIf="pageData?.length > 0; else noValues">
+        <div class="overflow-scroll-x aura-table-contain spacer-tooltip" *ngIf="pageData?.length > 0; else noValues">
           <table mat-table matSort [dataSource]="dataSource" class="aura-table contract-table">
             <ng-container *ngFor="let template of templates; index as i">
               <ng-container [matColumnDef]="template.matColumnDef">
@@ -115,11 +115,11 @@ <h1 class="mb-4 mb-lg-6 text--white">Contracts</h1>
                         <app-name-tag
                           [value]="data[template.matColumnDef]"
                           [url]="template.isUrl"
-                          [isNameTagContract]="true"></app-name-tag>
+                          [tooltipRight]="true"></app-name-tag>
                       </div>
                     </ng-container>
                     <ng-container *ngIf="template.matColumnDef !== 'address'">
-                      <app-name-tag [value]="data[template.matColumnDef]" [url]="template.isUrl"></app-name-tag>
+                      <app-name-tag [value]="data[template.matColumnDef]" [url]="template.isUrl" [tooltipLeft]="true"></app-name-tag>
                     </ng-container>
                   </ng-container>
                   <ng-container

src/app/pages/contracts/contracts-list/contracts-list.component.scss

@@ -57,3 +57,11 @@
     }
   }
 }
+
+.contract-table {
+  ::ng-deep {
+    .tooltip--left {
+      transform: translate(0, -15px);
+    }
+  }
+}

src/app/pages/contracts/contracts-list/contracts-list.component.ts

@@ -129,8 +129,6 @@ export class ContractsListComponent implements OnInit, OnDestroy {
   }
 
   filterButton(val: string) {
-    console.log(val);
-
     const i = this.filterButtons.findIndex((i) => i === val);
 
     switch (val) {

src/app/pages/contracts/contracts.module.ts

@@ -8,6 +8,7 @@ import { TranslateModule } from '@ngx-translate/core';
 import { ClickOutsideModule } from 'ng-click-outside';
 import { NgxMaskModule } from 'ngx-mask';
 import { MaterialModule } from 'src/app/app.module';
+import { CommonDirectiveModule } from 'src/app/core/directives/common-directive.module';
 import { CommonPipeModule } from 'src/app/core/pipes/common-pipe.module';
 import { APaginatorModule } from 'src/app/shared/components/a-paginator/a-paginator.module';
 import { ContractTableModule } from 'src/app/shared/components/contract-table/contract-table.module';
@@ -74,6 +75,7 @@ import { ContractsVerifyComponent } from './contracts-verify/contracts-verify.co
     NameTagModule,
     TooltipCustomizeModule,
     ClipboardModule,
+    CommonDirectiveModule,
   ],
   providers: [ContractService],
   exports: [ContractVerifyStepsComponent],

src/app/pages/fee-grant/my-grantees/my-grantees.component.html

@@ -41,7 +41,7 @@
       </div>
       <div class="mt-4">
         <ng-container *ngIf="dataSource?.data?.length > 0; else noValues">
-          <div class="table-responsive aura-table-contain">
+          <div class="overflow-scroll-x aura-table-contain spacer-tooltip">
             <table mat-table [dataSource]="dataSource" class="aura-table grant-table">
               <ng-container *ngFor="let template of templates; index as i">
                 <ng-container [matColumnDef]="template.matColumnDef">

src/app/pages/fee-grant/my-granters/my-granters.component.html

@@ -39,7 +39,7 @@
       </div>
       <div class="mt-4">
         <ng-container *ngIf="dataSource?.data?.length > 0; else noValues">
-          <div class="table-responsive aura-table-contain">
+          <div class="overflow-scroll-x aura-table-contain spacer-tooltip">
             <table mat-table [dataSource]="dataSource" class="aura-table grant-table">
               <ng-container *ngFor="let template of templates; index as i">
                 <ng-container [matColumnDef]="template.matColumnDef">

src/app/pages/soulbound-token/soulbound-account-token-list/soulbound-account-token-list.component.html

@@ -29,13 +29,25 @@
               <app-tooltip-customize [content]="'Copied!'"> </app-tooltip-customize>
             </div>
           </div>
-          <div *ngIf="commonService.setNameTag(userAddress) !== userAddress" class="name-tag cursor-pointer mt-2">
-            <app-name-tag
-              [value]="userAddress"
-              [fullText]="true"
-              [widthAuto]="true"
-              [extendUrl]="true"
-              [isLink]="false"></app-name-tag>
+          <div
+            *ngIf="commonService.setNameTag(userAddress) !== userAddress"
+            class="name-tag cursor-pointer aura-tooltip-contain d-inline-flex align-items-center">
+            <div class="d-inline-flex aura-tooltip-object">
+              <span class="d-none d-lg-flex">{{ commonService.setNameTag(userAddress) || '-' }}</span>
+              <span class="d-flex d-lg-none justify-content-center">{{
+                (commonService.setNameTag(userAddress) | cutStringPipe : 8 : 8) || '-'
+              }}</span>
+            </div>
+            <a
+              target="_blank"
+              [href]="extendLink(commonService.findUrlNameTag(userAddress))"
+              *ngIf="commonService.findUrlNameTag(userAddress)">
+              <i
+                _ngcontent-wrg-c372=""
+                class="ph-arrow-square-out-fill text--primary body-01 h3-mob ml-1 mt-1 cursor-pointer"></i>
+            </a>
+            <app-tooltip-customize [content]="'Public name: ' + commonService.setNameTag(userAddress)">
+            </app-tooltip-customize>
           </div>
         </div>
         <div class="mt-6 mt-lg-4">