diff --git a/frontend/src/app/components/pool/pool.component.html b/frontend/src/app/components/pool/pool.component.html
index bef441a85..240648e2c 100644
--- a/frontend/src/app/components/pool/pool.component.html
+++ b/frontend/src/app/components/pool/pool.component.html
@@ -1,9 +1,9 @@
-
+
+ onError="this.src = './resources/mining-pools/default.svg'" class="mr-3">
{{ poolStats.pool.name }}
@@ -111,7 +111,7 @@
-
+
|
@@ -145,15 +145,15 @@
-
-
-
+
-
+
-
+
Mined Blocks |
diff --git a/frontend/src/app/components/pool/pool.component.scss b/frontend/src/app/components/pool/pool.component.scss
index 2e8a4f154..2a06de54a 100644
--- a/frontend/src/app/components/pool/pool.component.scss
+++ b/frontend/src/app/components/pool/pool.component.scss
@@ -45,7 +45,7 @@ div.scrollable {
}
.label {
- width: 30%;
+ width: 35%;
}
.data {
@@ -136,4 +136,18 @@ div.scrollable {
@media (max-width: 450px) {
text-align: right;
}
-}
\ No newline at end of file
+}
+
+.skeleton-loader {
+ max-width: 200px;
+}
+
+.loadingGraphs {
+ position: absolute;
+ left: calc(50% - 15px);
+ z-index: 100;
+ top: 475px;
+ @media (max-width: 992px) {
+ top: 600px;
+ }
+}
diff --git a/frontend/src/app/components/pool/pool.component.ts b/frontend/src/app/components/pool/pool.component.ts
index 529298f65..dee4a9713 100644
--- a/frontend/src/app/components/pool/pool.component.ts
+++ b/frontend/src/app/components/pool/pool.component.ts
@@ -1,7 +1,7 @@
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { EChartsOption, graphic } from 'echarts';
-import { BehaviorSubject, Observable } from 'rxjs';
+import { BehaviorSubject, Observable, timer } from 'rxjs';
import { map, switchMap, tap } from 'rxjs/operators';
import { BlockExtended, PoolStat } from 'src/app/interfaces/node-api.interface';
import { ApiService } from 'src/app/services/api.service';
@@ -13,14 +13,6 @@ import { formatNumber } from '@angular/common';
selector: 'app-pool',
templateUrl: './pool.component.html',
styleUrls: ['./pool.component.scss'],
- styles: [`
- .loadingGraphs {
- position: absolute;
- top: 50%;
- left: calc(50% - 15px);
- z-index: 100;
- }
- `],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class PoolComponent implements OnInit {
@@ -31,7 +23,6 @@ export class PoolComponent implements OnInit {
poolStats$: Observable;
blocks$: Observable;
isLoading = true;
- skeletonLines: number[] = [...Array(5).keys()];
chartOptions: EChartsOption = {};
chartInitOptions = {
@@ -40,11 +31,11 @@ export class PoolComponent implements OnInit {
height: 'auto',
};
- loadMoreSubject: BehaviorSubject = new BehaviorSubject(undefined);
-
blocks: BlockExtended[] = [];
poolId: number = undefined;
+ loadMoreSubject: BehaviorSubject = new BehaviorSubject(this.poolId);
+
constructor(
@Inject(LOCALE_ID) public locale: string,
private apiService: ApiService,
@@ -59,6 +50,7 @@ export class PoolComponent implements OnInit {
switchMap((poolId: any) => {
this.isLoading = true;
this.poolId = poolId;
+ this.loadMoreSubject.next(this.poolId);
return this.apiService.getPoolHashrate$(this.poolId)
.pipe(
switchMap((data) => {
@@ -88,6 +80,9 @@ export class PoolComponent implements OnInit {
this.blocks$ = this.loadMoreSubject
.pipe(
switchMap((flag) => {
+ if (this.poolId === undefined) {
+ return [];
+ }
return this.apiService.getPoolBlocks$(this.poolId, this.blocks[this.blocks.length - 1]?.height);
}),
tap((newBlocks) => {
@@ -187,7 +182,7 @@ export class PoolComponent implements OnInit {
}
loadMore() {
- this.loadMoreSubject.next(undefined);
+ this.loadMoreSubject.next(this.poolId);
}
trackByBlock(index: number, block: BlockExtended) {