diff --git a/frontend/src/app/components/start/start.component.ts b/frontend/src/app/components/start/start.component.ts index 7a3b6b492..22d3d6350 100644 --- a/frontend/src/app/components/start/start.component.ts +++ b/frontend/src/app/components/start/start.component.ts @@ -1,6 +1,6 @@ import { Component, ElementRef, HostListener, OnInit, OnDestroy, ViewChild, Input } from '@angular/core'; import { Subscription } from 'rxjs'; -import { StateService } from '../../services/state.service'; +import { MarkBlockState, StateService } from '../../services/state.service'; import { specialBlocks } from '../../app.constants'; @Component({ @@ -24,6 +24,7 @@ export class StartComponent implements OnInit, OnDestroy { chainTipSubscription: Subscription; chainTip: number = -1; tipIsSet: boolean = false; + lastMark: MarkBlockState; markBlockSubscription: Subscription; blockCounterSubscription: Subscription; @ViewChild('blockchainContainer') blockchainContainer: ElementRef; @@ -75,20 +76,31 @@ export class StartComponent implements OnInit, OnDestroy { }); this.markBlockSubscription = this.stateService.markBlock$.subscribe((mark) => { let blockHeight; + let newMark = true; if (mark?.blockHeight != null) { + if (this.lastMark?.blockHeight === mark.blockHeight) { + newMark = false; + } blockHeight = mark.blockHeight; } else if (mark?.mempoolBlockIndex != null) { + if (this.lastMark?.mempoolBlockIndex === mark.mempoolBlockIndex || (mark.txid && this.lastMark?.txid === mark.txid)) { + newMark = false; + } blockHeight = -1 - mark.mempoolBlockIndex; } else if (mark?.mempoolPosition?.block != null) { + if (this.lastMark?.txid === mark.txid) { + newMark = false; + } blockHeight = -1 - mark.mempoolPosition.block; } + this.lastMark = mark; if (blockHeight != null) { if (this.tipIsSet) { let scrollToHeight = blockHeight; if (blockHeight < 0) { scrollToHeight = this.chainTip - blockHeight; } - if (!this.blockInViewport(scrollToHeight)) { + if (newMark && !this.blockInViewport(scrollToHeight)) { this.scrollToBlock(scrollToHeight); } } diff --git a/frontend/src/app/components/transaction/transaction.component.ts b/frontend/src/app/components/transaction/transaction.component.ts index dd32b05e8..85b90a378 100644 --- a/frontend/src/app/components/transaction/transaction.component.ts +++ b/frontend/src/app/components/transaction/transaction.component.ts @@ -240,6 +240,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { this.mempoolPosition = txPosition.position; if (this.tx && !this.tx.status.confirmed) { this.stateService.markBlock$.next({ + txid: txPosition.txid, mempoolPosition: this.mempoolPosition }); this.txInBlockIndex = this.mempoolPosition.block; @@ -359,6 +360,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy { } else { if (tx.cpfpChecked) { this.stateService.markBlock$.next({ + txid: tx.txid, txFeePerVSize: tx.effectiveFeePerVsize, mempoolPosition: this.mempoolPosition, }); diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts index 31f5f3aab..4f00622a8 100644 --- a/frontend/src/app/services/state.service.ts +++ b/frontend/src/app/services/state.service.ts @@ -8,8 +8,9 @@ import { isPlatformBrowser } from '@angular/common'; import { map, shareReplay } from 'rxjs/operators'; import { StorageService } from './storage.service'; -interface MarkBlockState { +export interface MarkBlockState { blockHeight?: number; + txid?: string; mempoolBlockIndex?: number; txFeePerVSize?: number; mempoolPosition?: MempoolPosition;