Merge pull request #1548 from mempool/nymkappa/feature/timespan-selec…

…tor-update Use block count instead of oldest block for timespan selection
mempool · Apr 24, 2022 · 7133451 · 7133451
2 parents 369a986 + 0803fed
commit 7133451
Show file tree

Hide file tree

Showing 16 changed files with 98 additions and 120 deletions.
diff --git a/backend/src/repositories/HashratesRepository.ts b/backend/src/repositories/HashratesRepository.ts
@@ -102,7 +102,7 @@ class HashratesRepository {
   /**
    * Returns a pool hashrate history
    */
-   public async $getPoolWeeklyHashrate(slug: string): Promise<any[]> {
+  public async $getPoolWeeklyHashrate(slug: string): Promise<any[]> {
     const pool = await PoolsRepository.$getPool(slug);
     if (!pool) {
       throw new Error(`This mining pool does not exist`);

diff --git a/backend/src/routes.ts b/backend/src/routes.ts
@@ -575,8 +575,10 @@ class Routes {
   public async $getPools(interval: string, req: Request, res: Response) {
     try {
       const stats = await miningStats.$getPoolsStats(interval);
+      const blockCount = await BlocksRepository.$blockCount(null, null);
       res.header('Pragma', 'public');
       res.header('Cache-control', 'public');
+      res.header('X-total-count', blockCount.toString());
       res.setHeader('Expires', new Date(Date.now() + 1000 * 60).toUTCString());
       res.json(stats);
     } catch (e) {
@@ -587,14 +589,12 @@ class Routes {
   public async $getPoolsHistoricalHashrate(req: Request, res: Response) {
     try {
       const hashrates = await HashratesRepository.$getPoolsWeeklyHashrate(req.params.interval ?? null);
-      const oldestIndexedBlockTimestamp = await BlocksRepository.$oldestBlockTimestamp();
+      const blockCount = await BlocksRepository.$blockCount(null, null);
       res.header('Pragma', 'public');
       res.header('Cache-control', 'public');
+      res.header('X-total-count', blockCount.toString());
       res.setHeader('Expires', new Date(Date.now() + 1000 * 300).toUTCString());
-      res.json({
-        oldestIndexedBlockTimestamp: oldestIndexedBlockTimestamp,
-        hashrates: hashrates,
-      });
+      res.json(hashrates);
     } catch (e) {
       res.status(500).send(e instanceof Error ? e.message : e);
     }
@@ -603,14 +603,12 @@ class Routes {
   public async $getPoolHistoricalHashrate(req: Request, res: Response) {
     try {
       const hashrates = await HashratesRepository.$getPoolWeeklyHashrate(req.params.slug);
-      const oldestIndexedBlockTimestamp = await BlocksRepository.$oldestBlockTimestamp();
+      const blockCount = await BlocksRepository.$blockCount(null, null);
       res.header('Pragma', 'public');
       res.header('Cache-control', 'public');
+      res.header('X-total-count', blockCount.toString());
       res.setHeader('Expires', new Date(Date.now() + 1000 * 300).toUTCString());
-      res.json({
-        oldestIndexedBlockTimestamp: oldestIndexedBlockTimestamp,
-        hashrates: hashrates,
-      });
+      res.json(hashrates);
     } catch (e) {
       if (e instanceof Error && e.message.indexOf('This mining pool does not exist') > -1) {
         res.status(404).send(e.message);
@@ -624,12 +622,12 @@ class Routes {
     try {
       const hashrates = await HashratesRepository.$getNetworkDailyHashrate(req.params.interval ?? null);
       const difficulty = await BlocksRepository.$getBlocksDifficulty(req.params.interval ?? null);
-      const oldestIndexedBlockTimestamp = await BlocksRepository.$oldestBlockTimestamp();
+      const blockCount = await BlocksRepository.$blockCount(null, null);
       res.header('Pragma', 'public');
       res.header('Cache-control', 'public');
+      res.header('X-total-count', blockCount.toString());
       res.setHeader('Expires', new Date(Date.now() + 1000 * 300).toUTCString());
       res.json({
-        oldestIndexedBlockTimestamp: oldestIndexedBlockTimestamp,
         hashrates: hashrates,
         difficulty: difficulty,
       });
@@ -641,14 +639,12 @@ class Routes {
   public async $getHistoricalBlockFees(req: Request, res: Response) {
     try {
       const blockFees = await mining.$getHistoricalBlockFees(req.params.interval ?? null);
-      const oldestIndexedBlockTimestamp = await BlocksRepository.$oldestBlockTimestamp();
+      const blockCount = await BlocksRepository.$blockCount(null, null);
       res.header('Pragma', 'public');
       res.header('Cache-control', 'public');
+      res.header('X-total-count', blockCount.toString());
       res.setHeader('Expires', new Date(Date.now() + 1000 * 300).toUTCString());
-      res.json({
-        oldestIndexedBlockTimestamp: oldestIndexedBlockTimestamp,
-        blockFees: blockFees,
-      });
+      res.json(blockFees);
     } catch (e) {
       res.status(500).send(e instanceof Error ? e.message : e);
     }
@@ -657,14 +653,12 @@ class Routes {
   public async $getHistoricalBlockRewards(req: Request, res: Response) {
     try {
       const blockRewards = await mining.$getHistoricalBlockRewards(req.params.interval ?? null);
-      const oldestIndexedBlockTimestamp = await BlocksRepository.$oldestBlockTimestamp();
+      const blockCount = await BlocksRepository.$blockCount(null, null);
       res.header('Pragma', 'public');
       res.header('Cache-control', 'public');
+      res.header('X-total-count', blockCount.toString());
       res.setHeader('Expires', new Date(Date.now() + 1000 * 300).toUTCString());
-      res.json({
-        oldestIndexedBlockTimestamp: oldestIndexedBlockTimestamp,
-        blockRewards: blockRewards,
-      });
+      res.json(blockRewards);
     } catch (e) {
       res.status(500).send(e instanceof Error ? e.message : e);
     }
@@ -986,7 +980,7 @@ class Routes {
 
   public async $getRewardStats(req: Request, res: Response) {
     try {
-      const response = await mining.$getRewardStats(parseInt(req.params.blockCount))
+      const response = await mining.$getRewardStats(parseInt(req.params.blockCount, 10));
       res.json(response);
     } catch (e) {
       res.status(500).end();

diff --git a/frontend/src/app/components/block-fees-graph/block-fees-graph.component.html b/frontend/src/app/components/block-fees-graph/block-fees-graph.component.html
@@ -3,34 +3,34 @@
     <span i18n="mining.block-fees">Block fees</span>
     <form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(statsObservable$ | async) as stats">
       <div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 1">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 144">
           <input ngbButton type="radio" [value]="'24h'" fragment="24h"> 24h
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 3">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 432">
           <input ngbButton type="radio" [value]="'3d'" fragment="3d"> 3D
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 7">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 1008">
           <input ngbButton type="radio" [value]="'1w'" fragment="1w"> 1W
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 30">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 4320">
           <input ngbButton type="radio" [value]="'1m'" fragment="1m"> 1M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 90">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 12960">
           <input ngbButton type="radio" [value]="'3m'" fragment="3m"> 3M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 180">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 25920">
           <input ngbButton type="radio" [value]="'6m'" fragment="6m"> 6M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 365">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 52560">
           <input ngbButton type="radio" [value]="'1y'" fragment="1y"> 1Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 730">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 105120">
           <input ngbButton type="radio" [value]="'2y'" fragment="2y"> 2Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 1095">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 157680">
           <input ngbButton type="radio" [value]="'3y'" fragment="3y"> 3Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay > 1095">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount > 157680">
           <input ngbButton type="radio" [value]="'all'" fragment="all"> ALL
         </label>
       </div>

diff --git a/frontend/src/app/components/block-fees-graph/block-fees-graph.component.ts b/frontend/src/app/components/block-fees-graph/block-fees-graph.component.ts
@@ -68,19 +68,15 @@ export class BlockFeesGraphComponent implements OnInit {
           this.isLoading = true;
           return this.apiService.getHistoricalBlockFees$(timespan)
             .pipe(
-              tap((data: any) => {
+              tap((response) => {
                 this.prepareChartOptions({
-                  blockFees: data.blockFees.map(val => [val.timestamp * 1000, val.avg_fees / 100000000]),
+                  blockFees: response.body.map(val => [val.timestamp * 1000, val.avg_fees / 100000000]),
                 });
                 this.isLoading = false;
               }),
-              map((data: any) => {
-                const availableTimespanDay = (
-                  (new Date().getTime() / 1000) - (data.oldestIndexedBlockTimestamp)
-                ) / 3600 / 24;
-
+              map((response) => {
                 return {
-                  availableTimespanDay: availableTimespanDay,
+                  blockCount: parseInt(response.headers.get('x-total-count'), 10),
                 };
               }),
             );

diff --git a/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.html b/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.html
@@ -4,34 +4,34 @@
     <span i18n="mining.block-rewards">Block rewards</span>
     <form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(statsObservable$ | async) as stats">
       <div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 1">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 144">
           <input ngbButton type="radio" [value]="'24h'" fragment="24h"> 24h
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 3">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 432">
           <input ngbButton type="radio" [value]="'3d'" fragment="3d"> 3D
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 7">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 1008">
           <input ngbButton type="radio" [value]="'1w'" fragment="1w"> 1W
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 30">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 4320">
           <input ngbButton type="radio" [value]="'1m'" fragment="1m"> 1M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 90">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 12960">
           <input ngbButton type="radio" [value]="'3m'" fragment="3m"> 3M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 180">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 25920">
           <input ngbButton type="radio" [value]="'6m'" fragment="6m"> 6M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 365">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 52560">
           <input ngbButton type="radio" [value]="'1y'" fragment="1y"> 1Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 730">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 105120">
           <input ngbButton type="radio" [value]="'2y'" fragment="2y"> 2Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 1095">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 157680">
           <input ngbButton type="radio" [value]="'3y'" fragment="3y"> 3Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay > 1095">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount > 157680">
           <input ngbButton type="radio" [value]="'all'" fragment="all"> ALL
         </label>
       </div>

diff --git a/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.ts b/frontend/src/app/components/block-rewards-graph/block-rewards-graph.component.ts
@@ -66,19 +66,15 @@ export class BlockRewardsGraphComponent implements OnInit {
           this.isLoading = true;
           return this.apiService.getHistoricalBlockRewards$(timespan)
             .pipe(
-              tap((data: any) => {
+              tap((response) => {
                 this.prepareChartOptions({
-                  blockRewards: data.blockRewards.map(val => [val.timestamp * 1000, val.avg_rewards / 100000000]),
+                  blockRewards: response.body.map(val => [val.timestamp * 1000, val.avg_rewards / 100000000]),
                 });
                 this.isLoading = false;
               }),
-              map((data: any) => {
-                const availableTimespanDay = (
-                  (new Date().getTime() / 1000) - (data.oldestIndexedBlockTimestamp)
-                ) / 3600 / 24;
-
+              map((response) => {
                 return {
-                  availableTimespanDay: availableTimespanDay,
+                  blockCount: parseInt(response.headers.get('x-total-count'), 10),
                 };
               }),
             );

diff --git a/...rc/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts b/...rc/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts
@@ -32,7 +32,8 @@ export class DifficultyAdjustmentsTable implements OnInit {
   ngOnInit(): void {
     this.hashrateObservable$ = this.apiService.getHistoricalHashrate$('1y')
       .pipe(
-        map((data: any) => {
+        map((response) => {
+          const data = response.body;
           const availableTimespanDay = (
             (new Date().getTime() / 1000) - (data.oldestIndexedBlockTimestamp)
           ) / 3600 / 24;

diff --git a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.html b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.html
@@ -22,25 +22,25 @@ <h5 class="card-title" i18n="master-page.blocks">Difficulty</h5>
     <span i18n="mining.hashrate-difficulty">Hashrate & Difficulty</span>
     <form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(hashrateObservable$ | async) as stats">
       <div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 30">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 4320">
           <input ngbButton type="radio" [value]="'1m'" fragment="1m"> 1M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 90">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 12960">
           <input ngbButton type="radio" [value]="'3m'" fragment="3m"> 3M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 180">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 25920">
           <input ngbButton type="radio" [value]="'6m'" fragment="6m"> 6M
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 365">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 52560">
           <input ngbButton type="radio" [value]="'1y'" fragment="1y"> 1Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 730">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 105120">
           <input ngbButton type="radio" [value]="'2y'" fragment="2y"> 2Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay >= 1095">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount >= 157680">
           <input ngbButton type="radio" [value]="'3y'" fragment="3y"> 3Y
         </label>
-        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.availableTimespanDay > 1095">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="stats.blockCount > 157680">
           <input ngbButton type="radio" [value]="'all'" fragment="all"> ALL
         </label>
       </div>

diff --git a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts
@@ -79,7 +79,8 @@ export class HashrateChartComponent implements OnInit {
           this.isLoading = true;
           return this.apiService.getHistoricalHashrate$(timespan)
             .pipe(
-              tap((data: any) => {
+              tap((response) => {
+                const data = response.body;
                 // We generate duplicated data point so the tooltip works nicely
                 const diffFixed = [];
                 let diffIndex = 1;
@@ -111,7 +112,6 @@ export class HashrateChartComponent implements OnInit {
                 this.prepareChartOptions({
                   hashrates: data.hashrates.map(val => [val.timestamp * 1000, val.avgHashrate]),
                   difficulty: diffFixed.map(val => [val.timestamp * 1000, val.difficulty]),
-                  timestamp: data.oldestIndexedBlockTimestamp,
                 });
                 this.isLoading = false;
 
@@ -120,13 +120,10 @@ export class HashrateChartComponent implements OnInit {
                   throw new Error();
                 }
               }),
-              map((data: any) => {
-                const availableTimespanDay = (
-                  (new Date().getTime() / 1000) - (data.oldestIndexedBlockTimestamp)
-                ) / 3600 / 24;
-
+              map((response) => {
+                const data = response.body;
                 return {
-                  availableTimespanDay: availableTimespanDay,
+                  blockCount: parseInt(response.headers.get('x-total-count'), 10),
                   currentDifficulty: Math.round(data.difficulty[data.difficulty.length - 1].difficulty * 100) / 100,
                   currentHashrate: data.hashrates[data.hashrates.length - 1].avgHashrate,
                 };