diff --git a/backend/src/routes.ts b/backend/src/routes.ts index 35e48457a..3f34cc8da 100644 --- a/backend/src/routes.ts +++ b/backend/src/routes.ts @@ -57,6 +57,11 @@ class Routes { } public async getRecommendedFees(req: Request, res: Response) { + if (!mempool.isInSync()) { + res.statusCode = 503; + res.send('Service Unavailable'); + return; + } const result = feeApi.getRecommendedFee(); res.json(result); } diff --git a/frontend/src/app/components/about/about.component.html b/frontend/src/app/components/about/about.component.html index 7d0ef72d1..8d34f1a4a 100644 --- a/frontend/src/app/components/about/about.component.html +++ b/frontend/src/app/components/about/about.component.html @@ -115,10 +115,7 @@
- Git commit: - - {{ mempoolStats.gitCommit }} - + Git commit: {{ gitCommit$ | async }}

diff --git a/frontend/src/app/components/about/about.component.ts b/frontend/src/app/components/about/about.component.ts index ee7453bc1..ae8666bd4 100644 --- a/frontend/src/app/components/about/about.component.ts +++ b/frontend/src/app/components/about/about.component.ts @@ -3,7 +3,6 @@ import { WebsocketService } from '../../services/websocket.service'; import { SeoService } from 'src/app/services/seo.service'; import { StateService } from 'src/app/services/state.service'; import { Observable } from 'rxjs'; -import { MemPoolState } from 'src/app/interfaces/websocket.interface'; @Component({ selector: 'app-about', @@ -14,7 +13,7 @@ import { MemPoolState } from 'src/app/interfaces/websocket.interface'; export class AboutComponent implements OnInit { active = 1; hostname = document.location.hostname; - mempoolStats$: Observable; + gitCommit$: Observable; constructor( private websocketService: WebsocketService, @@ -23,7 +22,7 @@ export class AboutComponent implements OnInit { ) { } ngOnInit() { - this.mempoolStats$ = this.stateService.mempoolStats$; + this.gitCommit$ = this.stateService.gitCommit$; this.seoService.setTitle('Contributors'); this.websocketService.want(['blocks']); if (this.stateService.network === 'bisq') { diff --git a/frontend/src/app/components/footer/footer.component.html b/frontend/src/app/components/footer/footer.component.html index fd355d23c..a4b46fba5 100644 --- a/frontend/src/app/components/footer/footer.component.html +++ b/frontend/src/app/components/footer/footer.component.html @@ -3,18 +3,18 @@
Tx weight per second: - +  Backend is synchronizing
-
{{ mempoolInfoData.memPoolInfo.vBytesPerSecond | ceil | number }} vBytes/s
+
{{ mempoolInfoData.vBytesPerSecond | ceil | number }} vBytes/s
Unconfirmed transactions: -
{{ mempoolInfoData.memPoolInfo.memPoolInfo.size | number }}
+
{{ mempoolInfoData.memPoolInfo.size | number }}
Mempool size: diff --git a/frontend/src/app/components/footer/footer.component.ts b/frontend/src/app/components/footer/footer.component.ts index 2a2fa38b0..8b830efc4 100644 --- a/frontend/src/app/components/footer/footer.component.ts +++ b/frontend/src/app/components/footer/footer.component.ts @@ -1,8 +1,8 @@ import { Component, OnInit, ChangeDetectionStrategy } from '@angular/core'; import { StateService } from 'src/app/services/state.service'; -import { MemPoolState } from 'src/app/interfaces/websocket.interface'; -import { Observable } from 'rxjs'; +import { Observable, combineLatest } from 'rxjs'; import { map } from 'rxjs/operators'; +import { MempoolInfo } from 'src/app/interfaces/websocket.interface'; interface MempoolBlocksData { blocks: number; @@ -10,7 +10,8 @@ interface MempoolBlocksData { } interface MempoolInfoData { - memPoolInfo: MemPoolState; + memPoolInfo: MempoolInfo; + vBytesPerSecond: number; progressWidth: string; progressClass: string; } @@ -30,31 +31,35 @@ export class FooterComponent implements OnInit { ) { } ngOnInit() { - this.mempoolInfoData$ = this.stateService.mempoolStats$ - .pipe( - map((mempoolState) => { - const vBytesPerSecondLimit = 1667; - let vBytesPerSecond = mempoolState.vBytesPerSecond; - if (vBytesPerSecond > 1667) { - vBytesPerSecond = 1667; - } + this.mempoolInfoData$ = combineLatest([ + this.stateService.mempoolInfo$, + this.stateService.vbytesPerSecond$ + ]) + .pipe( + map(([mempoolInfo, vbytesPerSecond]) => { + const vBytesPerSecondLimit = 1667; + let vBytesPerSecond = vbytesPerSecond; + if (vBytesPerSecond > 1667) { + vBytesPerSecond = 1667; + } - const percent = Math.round((vBytesPerSecond / vBytesPerSecondLimit) * 100); + const percent = Math.round((vBytesPerSecond / vBytesPerSecondLimit) * 100); - let progressClass = 'bg-danger'; - if (percent <= 75) { - progressClass = 'bg-success'; - } else if (percent <= 99) { - progressClass = 'bg-warning'; - } + let progressClass = 'bg-danger'; + if (percent <= 75) { + progressClass = 'bg-success'; + } else if (percent <= 99) { + progressClass = 'bg-warning'; + } - return { - memPoolInfo: mempoolState, - progressWidth: percent + '%', - progressClass: progressClass, - }; - }) - ); + return { + memPoolInfo: mempoolInfo, + vBytesPerSecond: vBytesPerSecond, + progressWidth: percent + '%', + progressClass: progressClass, + }; + }) + ); this.mempoolBlocksData$ = this.stateService.mempoolBlocks$ .pipe( diff --git a/frontend/src/app/interfaces/websocket.interface.ts b/frontend/src/app/interfaces/websocket.interface.ts index c51b2a451..9da76da0f 100644 --- a/frontend/src/app/interfaces/websocket.interface.ts +++ b/frontend/src/app/interfaces/websocket.interface.ts @@ -28,12 +28,6 @@ export interface MempoolBlock { index: number; } -export interface MemPoolState { - memPoolInfo: MempoolInfo; - vBytesPerSecond: number; - gitCommit: string; -} - export interface MempoolInfo { size: number; bytes: number; diff --git a/frontend/src/app/services/state.service.ts b/frontend/src/app/services/state.service.ts index 73ef0c924..9f6af5772 100644 --- a/frontend/src/app/services/state.service.ts +++ b/frontend/src/app/services/state.service.ts @@ -1,7 +1,7 @@ import { Injectable } from '@angular/core'; import { ReplaySubject, BehaviorSubject, Subject, fromEvent } from 'rxjs'; import { Block, Transaction } from '../interfaces/electrs.interface'; -import { MempoolBlock, MemPoolState } from '../interfaces/websocket.interface'; +import { MempoolBlock, MempoolInfo } from '../interfaces/websocket.interface'; import { OptimizedMempoolStats } from '../interfaces/node-api.interface'; import { Router, NavigationStart } from '@angular/router'; import { env } from '../app.constants'; @@ -24,12 +24,14 @@ export class StateService { blocks$ = new ReplaySubject<[Block, boolean]>(env.KEEP_BLOCKS_AMOUNT); conversions$ = new ReplaySubject(1); bsqPrice$ = new ReplaySubject(1); - mempoolStats$ = new ReplaySubject(1); + mempoolInfo$ = new ReplaySubject(1); mempoolBlocks$ = new ReplaySubject(1); txReplaced$ = new Subject(); mempoolTransactions$ = new Subject(); blockTransactions$ = new Subject(); isLoadingWebSocket$ = new ReplaySubject(1); + vbytesPerSecond$ = new ReplaySubject(1); + gitCommit$ = new ReplaySubject(1); live2Chart$ = new Subject(); diff --git a/frontend/src/app/services/websocket.service.ts b/frontend/src/app/services/websocket.service.ts index c01391d02..997db4ee4 100644 --- a/frontend/src/app/services/websocket.service.ts +++ b/frontend/src/app/services/websocket.service.ts @@ -134,11 +134,15 @@ export class WebsocketService { } if (response.mempoolInfo) { - this.stateService.mempoolStats$.next({ - memPoolInfo: response.mempoolInfo, - vBytesPerSecond: response.vBytesPerSecond, - gitCommit: response['git-commit'] - }); + this.stateService.mempoolInfo$.next(response.mempoolInfo); + } + + if (response.vBytesPerSecond !== undefined) { + this.stateService.vbytesPerSecond$.next(response.vBytesPerSecond); + } + + if (response['git-commit']) { + this.stateService.gitCommit$.next(response['git-commit']); } if (this.goneOffline === true) {