Merge pull request #545 from UnUniFi/add-link-portal

Add Portal Link

projects/explorer/src/app/views/app.component.html

@@ -28,6 +28,10 @@
         <div>Explorer</div>
       </div>
       <app-node-tool></app-node-tool>
+      <button class="btn gap-1 btn-primary w-full md:w-auto md:px-8" (click)="onClickOpenPortal()">
+        <mat-icon class="md:ml-3">wallet</mat-icon>
+        <span class="hidden md:inline">Open Portal</span>
+      </button>
     </div>
     <!-- Page content here -->
     <div class="w-full max-w-screen-xl mx-auto p-8">

projects/explorer/src/app/views/app.component.ts

@@ -74,6 +74,11 @@ export class AppComponent implements OnInit {
     }
   }
 
+  onClickOpenPortal() {
+    const rootPath = window.location.origin;
+    window.open(rootPath + '/portal', '_blank');
+  }
+
   onSubmitSearchResult(searchResult: SearchResult) {
     this.appSubmitSearchResult.emit(searchResult);
   }

projects/portal/src/app/models/nft-pawnshops/nft-pawnshop.chart.service.ts

@@ -1,5 +1,6 @@
 import { Injectable } from '@angular/core';
 import { BidderBids200ResponseBidsInner } from 'ununifi-client/esm/openapi';
