Only show relevant hashrate in the pool page

This commit is contained in:
nymkappa
2022-03-08 13:54:04 +01:00
parent 0e2e420a1c
commit dd3f43f7b2
8 changed files with 53 additions and 80 deletions

View File

@@ -1,36 +1,11 @@
<div class="container">
<div *ngIf="poolStats$ | async as poolStats">
<div style="display: flex; justify-content: space-between; flex-wrap: wrap;">
<h1 class="m-0">
<img width="50" src="{{ poolStats['logo'] }}" onError="this.src = './resources/mining-pools/default.svg'"
class="mr-3">
{{ poolStats.pool.name }}
</h1>
<div class="pl-0 bg-transparent">
<div class="card-header mb-0 mb-lg-4 pr-0 pl-0">
<form [formGroup]="radioGroupForm" class="formRadioGroup ml-0">
<div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
<label ngbButtonLabel class="btn-primary btn-sm">
<input ngbButton type="radio" [value]="'6m'"> 6M
</label>
<label ngbButtonLabel class="btn-primary btn-sm">
<input ngbButton type="radio" [value]="'1y'"> 1Y
</label>
<label ngbButtonLabel class="btn-primary btn-sm">
<input ngbButton type="radio" [value]="'2y'"> 2Y
</label>
<label ngbButtonLabel class="btn-primary btn-sm">
<input ngbButton type="radio" [value]="'3y'"> 3Y
</label>
<label ngbButtonLabel class="btn-primary btn-sm">
<input ngbButton type="radio" [value]="'all'"> ALL
</label>
</div>
</form>
</div>
</div>
</div>
<h1 class="m-0">
<img width="50" src="{{ poolStats['logo'] }}" onError="this.src = './resources/mining-pools/default.svg'"
class="mr-3">
{{ poolStats.pool.name }}
</h1>
<div class="box">
<div class="row">

View File

@@ -1,9 +1,8 @@
import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
import { ActivatedRoute } from '@angular/router';
import { EChartsOption, graphic } from 'echarts';
import { BehaviorSubject, combineLatest, Observable } from 'rxjs';
import { distinctUntilChanged, map, startWith, switchMap, tap, toArray } from 'rxjs/operators';
import { BehaviorSubject, Observable } from 'rxjs';
import { distinctUntilChanged, map, switchMap, tap, toArray } from 'rxjs/operators';
import { BlockExtended, PoolStat } from 'src/app/interfaces/node-api.interface';
import { ApiService } from 'src/app/services/api.service';
import { StateService } from 'src/app/services/state.service';
@@ -24,8 +23,6 @@ export class PoolComponent implements OnInit {
blocks$: Observable<BlockExtended[]>;
isLoading = true;
radioGroupForm: FormGroup;
chartOptions: EChartsOption = {};
chartInitOptions = {
renderer: 'svg',
@@ -44,34 +41,27 @@ export class PoolComponent implements OnInit {
private apiService: ApiService,
private route: ActivatedRoute,
public stateService: StateService,
private formBuilder: FormBuilder,
) {
this.radioGroupForm = this.formBuilder.group({ dateSpan: 'all' });
this.radioGroupForm.controls.dateSpan.setValue('all');
}
ngOnInit(): void {
this.poolStats$ = combineLatest([
this.route.params.pipe(map((params) => params.poolId)),
this.radioGroupForm.get('dateSpan').valueChanges.pipe(startWith('all')),
])
this.poolStats$ = this.route.params.pipe(map((params) => params.poolId))
.pipe(
switchMap((params: any) => {
this.poolId = params[0];
return this.apiService.getPoolHashrate$(this.poolId, params[1] ?? 'all')
switchMap((poolId: any) => {
this.poolId = poolId;
return this.apiService.getPoolHashrate$(this.poolId)
.pipe(
switchMap((data) => {
this.prepareChartOptions(data.hashrates.map(val => [val.timestamp * 1000, val.avgHashrate]));
return params;
return poolId;
}),
toArray(),
)
}),
switchMap((params: any) => {
switchMap(() => {
if (this.blocks.length === 0) {
this.fromHeightSubject.next(undefined);
}
return this.apiService.getPoolStats$(this.poolId, params[1] ?? '1w');
return this.apiService.getPoolStats$(this.poolId);
}),
map((poolStats) => {
let regexes = '"';

View File

@@ -136,15 +136,12 @@ export class ApiService {
);
}
getPoolStats$(poolId: number, interval: string | undefined): Observable<PoolStat> {
return this.httpClient.get<PoolStat>(
this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/pool/${poolId}` +
(interval !== undefined ? `/${interval}` : '')
);
getPoolStats$(poolId: number): Observable<PoolStat> {
return this.httpClient.get<PoolStat>(this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/pool/${poolId}`);
}
getPoolHashrate$(poolId: number, interval: string | undefined): Observable<any> {
return this.httpClient.get<any>(this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/pool/${poolId}/hashrate/${interval}`);
getPoolHashrate$(poolId: number): Observable<any> {
return this.httpClient.get<any>(this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/pool/${poolId}/hashrate`);
}
getPoolBlocks$(poolId: number, fromHeight: number): Observable<BlockExtended[]> {