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

Apply proper datetime format according to choosen time scale and force 2h windowPreference in the dashboard

Browse Source
This commit is contained in:
nymkappa
2021-12-11 15:26:59 +09:00
parent bb82317456
commit b1368121f3
3 changed files with 65 additions and 32 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
frontend/src/app/components/mempool-graph/mempool-graph.component.ts
View File

@@ -1,7 +1,6 @@
import { Component, OnInit, Input, Inject, LOCALE_ID, ChangeDetectionStrategy, OnChanges } from '@angular/core';
import { formatDate } from '@angular/common';
import { VbytesPipe } from 'src/app/shared/pipes/bytes-pipe/vbytes.pipe';
import { formatNumber } from "@angular/common";
import { formatDate, formatNumber } from "@angular/common";
import { OptimizedMempoolStats } from 'src/app/interfaces/node-api.interface';
import { StateService } from 'src/app/services/state.service';
@@ -32,6 +31,7 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
@Input() left: number | string = 75;
@Input() template: ('widget' | 'advanced') = 'widget';
@Input() showZoom = true;
@Input() windowPreferenceOverride: string;
isLoading = true;
mempoolVsizeFeesData: any;
@@ -62,7 +62,7 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
if (!this.data) {
return;
}
this.windowPreference = this.storageService.getValue('graphWindowPreference');
this.windowPreference = this.windowPreferenceOverride ? this.windowPreferenceOverride : this.storageService.getValue('graphWindowPreference');
this.mempoolVsizeFeesData = this.handleNewMempoolData(this.data.concat([]));
this.mountFeeChart();
}
@@ -186,6 +186,33 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
type: 'line',
},
formatter: (params: any) => {
// Todo - Refactor
let axisValueLabel: string = "";
switch (this.windowPreference) {
case "2h":
axisValueLabel = `${formatDate(params[0].axisValue, 'h:mm a', this.locale)}`;
break;
case "24h":
axisValueLabel = `${formatDate(params[0].axisValue, 'EEE HH:mm', this.locale)}`
break;
case "1w":
axisValueLabel = `${formatDate(params[0].axisValue, 'MMM d HH:mm', this.locale)}`
break;
case "1m":
case "3m":
case "6m":
axisValueLabel = `${formatDate(params[0].axisValue, 'MMM d HH:00', this.locale)}`
break;
case "1y":
case "2y":
case "3y":
axisValueLabel = `${formatDate(params[0].axisValue, 'MMM d y', this.locale)}`
break;
default:
axisValueLabel = `${formatDate(params[0].axisValue, 'M/d', this.locale)}\n${formatDate(params[0].axisValue, 'H:mm', this.locale)}`
break;
}
const { totalValue, totalValueArray } = this.getTotalValues(params);
const itemFormatted = [];
let totalParcial = 0;
@@ -257,7 +284,7 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
const titleSum = $localize`Sum`;
return `<div class="fees-wrapper-tooltip-chart ${classActive}">
<div class="title">
${params[0].axisValueLabel}
${axisValueLabel}
<span class="total-value">
${this.vbytesPipe.transform(totalValue, 2, 'vB', 'MvB', false)}
</span>