Add stale block banner immediately on reorg

This commit is contained in:
Mononaut 2023-07-10 13:57:18 +09:00
parent e8c703fdbc
commit 842ac8ce39
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
3 changed files with 21 additions and 4 deletions

View File

@ -142,6 +142,9 @@ export class BlockComponent implements OnInit, OnDestroy {
if (block?.extras?.reward != undefined) { if (block?.extras?.reward != undefined) {
this.fees = block.extras.reward / 100000000 - this.blockSubsidy; this.fees = block.extras.reward / 100000000 - this.blockSubsidy;
} }
} else if (block.height === this.block.height) {
this.block.stale = true;
this.block.canonical = block.id;
} }
} }
}); });

View File

@ -36,6 +36,7 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
emptyBlocks: BlockExtended[] = this.mountEmptyBlocks(); emptyBlocks: BlockExtended[] = this.mountEmptyBlocks();
markHeight: number; markHeight: number;
chainTip: number; chainTip: number;
pendingMarkBlock: { animate: boolean, newBlockFromLeft: boolean };
blocksSubscription: Subscription; blocksSubscription: Subscription;
blockPageSubscription: Subscription; blockPageSubscription: Subscription;
networkSubscription: Subscription; networkSubscription: Subscription;
@ -83,7 +84,6 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
} }
ngOnInit() { ngOnInit() {
this.chainTip = this.stateService.latestBlockHeight;
this.dynamicBlocksAmount = Math.min(8, this.stateService.env.KEEP_BLOCKS_AMOUNT); this.dynamicBlocksAmount = Math.min(8, this.stateService.env.KEEP_BLOCKS_AMOUNT);
if (['', 'testnet', 'signet'].includes(this.stateService.network)) { if (['', 'testnet', 'signet'].includes(this.stateService.network)) {
@ -110,7 +110,7 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
return; return;
} }
const latestHeight = blocks[0].height; const latestHeight = blocks[0].height;
const animate = latestHeight > blocks[0].height; const animate = this.chainTip != null && latestHeight > this.chainTip;
for (const block of blocks) { for (const block of blocks) {
block.extras.minFee = this.getMinBlockFee(block); block.extras.minFee = this.getMinBlockFee(block);
@ -132,6 +132,11 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
} }
this.chainTip = latestHeight; this.chainTip = latestHeight;
if (this.pendingMarkBlock) {
this.moveArrowToPosition(this.pendingMarkBlock.animate, this.pendingMarkBlock.newBlockFromLeft);
this.pendingMarkBlock = null;
}
this.cd.markForCheck(); this.cd.markForCheck();
}); });
@ -202,7 +207,10 @@ export class BlockchainBlocksComponent implements OnInit, OnChanges, OnDestroy {
this.arrowVisible = false; this.arrowVisible = false;
return; return;
} }
const blockindex = this.blocks.findIndex((b) => b.height === this.markHeight); if (this.chainTip == null) {
this.pendingMarkBlock = { animate, newBlockFromLeft };
}
const blockindex = this.blocks.findIndex((b) => { console.log(b); return b.height === this.markHeight });
if (blockindex > -1) { if (blockindex > -1) {
if (!animate) { if (!animate) {
this.arrowTransition = 'inherit'; this.arrowTransition = 'inherit';

View File

@ -12,7 +12,7 @@ import {
tap tap
} from 'rxjs/operators'; } from 'rxjs/operators';
import { Transaction } from '../../interfaces/electrs.interface'; import { Transaction } from '../../interfaces/electrs.interface';
import { of, merge, Subscription, Observable, Subject, timer, from, throwError } from 'rxjs'; import { of, merge, Subscription, Observable, Subject, from, throwError } from 'rxjs';
import { StateService } from '../../services/state.service'; import { StateService } from '../../services/state.service';
import { CacheService } from '../../services/cache.service'; import { CacheService } from '../../services/cache.service';
import { WebsocketService } from '../../services/websocket.service'; import { WebsocketService } from '../../services/websocket.service';
@ -52,6 +52,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy {
queryParamsSubscription: Subscription; queryParamsSubscription: Subscription;
urlFragmentSubscription: Subscription; urlFragmentSubscription: Subscription;
mempoolBlocksSubscription: Subscription; mempoolBlocksSubscription: Subscription;
blocksSubscription: Subscription;
fragmentParams: URLSearchParams; fragmentParams: URLSearchParams;
rbfTransaction: undefined | Transaction; rbfTransaction: undefined | Transaction;
replaced: boolean = false; replaced: boolean = false;
@ -130,6 +131,10 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy {
this.outputIndex = (!isNaN(vout) && vout >= 0) ? vout : null; this.outputIndex = (!isNaN(vout) && vout >= 0) ? vout : null;
}); });
this.blocksSubscription = this.stateService.blocks$.subscribe((blocks) => {
this.latestBlock = blocks[0];
});
this.fetchCpfpSubscription = this.fetchCpfp$ this.fetchCpfpSubscription = this.fetchCpfp$
.pipe( .pipe(
switchMap((txId) => switchMap((txId) =>
@ -596,6 +601,7 @@ export class TransactionComponent implements OnInit, AfterViewInit, OnDestroy {
this.mempoolBlocksSubscription.unsubscribe(); this.mempoolBlocksSubscription.unsubscribe();
this.mempoolPositionSubscription.unsubscribe(); this.mempoolPositionSubscription.unsubscribe();
this.mempoolBlocksSubscription.unsubscribe(); this.mempoolBlocksSubscription.unsubscribe();
this.blocksSubscription.unsubscribe();
this.leaveTransaction(); this.leaveTransaction();
} }
} }