|
diff --git a/frontend/src/app/components/pool-ranking/pool-ranking.component.scss b/frontend/src/app/components/pool-ranking/pool-ranking.component.scss
index fc58909f8..b82264503 100644
--- a/frontend/src/app/components/pool-ranking/pool-ranking.component.scss
+++ b/frontend/src/app/components/pool-ranking/pool-ranking.component.scss
@@ -110,4 +110,15 @@
.disabled {
pointer-events: none;
opacity: 0.5;
-}
\ No newline at end of file
+}
+
+td {
+ .difference {
+ &.positive {
+ color: rgb(66, 183, 71);
+ }
+ &.negative {
+ color: rgb(183, 66, 66);
+ }
+ }
+}
diff --git a/frontend/src/app/components/start/start.component.html b/frontend/src/app/components/start/start.component.html
index ec4bf4805..5cf7b4fd9 100644
--- a/frontend/src/app/components/start/start.component.html
+++ b/frontend/src/app/components/start/start.component.html
@@ -18,7 +18,7 @@
(dragstart)="onDragStart($event)"
(scroll)="onScroll($event)"
>
-
+
diff --git a/frontend/src/app/components/start/start.component.ts b/frontend/src/app/components/start/start.component.ts
index 3bd0c086e..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;
@@ -40,10 +41,11 @@ export class StartComponent implements OnInit, OnDestroy {
minScrollWidth: number;
pageIndex: number = 0;
pages: any[] = [];
- pendingMark: number | void = null;
+ pendingMark: number | null = null;
lastUpdate: number = 0;
lastMouseX: number;
velocity: number = 0;
+ mempoolOffset: number = 0;
constructor(
private stateService: StateService,
@@ -70,19 +72,40 @@ export class StartComponent implements OnInit, OnDestroy {
this.chainTip = height;
this.tipIsSet = true;
this.updatePages();
- if (this.pendingMark != null) {
- this.scrollToBlock(this.pendingMark);
- this.pendingMark = null;
- }
+ this.applyPendingMarkArrow();
});
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) {
- if (!this.blockInViewport(mark.blockHeight)) {
- this.scrollToBlock(mark.blockHeight);
+ let scrollToHeight = blockHeight;
+ if (blockHeight < 0) {
+ scrollToHeight = this.chainTip - blockHeight;
}
- } else {
- this.pendingMark = mark.blockHeight;
+ if (newMark && !this.blockInViewport(scrollToHeight)) {
+ this.scrollToBlock(scrollToHeight);
+ }
+ }
+ if (!this.tipIsSet || (blockHeight < 0 && !this.mempoolOffset)) {
+ this.pendingMark = blockHeight;
}
}
});
@@ -117,6 +140,24 @@ export class StartComponent implements OnInit, OnDestroy {
});
}
+ onMempoolOffsetChange(offset): void {
+ const delta = offset - this.mempoolOffset;
+ this.addConvertedScrollOffset(delta);
+ this.mempoolOffset = offset;
+ this.applyPendingMarkArrow();
+ }
+
+ applyPendingMarkArrow(): void {
+ if (this.pendingMark != null) {
+ if (this.pendingMark < 0) {
+ this.scrollToBlock(this.chainTip - this.pendingMark);
+ } else {
+ this.scrollToBlock(this.pendingMark);
+ }
+ this.pendingMark = null;
+ }
+ }
+
@HostListener('window:resize', ['$event'])
onResize(): void {
this.isMobile = window.innerWidth <= 767.98;
@@ -350,7 +391,7 @@ export class StartComponent implements OnInit, OnDestroy {
resetScroll(): void {
this.scrollToBlock(this.chainTip);
- this.blockchainContainer.nativeElement.scrollLeft = 0;
+ this.setScrollLeft(0);
}
getPageIndexOf(height: number): number {
@@ -368,9 +409,17 @@ export class StartComponent implements OnInit, OnDestroy {
getConvertedScrollOffset(): number {
if (this.timeLtr) {
- return -this.blockchainContainer?.nativeElement?.scrollLeft || 0;
+ return -(this.blockchainContainer?.nativeElement?.scrollLeft || 0) - this.mempoolOffset;
} else {
- return this.blockchainContainer?.nativeElement?.scrollLeft || 0;
+ return (this.blockchainContainer?.nativeElement?.scrollLeft || 0) - this.mempoolOffset;
+ }
+ }
+
+ setScrollLeft(offset: number): void {
+ if (this.timeLtr) {
+ this.blockchainContainer.nativeElement.scrollLeft = offset - this.mempoolOffset;
+ } else {
+ this.blockchainContainer.nativeElement.scrollLeft = offset + this.mempoolOffset;
}
}
@@ -388,7 +437,7 @@ export class StartComponent implements OnInit, OnDestroy {
ngOnDestroy() {
if (this.blockchainContainer?.nativeElement) {
// clean up scroll position to prevent caching wrong scroll in Firefox
- this.blockchainContainer.nativeElement.scrollLeft = 0;
+ this.setScrollLeft(0);
}
this.timeLtrSubscription.unsubscribe();
this.chainTipSubscription.unsubscribe();
diff --git a/frontend/src/app/components/transaction/transaction.component.ts b/frontend/src/app/components/transaction/transaction.component.ts
index e7fbaa913..bbf679dcf 100644
--- a/frontend/src/app/components/transaction/transaction.component.ts
+++ b/frontend/src/app/components/transaction/transaction.component.ts
@@ -241,6 +241,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;
@@ -360,6 +361,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/interfaces/node-api.interface.ts b/frontend/src/app/interfaces/node-api.interface.ts
index 648eb38ea..68c45b3b2 100644
--- a/frontend/src/app/interfaces/node-api.interface.ts
+++ b/frontend/src/app/interfaces/node-api.interface.ts
@@ -91,6 +91,7 @@ export interface SinglePoolStats {
logo: string;
slug: string;
avgMatchRate: number;
+ avgFeeDelta: number;
}
export interface PoolsStats {
blockCount: number;
diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts
index fb3b37e05..738893bbc 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, scan, shareReplay, tap } from 'rxjs/operators';
import { StorageService } from './storage.service';
-interface MarkBlockState {
+export interface MarkBlockState {
blockHeight?: number;
+ txid?: string;
mempoolBlockIndex?: number;
txFeePerVSize?: number;
mempoolPosition?: MempoolPosition;
diff --git a/production/install b/production/install
index 8f3491591..5ee445a21 100755
--- a/production/install
+++ b/production/install
@@ -361,10 +361,10 @@ BITCOIN_ELECTRS_REPO_NAME=electrs
BITCOIN_ELECTRS_REPO_BRANCH=mempool
BITCOIN_ELECTRS_LATEST_RELEASE=mempool
-ELEMENTS_ELECTRS_REPO_URL=https://github.com/blockstream/electrs
+ELEMENTS_ELECTRS_REPO_URL=https://github.com/mempool/electrs
ELEMENTS_ELECTRS_REPO_NAME=electrs
-ELEMENTS_ELECTRS_REPO_BRANCH=new-index
-ELEMENTS_ELECTRS_LATEST_RELEASE=new-index
+ELEMENTS_ELECTRS_REPO_BRANCH=mempool
+ELEMENTS_ELECTRS_LATEST_RELEASE=mempool
LIQUID_ASSET_REGISTRY_DB_URL=https://github.com/blockstream/asset_registry_db
LIQUID_ASSET_REGISTRY_DB_NAME=asset_registry_db