parent
							
								
									3e50e4541b
								
							
						
					
					
						commit
						059e82a805
					
				@ -331,21 +331,30 @@ class WebsocketHandler {
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
      if (client['track-tx'] && rbfTransactions[client['track-tx']]) {
 | 
			
		||||
        for (const rbfTransaction in rbfTransactions) {
 | 
			
		||||
          if (client['track-tx'] === rbfTransaction) {
 | 
			
		||||
            const rbfTx = rbfTransactions[rbfTransaction];
 | 
			
		||||
            if (config.MEMPOOL.BACKEND !== 'esplora') {
 | 
			
		||||
              try {
 | 
			
		||||
                const fullTx = await transactionUtils.$getTransactionExtended(rbfTransaction, true);
 | 
			
		||||
                response['rbfTransaction'] = fullTx;
 | 
			
		||||
              } catch (e) {
 | 
			
		||||
                logger.debug('Error finding transaction in mempool: ' + (e instanceof Error ? e.message : e));
 | 
			
		||||
      if (client['track-tx']) {
 | 
			
		||||
        const utxoSpent = newTransactions.some((tx) => {
 | 
			
		||||
          return tx.vin.some((vin) => vin.txid === client['track-tx']);
 | 
			
		||||
        });
 | 
			
		||||
        if (utxoSpent) {
 | 
			
		||||
          response['utxoSpent'] = true;
 | 
			
		||||
        }
 | 
			
		||||
 | 
			
		||||
        if (rbfTransactions[client['track-tx']]) {
 | 
			
		||||
          for (const rbfTransaction in rbfTransactions) {
 | 
			
		||||
            if (client['track-tx'] === rbfTransaction) {
 | 
			
		||||
              const rbfTx = rbfTransactions[rbfTransaction];
 | 
			
		||||
              if (config.MEMPOOL.BACKEND !== 'esplora') {
 | 
			
		||||
                try {
 | 
			
		||||
                  const fullTx = await transactionUtils.$getTransactionExtended(rbfTransaction, true);
 | 
			
		||||
                  response['rbfTransaction'] = fullTx;
 | 
			
		||||
                } catch (e) {
 | 
			
		||||
                  logger.debug('Error finding transaction in mempool: ' + (e instanceof Error ? e.message : e));
 | 
			
		||||
                }
 | 
			
		||||
              } else {
 | 
			
		||||
                response['rbfTransaction'] = rbfTx;
 | 
			
		||||
              }
 | 
			
		||||
            } else {
 | 
			
		||||
              response['rbfTransaction'] = rbfTx;
 | 
			
		||||
              break;
 | 
			
		||||
            }
 | 
			
		||||
            break;
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
      }
 | 
			
		||||
 | 
			
		||||
@ -185,15 +185,12 @@ export class TransactionComponent implements OnInit, OnDestroy {
 | 
			
		||||
          this.error = undefined;
 | 
			
		||||
          this.waitingForTransaction = false;
 | 
			
		||||
          this.setMempoolBlocksSubscription();
 | 
			
		||||
          this.websocketService.startTrackTransaction(tx.txid);
 | 
			
		||||
 | 
			
		||||
          if (!tx.status.confirmed) {
 | 
			
		||||
            this.websocketService.startTrackTransaction(tx.txid);
 | 
			
		||||
 | 
			
		||||
            if (tx.firstSeen) {
 | 
			
		||||
              this.transactionTime = tx.firstSeen;
 | 
			
		||||
            } else {
 | 
			
		||||
              this.getTransactionTime();
 | 
			
		||||
            }
 | 
			
		||||
          if (!tx.status.confirmed && tx.firstSeen) {
 | 
			
		||||
            this.transactionTime = tx.firstSeen;
 | 
			
		||||
          } else {
 | 
			
		||||
            this.getTransactionTime();
 | 
			
		||||
          }
 | 
			
		||||
 | 
			
		||||
          if (this.tx.status.confirmed) {
 | 
			
		||||
 | 
			
		||||
@ -82,7 +82,7 @@
 | 
			
		||||
                  </ng-template>
 | 
			
		||||
                </td>
 | 
			
		||||
              </tr>
 | 
			
		||||
              <tr *ngIf="displayDetails">
 | 
			
		||||
              <tr *ngIf="(showDetails$ | async) === true">
 | 
			
		||||
                <td colspan="3" class="details-container" >
 | 
			
		||||
                  <table class="table table-striped table-borderless details-table mb-3">
 | 
			
		||||
                    <tbody>
 | 
			
		||||
@ -183,16 +183,16 @@
 | 
			
		||||
                    <app-amount [satoshis]="vout.value"></app-amount>
 | 
			
		||||
                  </ng-template>
 | 
			
		||||
                </td>
 | 
			
		||||
                <td class="arrow-td">
 | 
			
		||||
                  <span *ngIf="!outspends[i] || vout.scriptpubkey_type === 'op_return' || vout.scriptpubkey_type === 'fee' ; else outspend" class="grey">
 | 
			
		||||
                <td class="arrow-td" *ngIf="{ value: (outspends$ | async) } as outspends">
 | 
			
		||||
                  <span *ngIf="!outspends.value || !outspends.value[i] || vout.scriptpubkey_type === 'op_return' || vout.scriptpubkey_type === 'fee' ; else outspend" class="grey">
 | 
			
		||||
                    <fa-icon [icon]="['fas', 'arrow-alt-circle-right']" [fixedWidth]="true"></fa-icon>
 | 
			
		||||
                  </span>
 | 
			
		||||
                  <ng-template #outspend>
 | 
			
		||||
                    <span *ngIf="!outspends[i][vindex] || !outspends[i][vindex].spent; else spent" class="green">
 | 
			
		||||
                    <span *ngIf="!outspends.value[i][vindex] || !outspends.value[i][vindex].spent; else spent" class="green">
 | 
			
		||||
                      <fa-icon [icon]="['fas', 'arrow-alt-circle-right']" [fixedWidth]="true"></fa-icon>
 | 
			
		||||
                    </span>
 | 
			
		||||
                    <ng-template #spent>
 | 
			
		||||
                      <a *ngIf="outspends[i][vindex].txid else outputNoTxId" [routerLink]="['/tx/' | relativeUrl, outspends[i][vindex].txid]" class="red">
 | 
			
		||||
                      <a *ngIf="outspends.value[i][vindex].txid else outputNoTxId" [routerLink]="['/tx/' | relativeUrl, outspends.value[i][vindex].txid]" class="red">
 | 
			
		||||
                        <fa-icon [icon]="['fas', 'arrow-alt-circle-right']" [fixedWidth]="true"></fa-icon>
 | 
			
		||||
                      </a>
 | 
			
		||||
                      <ng-template #outputNoTxId>
 | 
			
		||||
@ -204,7 +204,7 @@
 | 
			
		||||
                  </ng-template>
 | 
			
		||||
                </td>
 | 
			
		||||
              </tr>
 | 
			
		||||
              <tr *ngIf="displayDetails">
 | 
			
		||||
              <tr *ngIf="(showDetails$ | async) === true">
 | 
			
		||||
                <td colspan="3" class=" details-container" >
 | 
			
		||||
                  <table class="table table-striped table-borderless details-table mb-3">
 | 
			
		||||
                    <tbody>
 | 
			
		||||
 | 
			
		||||
@ -1,11 +1,11 @@
 | 
			
		||||
import { Component, OnInit, Input, ChangeDetectionStrategy, OnChanges, ChangeDetectorRef, Output, EventEmitter } from '@angular/core';
 | 
			
		||||
import { Component, OnInit, Input, ChangeDetectionStrategy, OnChanges, Output, EventEmitter } from '@angular/core';
 | 
			
		||||
import { StateService } from '../../services/state.service';
 | 
			
		||||
import { Observable, forkJoin } from 'rxjs';
 | 
			
		||||
import { Observable, forkJoin, ReplaySubject, BehaviorSubject, merge } from 'rxjs';
 | 
			
		||||
import { Outspend, Transaction } from '../../interfaces/electrs.interface';
 | 
			
		||||
import { ElectrsApiService } from '../../services/electrs-api.service';
 | 
			
		||||
import { environment } from 'src/environments/environment';
 | 
			
		||||
import { AssetsService } from 'src/app/services/assets.service';
 | 
			
		||||
import { map } from 'rxjs/operators';
 | 
			
		||||
import { map, share, switchMap } from 'rxjs/operators';
 | 
			
		||||
import { BlockExtended } from 'src/app/interfaces/node-api.interface';
 | 
			
		||||
 | 
			
		||||
@Component({
 | 
			
		||||
@ -17,7 +17,6 @@ import { BlockExtended } from 'src/app/interfaces/node-api.interface';
 | 
			
		||||
export class TransactionsListComponent implements OnInit, OnChanges {
 | 
			
		||||
  network = '';
 | 
			
		||||
  nativeAssetId = this.stateService.network === 'liquidtestnet' ? environment.nativeTestAssetId : environment.nativeAssetId;
 | 
			
		||||
  displayDetails = false;
 | 
			
		||||
 | 
			
		||||
  @Input() transactions: Transaction[];
 | 
			
		||||
  @Input() showConfirmations = false;
 | 
			
		||||
@ -28,15 +27,41 @@ export class TransactionsListComponent implements OnInit, OnChanges {
 | 
			
		||||
  @Output() loadMore = new EventEmitter();
 | 
			
		||||
 | 
			
		||||
  latestBlock$: Observable<BlockExtended>;
 | 
			
		||||
  outspends: Outspend[] = [];
 | 
			
		||||
  outspends$: Observable<Outspend[]>;
 | 
			
		||||
  refreshOutspends$: ReplaySubject<object> = new ReplaySubject();
 | 
			
		||||
  showDetails$ = new BehaviorSubject<boolean>(false);
 | 
			
		||||
  _outspends: Outspend[] = [];
 | 
			
		||||
  assetsMinimal: any;
 | 
			
		||||
 | 
			
		||||
  constructor(
 | 
			
		||||
    public stateService: StateService,
 | 
			
		||||
    private electrsApiService: ElectrsApiService,
 | 
			
		||||
    private assetsService: AssetsService,
 | 
			
		||||
    private ref: ChangeDetectorRef,
 | 
			
		||||
  ) { }
 | 
			
		||||
  ) {
 | 
			
		||||
    this.outspends$ = merge(
 | 
			
		||||
      this.refreshOutspends$,
 | 
			
		||||
      this.stateService.utxoSpent$
 | 
			
		||||
        .pipe(
 | 
			
		||||
          map(() => {
 | 
			
		||||
            this._outspends = [];
 | 
			
		||||
            return { 0: this.electrsApiService.getOutspends$(this.transactions[0].txid) };
 | 
			
		||||
          }),
 | 
			
		||||
        )
 | 
			
		||||
    ).pipe(
 | 
			
		||||
      switchMap((observableObject) => forkJoin(observableObject)),
 | 
			
		||||
      map((outspends: any) => {
 | 
			
		||||
        const newOutspends = [];
 | 
			
		||||
        for (const i in outspends) {
 | 
			
		||||
          if (outspends.hasOwnProperty(i)) {
 | 
			
		||||
            newOutspends.push(outspends[i]);
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        this._outspends = this._outspends.concat(newOutspends);
 | 
			
		||||
        return this._outspends;
 | 
			
		||||
      }),
 | 
			
		||||
      share(),
 | 
			
		||||
    );
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  ngOnInit() {
 | 
			
		||||
    this.latestBlock$ = this.stateService.blocks$.pipe(map(([block]) => block));
 | 
			
		||||
@ -65,23 +90,12 @@ export class TransactionsListComponent implements OnInit, OnChanges {
 | 
			
		||||
    this.transactions.forEach((tx, i) => {
 | 
			
		||||
      tx['@voutLimit'] = true;
 | 
			
		||||
      tx['@vinLimit'] = true;
 | 
			
		||||
      if (this.outspends[i]) {
 | 
			
		||||
      if (this._outspends[i]) {
 | 
			
		||||
        return;
 | 
			
		||||
      }
 | 
			
		||||
      observableObject[i] = this.electrsApiService.getOutspends$(tx.txid);
 | 
			
		||||
    });
 | 
			
		||||
 | 
			
		||||
    forkJoin(observableObject)
 | 
			
		||||
      .subscribe((outspends: any) => {
 | 
			
		||||
        const newOutspends = [];
 | 
			
		||||
        for (const i in outspends) {
 | 
			
		||||
          if (outspends.hasOwnProperty(i)) {
 | 
			
		||||
            newOutspends.push(outspends[i]);
 | 
			
		||||
          }
 | 
			
		||||
        }
 | 
			
		||||
        this.outspends = this.outspends.concat(newOutspends);
 | 
			
		||||
        this.ref.markForCheck();
 | 
			
		||||
      });
 | 
			
		||||
    this.refreshOutspends$.next(observableObject);
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  onScroll() {
 | 
			
		||||
@ -129,7 +143,10 @@ export class TransactionsListComponent implements OnInit, OnChanges {
 | 
			
		||||
  }
 | 
			
		||||
 | 
			
		||||
  toggleDetails() {
 | 
			
		||||
    this.displayDetails = !this.displayDetails;
 | 
			
		||||
    this.ref.markForCheck();
 | 
			
		||||
    if (this.showDetails$.value === true) {
 | 
			
		||||
      this.showDetails$.next(false);
 | 
			
		||||
    } else {
 | 
			
		||||
      this.showDetails$.next(true);
 | 
			
		||||
    }
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
@ -16,6 +16,7 @@ export interface WebsocketResponse {
 | 
			
		||||
  data?: string[];
 | 
			
		||||
  tx?: Transaction;
 | 
			
		||||
  rbfTransaction?: Transaction;
 | 
			
		||||
  utxoSpent?: boolean;
 | 
			
		||||
  transactions?: TransactionStripped[];
 | 
			
		||||
  loadingIndicators?: ILoadingIndicators;
 | 
			
		||||
  backendInfo?: IBackendInfo;
 | 
			
		||||
 | 
			
		||||
@ -81,6 +81,7 @@ export class StateService {
 | 
			
		||||
  mempoolInfo$ = new ReplaySubject<MempoolInfo>(1);
 | 
			
		||||
  mempoolBlocks$ = new ReplaySubject<MempoolBlock[]>(1);
 | 
			
		||||
  txReplaced$ = new Subject<Transaction>();
 | 
			
		||||
  utxoSpent$ = new Subject<null>();
 | 
			
		||||
  mempoolTransactions$ = new Subject<Transaction>();
 | 
			
		||||
  blockTransactions$ = new Subject<Transaction>();
 | 
			
		||||
  isLoadingWebSocket$ = new ReplaySubject<boolean>(1);
 | 
			
		||||
 | 
			
		||||
@ -251,6 +251,10 @@ export class WebsocketService {
 | 
			
		||||
      this.stateService.bsqPrice$.next(response['bsq-price']);
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    if (response.utxoSpent) {
 | 
			
		||||
      this.stateService.utxoSpent$.next();
 | 
			
		||||
    }
 | 
			
		||||
 | 
			
		||||
    if (response.backendInfo) {
 | 
			
		||||
      this.stateService.backendInfo$.next(response.backendInfo);
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user