+import { denomExponentMap } from '../cosmos/bank.model';
 
 @Injectable({
   providedIn: 'root',
@@ -59,6 +60,13 @@ export class NftPawnshopChartService {
 
   createBidAmountChartData(bidders: BidderBids200ResponseBidsInner[]) {
     const primaryColor = '#3A4D8F';
+    if (bidders.length === 0) {
+      return [];
+    }
+    if (!bidders[0].bid_amount?.denom) {
+      return [];
+    }
+    const exponent = denomExponentMap[bidders[0].bid_amount.denom];
     return bidders.map((bidder) => {
       if (
         bidder.bidding_period &&
@@ -67,7 +75,7 @@ export class NftPawnshopChartService {
         bidder.deposit_lending_rate
       ) {
         const date = new Date(bidder.bidding_period).toLocaleString();
-        const bidAmount = Number(bidder.bid_amount.amount) / 1000000;
+        const bidAmount = Number(bidder.bid_amount.amount) / 10 ** exponent;
         const rate = (Number(bidder.deposit_lending_rate) * 100).toFixed(2) + '%';
         return [date, bidAmount, primaryColor, rate];
       } else {
@@ -79,6 +87,13 @@ export class NftPawnshopChartService {
   createDepositAmountChartData(bidders: BidderBids200ResponseBidsInner[]) {
     const primaryColor = '#3A4D8F';
     const disableColor = '#BFBFBF';
+    if (bidders.length === 0) {
+      return [];
+    }
+    if (!bidders[0].bid_amount?.denom) {
+      return [];
+    }
+    const exponent = denomExponentMap[bidders[0].bid_amount.denom];
     let data = [];
     for (let bidder of bidders) {
       if (
@@ -88,11 +103,11 @@ export class NftPawnshopChartService {
         bidder.deposit_lending_rate
       ) {
         const date = new Date(bidder.bidding_period).toLocaleString();
-        const depositAmount = Number(bidder.deposit_amount.amount) / 1000000;
+        const depositAmount = Number(bidder.deposit_amount.amount) / 10 ** exponent;
         const rate = (Number(bidder.deposit_lending_rate) * 100).toFixed(2) + '%';
         if (bidder.borrowings && bidder.borrowings.length) {
           const borrowedAmount = bidder.borrowings.reduce(
-            (sum, curr) => sum + Number(curr.amount?.amount) / 1000000,
+            (sum, curr) => sum + Number(curr.amount?.amount) / 10 ** exponent,
             0,
           );
           data.push([date, borrowedAmount, disableColor, rate]);
@@ -112,6 +127,13 @@ export class NftPawnshopChartService {
 
   createBorrowingAmountChartData(bidders: BidderBids200ResponseBidsInner[]) {
     const primaryColor = '#3A4D8F';
+    if (bidders.length === 0) {
+      return [];
+    }
+    if (!bidders[0].bid_amount?.denom) {
+      return [];
+    }
+    const exponent = denomExponentMap[bidders[0].bid_amount.denom];
     return bidders.map((bidder) => {
       if (
         bidder.bidding_period &&
@@ -121,7 +143,8 @@ export class NftPawnshopChartService {
       ) {
         const date = new Date(bidder.bidding_period).toLocaleString();
         const borrowAmount =
-          bidder.borrowings.reduce((sum, curr) => sum + Number(curr.amount?.amount), 0) / 1000000;
+          bidder.borrowings.reduce((sum, curr) => sum + Number(curr.amount?.amount), 0) /
+          10 ** exponent;
         const rate = (Number(bidder.deposit_lending_rate) * 100).toFixed(2) + '%';
         return [date, borrowAmount, primaryColor, rate];
       } else {

projects/portal/src/app/pages/faucet/faucet.component.ts

@@ -1,3 +1,4 @@
+import { denomExponentMap } from '../../models/cosmos/bank.model';
 import { BankQueryService } from '../../models/cosmos/bank.query.service';
 import { FaucetApplicationService } from '../../models/faucets/faucet.application.service';
 import { StoredWallet } from '../../models/wallets/wallet.model';
@@ -58,29 +59,29 @@ export class FaucetComponent implements OnInit {
     this.symbol$ = combineLatest([denom$, denomMetadataMap$]).pipe(
       map(([denom, metadata]) => metadata[denom].symbol || denom),
     );
-    const unit$ = combineLatest([denom$, denomMetadataMap$]).pipe(
-      map(([denom, metadata]) => metadata[denom].denom_units?.find((u) => u.denom == denom)),
-    );
 
-    this.amount$ = combineLatest([unit$, microAmount$]).pipe(
-      map(([unit, microAmount]) => {
+    this.amount$ = combineLatest([denom$, microAmount$]).pipe(
+      map(([denom, microAmount]) => {
         if (microAmount) {
-          return microAmount / 10 ** (unit?.exponent || 6);
+          const exponent = denomExponentMap[denom];
+          return microAmount / 10 ** exponent;
         } else {
           return 0;
         }
       }),
     );
     this.symbolImageMap = this.bankQuery.getSymbolImageMap();
     this.faucetURL$ = this.usecase.faucetURL$(denom$);
-    this.creditAmount$ = combineLatest([unit$, this.usecase.creditAmount$(denom$)]).pipe(
-      map(([unit, amount]) => {
-        return amount / 10 ** (unit?.exponent || 6);
+    this.creditAmount$ = combineLatest([denom$, this.usecase.creditAmount$(denom$)]).pipe(
+      map(([denom, amount]) => {
+        const exponent = denomExponentMap[denom];
+        return amount / 10 ** exponent;
       }),
     );
-    this.maxCredit$ = combineLatest([unit$, this.usecase.maxCredit$(denom$)]).pipe(
-      map(([unit, amount]) => {
-        return amount / 10 ** (unit?.exponent || 6);
+    this.maxCredit$ = combineLatest([denom$, this.usecase.maxCredit$(denom$)]).pipe(
+      map(([denom, amount]) => {
+        const exponent = denomExponentMap[denom];
+        return amount / 10 ** exponent;
       }),
     );
   }

projects/portal/src/app/pages/nft-pawnshop/borrowers/borrower-nfts/borrower-nft/repay/repay.component.ts

@@ -1,6 +1,7 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
 import { BankQueryService } from 'projects/portal/src/app/models/cosmos/bank.query.service';
+import { BankService } from 'projects/portal/src/app/models/cosmos/bank.service';
 import { NftPawnshopApplicationService } from 'projects/portal/src/app/models/nft-pawnshops/nft-pawnshop.application.service';
 import { NftPawnshopChartService } from 'projects/portal/src/app/models/nft-pawnshops/nft-pawnshop.chart.service';
 import { RepayRequest } from 'projects/portal/src/app/models/nft-pawnshops/nft-pawnshop.model';
@@ -9,6 +10,7 @@ import { NftPawnshopService } from 'projects/portal/src/app/models/nft-pawnshops
 import { Metadata } from 'projects/shared/src/lib/models/ununifi/query/nft/nft.model';
 import { Observable, combineLatest, of } from 'rxjs';
 import { map, mergeMap } from 'rxjs/operators';
+import { liquidation } from 'ununifi-client/cjs/rest/nftbackedloan/module';
 import {
   BidderBids200ResponseBidsInner,
   Liquidation200ResponseLiquidations,
@@ -37,6 +39,7 @@ export class RepayComponent implements OnInit {
 
   constructor(
     private route: ActivatedRoute,
+    private readonly bankService: BankService,
     private readonly bankQuery: BankQueryService,
     private readonly pawnshop: NftPawnshopService,
     private readonly pawnshopQuery: NftPawnshopQueryService,
@@ -68,8 +71,15 @@ export class RepayComponent implements OnInit {
     this.liquidation$ = nftCombine$.pipe(
       mergeMap(([classID, nftID]) => this.pawnshopQuery.getLiquidation$(classID, nftID)),
     );
-    this.repayAmount$ = this.liquidation$.pipe(
-      map((liq) => Number(liq.liquidation?.amount?.amount) / 1000000),
+
+    this.repayAmount$ = combineLatest([this.liquidation$, denomMetadataMap$]).pipe(
+      map(
+        ([liquidation, denomMetadataMap]) =>
+          this.bankService.convertCoinToSymbolAmount(
+            liquidation.liquidation?.amount || { amount: '0', denom: '' },
+            denomMetadataMap,
+          ).amount,
+      ),
     );
 
     const nftData$ = nftCombine$.pipe(

projects/portal/src/app/pages/nft-pawnshop/lenders/lenders.component.ts

@@ -160,9 +160,7 @@ export class LendersComponent implements OnInit {
         if (!selectedMetadata) {
           return [];
         }
-        const filteredNfts = nfts.filter(
-          (nft) => nft.listing?.bid_token == selectedMetadata.denom_units![0].denom,
-        );
+        const filteredNfts = nfts.filter((nft) => nft.listing?.bid_token == selectedMetadata.base);
         return classes.filter((value) =>
           filteredNfts.find((nft) => nft.listing?.nft_id?.class_id == value.class_id),
         );

projects/portal/src/app/views/cosmos/bank/send/send.component.ts

@@ -1,4 +1,4 @@
-import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core';
+import { Component, OnInit, Input, Output, EventEmitter, OnChanges } from '@angular/core';
 import cosmosclient from '@cosmos-client/core';
 import { StoredWallet } from 'projects/portal/src/app/models/wallets/wallet.model';
 
@@ -15,7 +15,7 @@ export type SendOnSubmitEvent = {
   templateUrl: './send.component.html',
   styleUrls: ['./send.component.css'],
 })
-export class SendComponent implements OnInit {
+export class SendComponent implements OnInit, OnChanges {
   @Input()
   currentStoredWallet?: StoredWallet | null;
 
@@ -43,7 +43,7 @@ export class SendComponent implements OnInit {
     }
   }
 
-  ngOnInit(): void { }
+  ngOnInit(): void {}
 
   onSubmit(toAddress: string, minimumGasPrice: string) {
     if (!this.currentStoredWallet) {

projects/portal/src/app/views/dialogs/delegate/delegate-form-dialog/delegate-form-dialog.component.ts

@@ -1,8 +1,9 @@
 import { DialogRef } from '@angular/cdk/dialog';
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
 import cosmosclient from '@cosmos-client/core';
 import { StakingDelegatorValidators200ResponseValidatorsInner } from '@cosmos-client/core/esm/openapi';
 import * as crypto from 'crypto';
+import { denomExponentMap } from 'projects/portal/src/app/models/cosmos/bank.model';
 import { StoredWallet, WalletType } from 'projects/portal/src/app/models/wallets/wallet.model';
 
 export type DelegateOnSubmitEvent = {
@@ -18,7 +19,7 @@ export type DelegateOnSubmitEvent = {
   templateUrl: './delegate-form-dialog.component.html',
   styleUrls: ['./delegate-form-dialog.component.css'],
 })
-export class DelegateFormDialogComponent implements OnInit {
+export class DelegateFormDialogComponent implements OnInit, OnChanges {
   @Input()
   currentStoredWallet?: StoredWallet | null;
   @Input()
@@ -70,14 +71,16 @@ export class DelegateFormDialogComponent implements OnInit {
       !this.currentStoredWallet ||
       !this.delegateAmount ||
       !this.selectedGasPrice ||
-      !this.validatorsList
+      !this.validatorsList ||
+      !this.denom
     ) {
       return;
     }
+    const exponent = denomExponentMap[this.denom];
     this.appSubmit.emit({
       walletType: this.currentStoredWallet?.type,
       amount: {
-        amount: Math.floor(Number(this.delegateAmount) * 1000000).toString(),
+        amount: Math.floor(Number(this.delegateAmount) * 10 ** exponent).toString(),
         denom: this.denom,
       },
       minimumGasPrice: this.selectedGasPrice,

projects/portal/src/app/views/dialogs/delegate/redelegate-form-dialog/redelegate-form-dialog.component.ts

@@ -1,11 +1,12 @@
 import { DialogRef } from '@angular/cdk/dialog';
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
 import cosmosclient from '@cosmos-client/core';
 import {
   DelegatorDelegations200Response,
   StakingDelegatorValidators200ResponseValidatorsInner,
 } from '@cosmos-client/core/esm/openapi';
 import * as crypto from 'crypto';
+import { denomExponentMap } from 'projects/portal/src/app/models/cosmos/bank.model';
 import { StoredWallet } from 'projects/portal/src/app/models/wallets/wallet.model';
 
 export type RedelegateOnSubmitEvent = {
@@ -21,7 +22,7 @@ export type RedelegateOnSubmitEvent = {
   templateUrl: './redelegate-form-dialog.component.html',
   styleUrls: ['./redelegate-form-dialog.component.css'],
 })
-export class RedelegateFormDialogComponent implements OnInit {
+export class RedelegateFormDialogComponent implements OnInit, OnChanges {
   @Input()
   validatorsList?: StakingDelegatorValidators200ResponseValidatorsInner[] | null;
   @Input()
@@ -89,11 +90,14 @@ export class RedelegateFormDialogComponent implements OnInit {
     if (!this.validatorsList) {
       return;
     }
-    // this.selectedAmount.amount = this.selectedAmount.amount?.toString();
+    if (!this.denom) {
+      return;
+    }
+    const exponent = denomExponentMap[this.denom];
     this.appSubmit.emit({
       destinationValidator: this.selectedValidator.operator_address,
       amount: {
-        amount: Math.floor(Number(this.redelegateAmount) * 1000000).toString(),
+        amount: Math.floor(Number(this.redelegateAmount) * 10 ** exponent).toString(),
         denom: this.denom,
       },
       minimumGasPrice: this.selectedGasPrice,

projects/portal/src/app/views/dialogs/delegate/undelegate-form-dialog/undelegate-form-dialog.component.ts

@@ -1,12 +1,13 @@
 import { DialogRef } from '@angular/cdk/dialog';
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
 import cosmosclient from '@cosmos-client/core';
 import {
   DelegatorDelegations200Response,
   UnbondingDelegation200Response,
   StakingDelegatorValidators200ResponseValidatorsInner,
 } from '@cosmos-client/core/esm/openapi';
 import * as crypto from 'crypto';
+import { denomExponentMap } from 'projects/portal/src/app/models/cosmos/bank.model';
 import { StoredWallet } from 'projects/portal/src/app/models/wallets/wallet.model';
 
 export type UndelegateOnSubmitEvent = {
@@ -20,7 +21,7 @@ export type UndelegateOnSubmitEvent = {
   templateUrl: './undelegate-form-dialog.component.html',
   styleUrls: ['./undelegate-form-dialog.component.css'],
 })
-export class UndelegateFormDialogComponent implements OnInit {
+export class UndelegateFormDialogComponent implements OnInit, OnChanges {
   @Input()
   currentStoredWallet?: StoredWallet | null;
   @Input()
@@ -80,13 +81,16 @@ export class UndelegateFormDialogComponent implements OnInit {
     if (!this.undelegateAmount) {
       return;
     }
+    if (!this.denom) {
+      return;
+    }
     if (this.selectedGasPrice === undefined) {
       return;
     }
-    // this.selectedAmount.amount = this.selectedAmount.amount?.toString();
+    const exponent = denomExponentMap[this.denom];
     this.appSubmit.emit({
       amount: {
-        amount: Math.floor(Number(this.undelegateAmount) * 1000000).toString(),
+        amount: Math.floor(Number(this.undelegateAmount) * 10 ** exponent).toString(),
         denom: this.denom,
       },
       minimumGasPrice: this.selectedGasPrice,

projects/portal/src/app/views/dialogs/delegate/withdraw-all-delegator-reward-form-dialog/withdraw-all-delegator-reward-form-dialog.component.ts

@@ -1,5 +1,5 @@
 import { DialogRef } from '@angular/cdk/dialog';
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
 import cosmosclient from '@cosmos-client/core';
 import {
   DelegatorDelegations200ResponseDelegationResponsesInner,
@@ -19,7 +19,7 @@ export type WithdrawAllDelegatorRewardOnSubmitEvent = {
   templateUrl: './withdraw-all-delegator-reward-form-dialog.component.html',
   styleUrls: ['./withdraw-all-delegator-reward-form-dialog.component.css'],
 })
-export class WithdrawAllDelegatorRewardFormDialogComponent implements OnInit {
+export class WithdrawAllDelegatorRewardFormDialogComponent implements OnInit, OnChanges {
   @Input()
   currentStoredWallet?: StoredWallet | null;
   @Input()

projects/portal/src/app/views/dialogs/delegate/withdraw-delegator-reward-form-dialog/withdraw-delegator-reward-form-dialog.component.ts

@@ -1,5 +1,5 @@
 import { DialogRef } from '@angular/cdk/dialog';
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
 import cosmosclient from '@cosmos-client/core';
 import { StakingDelegatorValidators200ResponseValidatorsInner } from '@cosmos-client/core/esm/openapi';
 import * as crypto from 'crypto';
@@ -15,7 +15,7 @@ export type WithdrawDelegatorRewardOnSubmitEvent = {
   templateUrl: './withdraw-delegator-reward-form-dialog.component.html',
   styleUrls: ['./withdraw-delegator-reward-form-dialog.component.css'],
 })
-export class WithdrawDelegatorRewardFormDialogComponent implements OnInit {
+export class WithdrawDelegatorRewardFormDialogComponent implements OnInit, OnChanges {
   @Input()
   currentStoredWallet?: StoredWallet | null;
   @Input()

projects/portal/src/app/views/dialogs/delegate/withdraw-validator-commission-form-dialog/withdraw-validator-commission-form-dialog.component.ts

@@ -1,5 +1,5 @@
 import { DialogRef } from '@angular/cdk/dialog';
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
+import { Component, EventEmitter, Input, OnChanges, OnInit, Output } from '@angular/core';
 import cosmosclient from '@cosmos-client/core';
 import {
   DelegatorDelegations200Response,
@@ -18,7 +18,7 @@ export type WithdrawValidatorCommissionOnSubmitEvent = {
   templateUrl: './withdraw-validator-commission-form-dialog.component.html',
   styleUrls: ['./withdraw-validator-commission-form-dialog.component.css'],
 })
-export class WithdrawValidatorCommissionFormDialogComponent implements OnInit {
+export class WithdrawValidatorCommissionFormDialogComponent implements OnInit, OnChanges {
   @Input()
   currentStoredWallet?: StoredWallet | null;
   @Input()