From 50f98807a3d2980ffd5687f875a592040f5bab30 Mon Sep 17 00:00:00 2001
From: softsimon <softsimon@protonmail.com>
Date: Sun, 10 May 2020 17:44:19 +0700
Subject: [PATCH] Graph x-axis date fix.

---
 .../mempool-graph/mempool-graph.component.ts    | 17 ++++++++++++++++-
 .../statistics/statistics.component.html        |  2 +-
 .../transactions-list.component.html            |  2 +-
 3 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/frontend/src/app/components/mempool-graph/mempool-graph.component.ts b/frontend/src/app/components/mempool-graph/mempool-graph.component.ts
index 08f1ea99f..d3f476fc1 100644
--- a/frontend/src/app/components/mempool-graph/mempool-graph.component.ts
+++ b/frontend/src/app/components/mempool-graph/mempool-graph.component.ts
@@ -12,6 +12,7 @@ import { StateService } from 'src/app/services/state.service';
 })
 export class MempoolGraphComponent implements OnInit, OnChanges {
   @Input() data;
+  @Input() dateSpan = '2h';
 
   network = '';
   mempoolVsizeFeesOptions: any;
@@ -26,7 +27,21 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
   ngOnInit(): void {
     this.stateService.networkChanged$.subscribe((network) => this.network = network);
     const labelInterpolationFnc = (value: any, index: any) => {
-      return index % 6  === 0 ? formatDate(value, 'HH:mm', this.locale) : null;
+      switch (this.dateSpan) {
+        case '2h':
+        case '24h':
+          value = formatDate(value, 'HH:mm', this.locale);
+          break;
+        case '1w':
+          value = formatDate(value, 'dd/MM HH:mm', this.locale);
+          break;
+        case '1m':
+        case '3m':
+        case '6m':
+        case '1y':
+          value = formatDate(value, 'dd/MM', this.locale);
+      }
+      return index % 6  === 0 ? value : null;
     };
 
     this.mempoolVsizeFeesOptions = {
diff --git a/frontend/src/app/components/statistics/statistics.component.html b/frontend/src/app/components/statistics/statistics.component.html
index 5ed3bb051..d0d3de6b5 100644
--- a/frontend/src/app/components/statistics/statistics.component.html
+++ b/frontend/src/app/components/statistics/statistics.component.html
@@ -44,7 +44,7 @@
         </div>
         <div class="card-body">
           <div style="height: 600px;">
-            <app-mempool-graph [data]="mempoolStats"></app-mempool-graph>
+            <app-mempool-graph [data]="mempoolStats" [dateSpan]="radioGroupForm.controls.dateSpan.value"></app-mempool-graph>
           </div>
         </div>
       </div>
diff --git a/frontend/src/app/components/transactions-list/transactions-list.component.html b/frontend/src/app/components/transactions-list/transactions-list.component.html
index 72aa5ef00..57171819b 100644
--- a/frontend/src/app/components/transactions-list/transactions-list.component.html
+++ b/frontend/src/app/components/transactions-list/transactions-list.component.html
@@ -55,7 +55,7 @@
             </tr>
             <tr *ngIf="tx.vin.length > tx['@vinLength']">
               <td colspan="3" class="text-center">
-                <button class="btn btn-sm btn-primary mt-2" (click)="loadMoreVin(tx)">Load more</button>
+                <button class="btn btn-sm btn-primary mt-2" (click)="loadMoreVin(tx)">Load more ({{ tx.vin.length - tx['@vinLength'] }})</button>
               </td>
             </tr>
           </tbody>