Use amount shortener pipe for hashrate related data

frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts

@@ -3,7 +3,7 @@ import { Observable } from 'rxjs';
 import { map } from 'rxjs/operators';
 import { ApiService } from '@app/services/api.service';
 import { formatNumber } from '@angular/common';
-import { selectPowerOfTen } from '@app/bitcoin.utils';
+import { AmountShortenerPipe } from '@app/shared/pipes/amount-shortener.pipe';
 import { StateService } from '@app/services/state.service';
 
 @Component({
@@ -27,6 +27,7 @@ export class DifficultyAdjustmentsTable implements OnInit {
   constructor(
     @Inject(LOCALE_ID) public locale: string,
     private apiService: ApiService,
+    public amountShortenerPipe: AmountShortenerPipe,
     public stateService: StateService
   ) {
   }
@@ -43,14 +44,11 @@ export class DifficultyAdjustmentsTable implements OnInit {
           const data = response.body;
           const tableData = [];
           for (const adjustment of data) {
-            const selectedPowerOfTen: any = selectPowerOfTen(adjustment[2]);
             tableData.push({
               height: adjustment[1],
               timestamp: adjustment[0],
               change: (adjustment[3] - 1) * 100,
-              difficultyShorten: formatNumber(
-                adjustment[2] / selectedPowerOfTen.divider,
-                this.locale, `1.${decimals}-${decimals}`) + selectedPowerOfTen.unit
+              difficultyShorten: this.amountShortenerPipe.transform(adjustment[2], decimals)
             });
           }
           this.isLoading = false;

frontend/src/app/components/hashrate-chart/hashrate-chart.component.html

@@ -7,7 +7,7 @@
       <div class="item">
         <h5 class="card-title" i18n="mining.hashrate">Hashrate (1w)</h5>
         <p class="card-text">
-          {{ hashrates.currentHashrate | amountShortener: 1 : 'H/s' }}
+          {{ hashrates.currentHashrate | amountShortener: 3 : 'H/s' : false : true }}
         </p>
       </div>
       <div class="item">

frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts

@@ -13,6 +13,7 @@ import { download } from '@app/shared/graphs.utils';
 import { ActivatedRoute } from '@angular/router';
 import { StateService } from '@app/services/state.service';
 import { seoDescriptionNetwork } from '@app/shared/common.utils';
+import { AmountShortenerPipe } from '@app/shared/pipes/amount-shortener.pipe';
 
 @Component({
   selector: 'app-hashrate-chart',
@@ -60,6 +61,7 @@ export class HashrateChartComponent implements OnInit {
     private storageService: StorageService,
     private miningService: MiningService,
     private route: ActivatedRoute,
+    private amountShortenerPipe: AmountShortenerPipe,
     public stateService: StateService
   ) {
   }
@@ -250,29 +252,19 @@ export class HashrateChartComponent implements OnInit {
           let hashrateString = '';
           let difficultyString = '';
           let hashrateStringMA = '';
-          let hashratePowerOfTen: any = selectPowerOfTen(1);
 
           for (const tick of ticks) {
             if (tick.seriesIndex === 0) { // Hashrate
-              let hashrate = tick.data[1];
-              hashratePowerOfTen = selectPowerOfTen(tick.data[1], 10);
-              hashrate = tick.data[1] / hashratePowerOfTen.divider;
-              hashrateString = `${tick.marker} ${tick.seriesName}: ${formatNumber(hashrate, this.locale, '1.0-0')} ${hashratePowerOfTen.unit}H/s<br>`;
+              hashrateString = `${tick.marker} ${tick.seriesName}: ${this.amountShortenerPipe.transform(tick.data[1], 3, 'H/s', false, true)}<br>`;
             } else if (tick.seriesIndex === 1) { // Difficulty
-              let difficultyPowerOfTen = hashratePowerOfTen;
               let difficulty = tick.data[1];
               if (difficulty === null) {
                 difficultyString = `${tick.marker} ${tick.seriesName}: No data<br>`;
               } else {
-                difficultyPowerOfTen = selectPowerOfTen(tick.data[1]);
-                difficulty = tick.data[1] / difficultyPowerOfTen.divider;
-                difficultyString = `${tick.marker} ${tick.seriesName}: ${formatNumber(difficulty, this.locale, '1.2-2')} ${difficultyPowerOfTen.unit}<br>`;
+                difficultyString = `${tick.marker} ${tick.seriesName}: ${this.amountShortenerPipe.transform(tick.data[1], 2, '', false)}<br>`;
               }
             } else if (tick.seriesIndex === 2) { // Hashrate MA
-              let hashrate = tick.data[1];
-              hashratePowerOfTen = selectPowerOfTen(tick.data[1], 10);
-              hashrate = tick.data[1] / hashratePowerOfTen.divider;
-              hashrateStringMA = `${tick.marker} ${tick.seriesName}: ${formatNumber(hashrate, this.locale, '1.0-0')} ${hashratePowerOfTen.unit}H/s`;
+              hashrateStringMA = `${tick.marker} ${tick.seriesName}: ${this.amountShortenerPipe.transform(tick.data[1], 3, 'H/s', false, true)}<br>`;
             }
           }
 
@@ -346,9 +338,7 @@ export class HashrateChartComponent implements OnInit {
           axisLabel: {
             color: 'rgb(110, 112, 121)',
             formatter: (val): string => {
-              const selectedPowerOfTen: any = selectPowerOfTen(val);
-              const newVal = Math.round(val / selectedPowerOfTen.divider);
-              return `${newVal} ${selectedPowerOfTen.unit}H/s`;
+              return this.amountShortenerPipe.transform(val, 3, 'H/s', false, true).toString();
             },
             showMinLabel: false,
             showMaxLabel: false,
@@ -384,9 +374,7 @@ export class HashrateChartComponent implements OnInit {
               if (this.stateService.network === 'signet') {
                 return `${val}`;
               }
-              const selectedPowerOfTen: any = selectPowerOfTen(val);
-              const newVal = Math.round(val / selectedPowerOfTen.divider);
-              return `${newVal} ${selectedPowerOfTen.unit}`;
+              return this.amountShortenerPipe.transform(val, 3, '', false, true).toString();
             },
             showMinLabel: false,
             showMaxLabel: false,

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

@@ -98,7 +98,7 @@
                     </thead>
                     <tbody>
                       <td class="text-center"><app-amount [satoshis]="poolStats.totalReward" digitsInfo="1.0-0" [noFiat]="true" [ignoreViewMode]="true"></app-amount></td>
-                      <td class="text-center">{{ poolStats.estimatedHashrate | amountShortener : 1 : 'H/s' }}</td>
+                      <td class="text-center">{{ poolStats.estimatedHashrate | amountShortener : 3 : 'H/s' : false : true }}</td>
                       <td class="text-center" *ngIf="auditAvailable; else emptyTd"><span class="health-badge badge" [class.badge-success]="poolStats.avgBlockHealth >= 99"
                           [class.badge-warning]="poolStats.avgBlockHealth >= 75 && poolStats.avgBlockHealth < 99" [class.badge-danger]="poolStats.avgBlockHealth < 75"
                           *ngIf="poolStats.avgBlockHealth != null; else nullHealth">{{ poolStats.avgBlockHealth }}%</span>

frontend/src/app/components/pool/pool.component.ts

@@ -6,7 +6,7 @@ import { catchError, distinctUntilChanged, filter, map, share, switchMap, tap }
 import { BlockExtended, PoolStat } from '@interfaces/node-api.interface';
 import { ApiService } from '@app/services/api.service';
 import { StateService } from '@app/services/state.service';
-import { selectPowerOfTen } from '@app/bitcoin.utils';
+import { AmountShortenerPipe } from '@app/shared/pipes/amount-shortener.pipe';
 import { formatNumber } from '@angular/common';
 import { SeoService } from '@app/services/seo.service';
 import { HttpErrorResponse } from '@angular/common/http';
@@ -63,6 +63,7 @@ export class PoolComponent implements OnInit {
     private websocketService: WebsocketService,
     private miningService: MiningService,
     private seoService: SeoService,
+    public amountShortenerPipe: AmountShortenerPipe,
   ) {
     this.auditAvailable = this.stateService.env.AUDIT;
   }
@@ -217,9 +218,7 @@ export class PoolComponent implements OnInit {
 
           for (const tick of ticks) {
             if (tick.seriesIndex === 0) {
-              let hashratePowerOfTen = selectPowerOfTen(tick.data[1], 10);
-              let hashrateData = tick.data[1] / hashratePowerOfTen.divider;
-              hashrateString = `${tick.marker} ${tick.seriesName}: ${formatNumber(hashrateData, this.locale, '1.0-0')} ${hashratePowerOfTen.unit}H/s<br>`;
+              hashrateString = `${tick.marker} ${tick.seriesName}: ${this.amountShortenerPipe.transform(tick.data[1], 3, 'H/s', false, true)}<br>`;
             } else if (tick.seriesIndex === 1) {
               dominanceString = `${tick.marker} ${tick.seriesName}: ${formatNumber(tick.data[1], this.locale, '1.0-2')}%`;
             }             
@@ -271,9 +270,7 @@ export class PoolComponent implements OnInit {
           axisLabel: {
             color: 'rgb(110, 112, 121)',
             formatter: (val) => {
-              const selectedPowerOfTen: any = selectPowerOfTen(val);
-              const newVal = Math.round(val / selectedPowerOfTen.divider);
-              return `${newVal} ${selectedPowerOfTen.unit}H/s`
+              return this.amountShortenerPipe.transform(val, 3, 'H/s', false, true).toString();
             }
           },
           splitLine: {