machankura/mempool
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add 24h and all time views to accelerator dashboard

Browse Source
This commit is contained in:
Mononaut 2024-07-11 16:48:41 +00:00
parent 5bb3e930cc
commit 75ca963bd5
No known key found for this signature in database
GPG Key ID: A3F058E41374C04E
4 changed files with 23 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
frontend/src/app/components/acceleration/acceleration-fees-graph/acceleration-fees-graph.component.ts
View File

@ -32,7 +32,7 @@ export class AccelerationFeesGraphComponent implements OnInit, OnChanges, OnDest
@Input() height: number = 300;
@Input() right: number | string = 45;
@Input() left: number | string = 75;
@Input() period: '3d' | '1w' | '1m' = '1w';
@Input() period: '24h' | '3d' | '1w' | '1m' | 'all' = '1w';
@Input() accelerations$: Observable<Acceleration[]>;
miningWindowPreference: string;
@ -48,7 +48,7 @@ export class AccelerationFeesGraphComponent implements OnInit, OnChanges, OnDest
isLoading = true;
formatNumber = formatNumber;
timespan = '';
periodSubject$: Subject<'3d' | '1w' | '1m'> = new Subject();
periodSubject$: Subject<'24h' | '3d' | '1w' | '1m' | 'all'> = new Subject();
chartInstance: any = undefined;
daysAvailable: number = 0;
@ -78,7 +78,7 @@ export class AccelerationFeesGraphComponent implements OnInit, OnChanges, OnDest
this.radioGroupForm.controls.dateSpan.setValue(this.miningWindowPreference);
this.route.fragment.subscribe((fragment) => {
if (['24h', '3d', '1w', '1m', '3m'].indexOf(fragment) > -1) {
if (['24h', '3d', '1w', '1m', '3m', 'all'].indexOf(fragment) > -1) {
this.radioGroupForm.controls.dateSpan.setValue(fragment, { emitEvent: false });
}
});

8
frontend/src/app/components/acceleration/acceleration-stats/acceleration-stats.component.ts
View File

@ -16,7 +16,7 @@ export type AccelerationStats = {
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class AccelerationStatsComponent implements OnInit, OnChanges {
@Input() timespan: '3d' | '1w' | '1m' = '1w';
@Input() timespan: '24h' | '3d' | '1w' | '1m' | 'all' = '1w';
accelerationStats$: Observable<AccelerationStats>;
blocksInPeriod: number = 7 * 144;
@ -35,6 +35,9 @@ export class AccelerationStatsComponent implements OnInit, OnChanges {
updateStats(): void {
this.accelerationStats$ = this.servicesApiService.getAccelerationStats$({ timeframe: this.timespan });
switch (this.timespan) {
case '24h':
this.blocksInPeriod = 144;
break;
case '3d':
this.blocksInPeriod = 3 * 144;
break;
@ -44,6 +47,9 @@ export class AccelerationStatsComponent implements OnInit, OnChanges {
case '1m':
this.blocksInPeriod = 30 * 144;
break;
case 'all':
this.blocksInPeriod = Infinity;
break;
}
}
}

12
frontend/src/app/components/acceleration/accelerator-dashboard/accelerator-dashboard.component.html
View File

@ -23,12 +23,18 @@
<div class="main-title">
<span [attr.data-cy]="'acceleration-stats'" i18n="accelerator.acceleration-stats">Acceleration stats</span>&nbsp;
@switch (timespan) {
@case ('24h') {
<span style="font-size: xx-small" i18n="mining.1-day">(1 day)</span>
}
@case ('1w') {
<span style="font-size: xx-small" i18n="mining.1-week">(1 week)</span>
}
@case ('1m') {
<span style="font-size: xx-small" i18n="mining.1-month">(1 month)</span>
}
@case ('all') {
<span style="font-size: xx-small" i18n="mining.all-time">(all time)</span>
}
}
</div>
<div class="card-wrapper">
@ -36,11 +42,17 @@
<div class="card-body more-padding">
<app-acceleration-stats [timespan]="timespan"></app-acceleration-stats>
<div class="widget-toggler">
<a href="" (click)="setTimespan('24h')" class="toggler-option"
[ngClass]="{'inactive': timespan === '24h'}"><small>24h</small></a>
<span style="color: #ffffff66; font-size: 8px"> | </span>
<a href="" (click)="setTimespan('1w')" class="toggler-option"
[ngClass]="{'inactive': timespan === '1w'}"><small>1w</small></a>
<span style="color: #ffffff66; font-size: 8px"> | </span>
<a href="" (click)="setTimespan('1m')" class="toggler-option"
[ngClass]="{'inactive': timespan === '1m'}"><small>1m</small></a>
<span style="color: #ffffff66; font-size: 8px"> | </span>
<a href="" (click)="setTimespan('all')" class="toggler-option"
[ngClass]="{'inactive': timespan === 'all'}"><small>all</small></a>
</div>
</div>
</div>

2
frontend/src/app/components/acceleration/accelerator-dashboard/accelerator-dashboard.component.ts
View File

@ -37,7 +37,7 @@ export class AcceleratorDashboardComponent implements OnInit, OnDestroy {
webGlEnabled = true;
seen: Set<string> = new Set();
firstLoad = true;
timespan: '3d' | '1w' | '1m' = '1w';
timespan: '24h' | '3d' | '1w' | '1m' | 'all' = '1w';
accelerationDeltaSubscription: Subscription;