Remodeling how historical fees are stored and presented.

fixes #908

backend/src/api/statistics.ts

@@ -85,17 +85,14 @@ class Statistics {
       250, 300, 350, 400, 500, 600, 700, 800, 900, 1000, 1200, 1400, 1600, 1800, 2000];
 
     const weightVsizeFees: { [feePerWU: number]: number } = {};
+    const lastItem = logFees.length - 1;
 
     memPoolArray.forEach((transaction) => {
       for (let i = 0; i < logFees.length; i++) {
         if (
-          (config.MEMPOOL.NETWORK === 'liquid'
+          (config.MEMPOOL.NETWORK === 'liquid' && (i === lastItem || transaction.effectiveFeePerVsize * 10 < logFees[i + 1]))
-            && ((logFees[i] === 2000 && transaction.effectiveFeePerVsize * 10 >= 2000)
-            || transaction.effectiveFeePerVsize * 10 <= logFees[i]))
           ||
-          (config.MEMPOOL.NETWORK !== 'liquid'
+          (config.MEMPOOL.NETWORK !== 'liquid' && (i === lastItem || transaction.effectiveFeePerVsize < logFees[i + 1]))
-            && ((logFees[i] === 2000 && transaction.effectiveFeePerVsize >= 2000)
-            || transaction.effectiveFeePerVsize <= logFees[i]))
         ) {
           if (weightVsizeFees[logFees[i]]) {
             weightVsizeFees[logFees[i]] += transaction.vsize;

frontend/src/app/components/mempool-graph/mempool-graph.component.ts

@@ -90,11 +90,6 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
     const labels = mempoolStats.map(stats => stats.added);
     const finalArrayVByte = this.generateArray(mempoolStats);
 
-    // Only Liquid has lower than 1 sat/vb transactions
-    if (this.stateService.network !== 'liquid') {
-      finalArrayVByte.shift();
-    }
-
     return {
       labels: labels,
       series: finalArrayVByte
@@ -104,10 +99,7 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
   generateArray(mempoolStats: OptimizedMempoolStats[]) {
     const finalArray: number[][] = [];
     let feesArray: number[] = [];
-    let limitFeesTemplate = this.template === 'advanced' ? 28 : 21;
+    let limitFeesTemplate = this.template === 'advanced' ? 26 : 20;
-    if (this.stateService.network === 'liquid') {
-      limitFeesTemplate = this.template === 'advanced' ? 26 : 20;
-    }
     for (let index = limitFeesTemplate; index > -1; index--) {
       feesArray = [];
       mempoolStats.forEach((stats) => {
@@ -370,18 +362,10 @@ export class MempoolGraphComponent implements OnInit, OnChanges {
         this.feeLimitIndex = i;
       }
       if (feeLevels[i] <= this.limitFee) {
-        if (i === 0) {
+        if (this.stateService.network === 'liquid') {
-          if (this.stateService.network === 'liquid') {
+          this.feeLevelsOrdered.push(`${(feeLevels[i] / 10).toFixed(1)} - ${(feeLevels[i + 1]  / 10).toFixed(1)}`);
-            this.feeLevelsOrdered.push('0 - 0.1');
-          } else {
-            this.feeLevelsOrdered.push('0 - 1');
-          }
         } else {
-          if (this.stateService.network === 'liquid') {
+          this.feeLevelsOrdered.push(`${feeLevels[i]} - ${feeLevels[i + 1]}`);
-            this.feeLevelsOrdered.push(`${feeLevels[i - 1] / 10} - ${feeLevels[i] / 10}`);
-          } else {
-            this.feeLevelsOrdered.push(`${feeLevels[i - 1]} - ${feeLevels[i]}`);
-          }
         }
       }
     }

frontend/src/app/components/statistics/statistics.component.html

@@ -42,26 +42,15 @@
                 <div class="dropdown-fees" ngbDropdownMenu aria-labelledby="dropdownFees">
                   <ul>
                     <ng-template ngFor let-fee let-i="index" [ngForOf]="feeLevels">
-                      <ng-template [ngIf]="fee === 1">
+                      <ng-template [ngIf]="fee <= 400">
-                        <li (click)="filterFees(fee)" [class]="filterFeeIndex > fee ? 'inactive' : ''">
-                          <ng-template [ngIf]="inverted">
-                            <span class="square" [ngStyle]="{'backgroundColor': chartColors[i]}"></span>
-                          </ng-template>
-                          <ng-template [ngIf]="!inverted">
-                            <span class="square" [ngStyle]="{'backgroundColor': chartColors[i - 1]}"></span>
-                          </ng-template>
-                          <span class="fee-text" >0 - {{ fee }}</span>
-                        </li>
-                      </ng-template>
-                      <ng-template [ngIf]="fee <= 500 && fee !== 1">
                         <li (click)="filterFees(fee)" [class]="filterFeeIndex > fee ? 'inactive' : ''">
                         <ng-template [ngIf]="inverted">
                           <span class="square" [ngStyle]="{'backgroundColor': chartColors[i]}"></span>
-                          <span class="fee-text" >{{feeLevels[i - 1]}} - {{ fee }}</span>
+                          <span class="fee-text" >{{feeLevels[i]}} - {{ feeLevels[i + 1] }}</span>
                         </ng-template>
                         <ng-template [ngIf]="!inverted">
                           <span class="square" [ngStyle]="{'backgroundColor': chartColors[i - 1]}"></span>
-                          <span class="fee-text" >{{feeLevels[i + 1]}} - {{ fee }}</span>
+                          <span class="fee-text" >{{feeLevels[i]}} - {{ feeLevels[i - 1] }}</span>
                         </ng-template>
                       </li>
                       </ng-template>