Merge pull request #1285 from nymkappa/feature/pool-hashrate

Create pools hashrate dominance chart
2024-12-29 01:34:28 +01:00 · 2022-02-25 13:20:29 +04:00 · 2022-02-25 13:20:29 +04:00 · 7228d07b52
commit 7228d07b52
parent 4060c05015 434b60ef8b
22 changed files with 508 additions and 59 deletions
--- a/backend/src/api/database-migration.ts
+++ b/backend/src/api/database-migration.ts
@ -6,7 +6,7 @@ import logger from '../logger';
 const sleep = (ms: number) => new Promise(res => setTimeout(res, ms));

 class DatabaseMigration {
-  private static currentVersion = 7;
+  private static currentVersion = 8;
  private queryTimeout = 120000;
  private statisticsAddedIndexed = false;

@ -92,11 +92,13 @@ class DatabaseMigration {
        await this.$executeQuery(connection, this.getCreateBlocksTableQuery(), await this.$checkIfTableExists('blocks'));
      }
      if (databaseSchemaVersion < 5 && isBitcoin === true) {
+        logger.warn(`'blocks' table has been truncated. Re-indexing from scratch.'`);
        await this.$executeQuery(connection, 'TRUNCATE blocks;'); // Need to re-index
        await this.$executeQuery(connection, 'ALTER TABLE blocks ADD `reward` double unsigned NOT NULL DEFAULT "0"');
      }

      if (databaseSchemaVersion < 6 && isBitcoin === true) {
+        logger.warn(`'blocks' table has been truncated. Re-indexing from scratch.'`);
        await this.$executeQuery(connection, 'TRUNCATE blocks;');  // Need to re-index
        // Cleanup original blocks fields type
        await this.$executeQuery(connection, 'ALTER TABLE blocks MODIFY `height` integer unsigned NOT NULL DEFAULT "0"');
@ -122,6 +124,15 @@ class DatabaseMigration {
        await this.$executeQuery(connection, this.getCreateDailyStatsTableQuery(), await this.$checkIfTableExists('hashrates'));
      }

+      if (databaseSchemaVersion < 8 && isBitcoin === true) {
+        logger.warn(`'hashrates' table has been truncated. Re-indexing from scratch.'`);
+        await this.$executeQuery(connection, 'TRUNCATE hashrates;'); // Need to re-index
+        await this.$executeQuery(connection, 'ALTER TABLE `hashrates` DROP INDEX `PRIMARY`');
+        await this.$executeQuery(connection, 'ALTER TABLE `hashrates` ADD `id` int NOT NULL AUTO_INCREMENT PRIMARY KEY FIRST');
+        await this.$executeQuery(connection, 'ALTER TABLE `hashrates` ADD `share` float NOT NULL DEFAULT "0"');
+        await this.$executeQuery(connection, 'ALTER TABLE `hashrates` ADD `type` enum("daily", "weekly") DEFAULT "daily"');
+      }
+
      connection.release();
    } catch (e) {
      connection.release();
--- a/backend/src/api/mining.ts
+++ b/backend/src/api/mining.ts
@ -83,8 +83,15 @@ class Mining {
  /**
   * Return the historical hashrates and oldest indexed block timestamp
   */
-  public async $getHistoricalHashrates(interval: string | null): Promise<object> {
-    return await HashratesRepository.$get(interval);
+  public async $getNetworkHistoricalHashrates(interval: string | null): Promise<object> {
+    return await HashratesRepository.$getNetworkDailyHashrate(interval);
+  }
+
+  /**
+   * Return the historical hashrates and oldest indexed block timestamp for one or all pools
+   */
+   public async $getPoolsHistoricalHashrates(interval: string | null, poolId: number): Promise<object> {
+    return await HashratesRepository.$getPoolsWeeklyHashrate(interval);
  }

  /**
@ -106,7 +113,7 @@ class Mining {
    logger.info(`Indexing hashrates`);

    const totalDayIndexed = (await BlocksRepository.$blockCount(null, null)) / 144;
-    const indexedTimestamp = (await HashratesRepository.$get(null)).map(hashrate => hashrate.timestamp);
+    const indexedTimestamp = (await HashratesRepository.$getNetworkDailyHashrate(null)).map(hashrate => hashrate.timestamp);
    let startedAt = new Date().getTime() / 1000;
    const genesisTimestamp = 1231006505; // bitcoin-cli getblock 000000000019d6689c085ae165831e934ff763ae46a2a6c172b3f1b60a8ce26f
    const lastMidnight = new Date();
@ -135,38 +142,62 @@ class Mining {
      lastBlockHashrate = await bitcoinClient.getNetworkHashPs(blockStats.blockCount,
        blockStats.lastBlockHeight);

-      const elapsedSeconds = Math.max(1, Math.round((new Date().getTime() / 1000) - startedAt));
-      if (elapsedSeconds > 10) {
-        const daysPerSeconds = Math.max(1, Math.round(indexedThisRun / elapsedSeconds));
-        const formattedDate = new Date(fromTimestamp * 1000).toUTCString();
-        const daysLeft = Math.round(totalDayIndexed - totalIndexed);
-        logger.debug(`Getting hashrate for ${formattedDate} | ~${daysPerSeconds} days/sec | ~${daysLeft} days left to index`);
-        startedAt = new Date().getTime() / 1000;
-        indexedThisRun = 0;
+      if (totalIndexed % 7 === 0 && !indexedTimestamp.includes(fromTimestamp + 1)) { // Save weekly pools hashrate
+        logger.debug("Indexing weekly hashrates for mining pools");
+        let pools = await PoolsRepository.$getPoolsInfoBetween(fromTimestamp - 604800, fromTimestamp);
+        const totalBlocks = pools.reduce((acc, pool) => acc + pool.blockCount, 0);
+        pools = pools.map((pool: any) => {
+          pool.hashrate = (pool.blockCount / totalBlocks) * lastBlockHashrate;
+          pool.share = (pool.blockCount / totalBlocks);
+          return pool;
+        });
+  
+        for (const pool of pools) {
+          hashrates.push({
+            hashrateTimestamp: fromTimestamp + 1,
+            avgHashrate: pool['hashrate'],
+            poolId: pool.poolId,
+            share: pool['share'],
+            type: 'weekly',
+          });
+        }
      }

      hashrates.push({
        hashrateTimestamp: fromTimestamp,
        avgHashrate: lastBlockHashrate,
        poolId: null,
+        share: 1,
+        type: 'daily',
      });

-      if (hashrates.length > 100) {
+      if (hashrates.length > 10) {
        await HashratesRepository.$saveHashrates(hashrates);
        hashrates.length = 0;
      }

+      const elapsedSeconds = Math.max(1, Math.round((new Date().getTime() / 1000) - startedAt));
+      if (elapsedSeconds > 5) {
+        const daysPerSeconds = (indexedThisRun / elapsedSeconds).toFixed(2);
+        const formattedDate = new Date(fromTimestamp * 1000).toUTCString();
+        const daysLeft = Math.round(totalDayIndexed - totalIndexed);
+        logger.debug(`Getting hashrate for ${formattedDate} | ~${daysPerSeconds} days/sec | ~${daysLeft} days left to index`);
+        startedAt = new Date().getTime() / 1000;
+        indexedThisRun = 0;
+      }
+
      toTimestamp -= 86400;
      ++indexedThisRun;
      ++totalIndexed;
    }

    // Add genesis block manually
-    if (!indexedTimestamp.includes(genesisTimestamp)) {
+    if (toTimestamp <= genesisTimestamp && !indexedTimestamp.includes(genesisTimestamp)) {
      hashrates.push({
        hashrateTimestamp: genesisTimestamp,
        avgHashrate: await bitcoinClient.getNetworkHashPs(1, 1),
-        poolId: null
+        poolId: null,
+        type: 'daily',
      });
    }

--- a/backend/src/index.ts
+++ b/backend/src/index.ts
@ -27,6 +27,7 @@ import syncAssets from './sync-assets';
 import icons from './api/liquid/icons';
 import { Common } from './api/common';
 import mining from './api/mining';
+import HashratesRepository from './repositories/HashratesRepository';

 class Server {
  private wss: WebSocket.Server | undefined;
@ -95,6 +96,7 @@ class Server {
          await Common.sleep(5000);
          await databaseMigration.$truncateIndexedData(tables);
        }
+        await this.$resetHashratesIndexingState();
        await databaseMigration.$initializeOrMigrateDatabase();
        await poolsParser.migratePoolsJson();
      } catch (e) {
@ -145,7 +147,7 @@ class Server {
      }
      await blocks.$updateBlocks();
      await memPool.$updateMempool();
-      this.runIndexingWhenReady();
+      this.$runIndexingWhenReady();

      setTimeout(this.runMainUpdateLoop.bind(this), config.MEMPOOL.POLL_RATE_MS);
      this.currentBackendRetryInterval = 5;
@ -164,7 +166,11 @@ class Server {
    }
  }

-  async runIndexingWhenReady() {
+  async $resetHashratesIndexingState() {
+    return await HashratesRepository.$setLatestRunTimestamp(0);    
+  }
+
+  async $runIndexingWhenReady() {
    if (!Common.indexingEnabled() || mempool.hasPriority()) {
      return;
    }
@ -297,8 +303,11 @@ class Server {
        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/pool/:poolId/:interval', routes.$getPool)
        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/difficulty', routes.$getHistoricalDifficulty)
        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/difficulty/:interval', routes.$getHistoricalDifficulty)
+        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/hashrate/pools', routes.$getPoolsHistoricalHashrate)
+        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/hashrate/pools/:interval', routes.$getPoolsHistoricalHashrate)
        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/hashrate', routes.$getHistoricalHashrate)
-        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/hashrate/:interval', routes.$getHistoricalHashrate);
+        .get(config.MEMPOOL.API_URL_PREFIX + 'mining/hashrate/:interval', routes.$getHistoricalHashrate)
+      ;
    }

    if (config.BISQ.ENABLED) {
--- a/backend/src/repositories/BlocksRepository.ts
+++ b/backend/src/repositories/BlocksRepository.ts
@ -173,7 +173,7 @@ class BlocksRepository {
    } else {
      query += ` WHERE`;
    }
-    query += ` UNIX_TIMESTAMP(blockTimestamp) BETWEEN '${from}' AND '${to}'`;
+    query += ` blockTimestamp BETWEEN FROM_UNIXTIME('${from}') AND FROM_UNIXTIME('${to}')`;

    // logger.debug(query);
    const connection = await DB.pool.getConnection();
@ -300,6 +300,10 @@ class BlocksRepository {
    const [rows]: any[] = await connection.query(query);
    connection.release();

+    for (let row of rows) {
+      delete row['rn'];
+    }
+
    return rows;
  }

--- a/backend/src/repositories/HashratesRepository.ts
+++ b/backend/src/repositories/HashratesRepository.ts
@ -1,6 +1,7 @@
 import { Common } from '../api/common';
 import { DB } from '../database';
 import logger from '../logger';
+import PoolsRepository from './PoolsRepository';

 class HashratesRepository {
  /**
@ -8,10 +9,10 @@ class HashratesRepository {
   */
  public async $saveHashrates(hashrates: any) {
    let query = `INSERT INTO
-      hashrates(hashrate_timestamp, avg_hashrate, pool_id) VALUES`;
+      hashrates(hashrate_timestamp, avg_hashrate, pool_id, share, type) VALUES`;

    for (const hashrate of hashrates) {
-      query += ` (FROM_UNIXTIME(${hashrate.hashrateTimestamp}), ${hashrate.avgHashrate}, ${hashrate.poolId}),`;
+      query += ` (FROM_UNIXTIME(${hashrate.hashrateTimestamp}), ${hashrate.avgHashrate}, ${hashrate.poolId}, ${hashrate.share}, "${hashrate.type}"),`;
    }
    query = query.slice(0, -1);

@ -26,10 +27,7 @@ class HashratesRepository {
    connection.release();
  }

-  /**
-   * Returns an array of all timestamp we've already indexed
-   */
-  public async $get(interval: string | null): Promise<any[]> {
+  public async $getNetworkDailyHashrate(interval: string | null): Promise<any[]> {
    interval = Common.getSqlInterval(interval);

    const connection = await DB.pool.getConnection();
@ -38,7 +36,12 @@ class HashratesRepository {
      FROM hashrates`;

    if (interval) {
-      query += ` WHERE hashrate_timestamp BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW()`;
+      query += ` WHERE hashrate_timestamp BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW()
+        AND hashrates.type = 'daily'
+        AND pool_id IS NULL`;
+    } else {
+      query += ` WHERE hashrates.type = 'daily'
+        AND pool_id IS NULL`;
    }

    query += ` ORDER by hashrate_timestamp`;
@ -49,10 +52,41 @@ class HashratesRepository {
    return rows;
  }

-  public async $setLatestRunTimestamp() {
+  /**
+   * Returns the current biggest pool hashrate history
+   */
+  public async $getPoolsWeeklyHashrate(interval: string | null): Promise<any[]> {
+    interval = Common.getSqlInterval(interval);
+
+    const connection = await DB.pool.getConnection();
+    const topPoolsId = (await PoolsRepository.$getPoolsInfo('1w')).map((pool) => pool.poolId);
+
+    let query = `SELECT UNIX_TIMESTAMP(hashrate_timestamp) as timestamp, avg_hashrate as avgHashrate, share, pools.name as poolName
+      FROM hashrates
+      JOIN pools on pools.id = pool_id`;
+
+    if (interval) {
+      query += ` WHERE hashrate_timestamp BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW()
+        AND hashrates.type = 'weekly'
+        AND pool_id IN (${topPoolsId})`;
+    } else {
+      query += ` WHERE hashrates.type = 'weekly'
+        AND pool_id IN (${topPoolsId})`;
+    }
+
+    query += ` ORDER by hashrate_timestamp, FIELD(pool_id, ${topPoolsId})`;
+
+    const [rows]: any[] = await connection.query(query);
+    connection.release();
+
+    return rows;
+  }
+
+  public async $setLatestRunTimestamp(val: any = null) {
    const connection = await DB.pool.getConnection();
    const query = `UPDATE state SET number = ? WHERE name = 'last_hashrates_indexing'`;
-    await connection.query<any>(query, [Math.round(new Date().getTime() / 1000)]);
+
+    await connection.query<any>(query, (val === null) ? [Math.round(new Date().getTime() / 1000)] : [val]);
    connection.release();
  }

--- a/backend/src/repositories/PoolsRepository.ts
+++ b/backend/src/repositories/PoolsRepository.ts
@ -49,6 +49,22 @@ class PoolsRepository {
    return <PoolInfo[]>rows;
  }

+  /**
+   * Get basic pool info and block count between two timestamp
+   */
+   public async $getPoolsInfoBetween(from: number, to: number): Promise<PoolInfo[]> {
+    let query = `SELECT COUNT(height) as blockCount, pools.id as poolId, pools.name as poolName
+      FROM pools
+      LEFT JOIN blocks on pools.id = blocks.pool_id AND blocks.blockTimestamp BETWEEN FROM_UNIXTIME(?) AND FROM_UNIXTIME(?)
+      GROUP BY pools.id`;
+
+    const connection = await DB.pool.getConnection();
+    const [rows] = await connection.query(query, [from, to]);
+    connection.release();
+
+    return <PoolInfo[]>rows;
+  }
+
  /**
   * Get mining pool statistics for one pool
   */
--- a/backend/src/routes.ts
+++ b/backend/src/routes.ts
@ -586,9 +586,25 @@ class Routes {
    }
  }

+  public async $getPoolsHistoricalHashrate(req: Request, res: Response) {
+    try {
+      const hashrates = await mining.$getPoolsHistoricalHashrates(req.params.interval ?? null, parseInt(req.params.poolId, 10));
+      const oldestIndexedBlockTimestamp = await BlocksRepository.$oldestBlockTimestamp();
+      res.header('Pragma', 'public');
+      res.header('Cache-control', 'public');
+      res.setHeader('Expires', new Date(Date.now() + 1000 * 300).toUTCString());
+      res.json({
+        oldestIndexedBlockTimestamp: oldestIndexedBlockTimestamp,
+        hashrates: hashrates,
+      });
+    } catch (e) {
+      res.status(500).send(e instanceof Error ? e.message : e);
+    }
+  }
+
  public async $getHistoricalHashrate(req: Request, res: Response) {
    try {
-      const hashrates = await mining.$getHistoricalHashrates(req.params.interval ?? null);
+      const hashrates = await mining.$getNetworkHistoricalHashrates(req.params.interval ?? null);
      const difficulty = await mining.$getHistoricalDifficulty(req.params.interval ?? null);
      const oldestIndexedBlockTimestamp = await BlocksRepository.$oldestBlockTimestamp();
      res.header('Pragma', 'public');
--- a/frontend/src/app/app-routing.module.ts
+++ b/frontend/src/app/app-routing.module.ts
@ -29,6 +29,7 @@ import { AssetsComponent } from './components/assets/assets.component';
 import { PoolComponent } from './components/pool/pool.component';
 import { MiningDashboardComponent } from './components/mining-dashboard/mining-dashboard.component';
 import { HashrateChartComponent } from './components/hashrate-chart/hashrate-chart.component';
+import { HashrateChartPoolsComponent } from './components/hashrates-chart-pools/hashrate-chart-pools.component';
 import { MiningStartComponent } from './components/mining-start/mining-start.component';

 let routes: Routes = [
@ -78,6 +79,10 @@ let routes: Routes = [
            path: 'hashrate',
            component: HashrateChartComponent,
          },
+          {
+            path: 'hashrate/pools',
+            component: HashrateChartPoolsComponent,
+          },
          {
            path: 'pools',
            component: PoolRankingComponent,
@ -89,10 +94,6 @@ let routes: Routes = [
                path: ':poolId',
                component: PoolComponent,
              },
-              {
-                path: ':poolId/hashrate',
-                component: HashrateChartComponent,
-              },
            ]
          },
        ]
@ -193,6 +194,10 @@ let routes: Routes = [
                path: 'hashrate',
                component: HashrateChartComponent,
              },
+              {
+                path: 'hashrate/pools',
+                component: HashrateChartPoolsComponent,
+              },
              {
                path: 'pools',
                component: PoolRankingComponent,
@ -204,10 +209,6 @@ let routes: Routes = [
                    path: ':poolId',
                    component: PoolComponent,
                  },
-                  {
-                    path: ':poolId/hashrate',
-                    component: HashrateChartComponent,
-                  },
                ]
              },
            ]
@ -302,6 +303,10 @@ let routes: Routes = [
                path: 'hashrate',
                component: HashrateChartComponent,
              },
+              {
+                path: 'hashrate/pools',
+                component: HashrateChartPoolsComponent,
+              },
              {
                path: 'pools',
                component: PoolRankingComponent,
@ -313,10 +318,6 @@ let routes: Routes = [
                    path: ':poolId',
                    component: PoolComponent,
                  },
-                  {
-                    path: ':poolId/hashrate',
-                    component: HashrateChartComponent,
-                  },
                ]
              },
            ]
--- a/frontend/src/app/app.constants.ts
+++ b/frontend/src/app/app.constants.ts
@ -71,7 +71,23 @@ export const chartColors = [
  "#263238",
 ];

-export const feeLevels = [1, 2, 3, 4, 5, 6, 8, 10, 12, 15, 20, 30, 40, 50, 60, 70, 80, 90, 100, 125, 150, 175, 200,
+export const poolsColor = {
+   'foundryusa': '#D81B60',
+   'antpool': '#8E24AA',
+   'f2pool': '#5E35B1',
+   'poolin': '#3949AB',
+   'binancepool': '#1E88E5',
+   'viabtc': '#039BE5',
+   'btccom': '#00897B',
+   'slushpool': '#00ACC1',
+   'sbicrypto': '#43A047',
+   'marapool': '#7CB342',
+   'luxor': '#C0CA33',
+   'unknown': '#FDD835',
+   'okkong': '#FFB300',
+}
+
+ export const feeLevels = [1, 2, 3, 4, 5, 6, 8, 10, 12, 15, 20, 30, 40, 50, 60, 70, 80, 90, 100, 125, 150, 175, 200,
  250, 300, 350, 400, 500, 600, 700, 800, 900, 1000, 1200, 1400, 1600, 1800, 2000];

 export interface Language {
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@ -71,6 +71,7 @@ import { AssetGroupComponent } from './components/assets/asset-group/asset-group
 import { AssetCirculationComponent } from './components/asset-circulation/asset-circulation.component';
 import { MiningDashboardComponent } from './components/mining-dashboard/mining-dashboard.component';
 import { HashrateChartComponent } from './components/hashrate-chart/hashrate-chart.component';
+import { HashrateChartPoolsComponent } from './components/hashrates-chart-pools/hashrate-chart-pools.component';
 import { MiningStartComponent } from './components/mining-start/mining-start.component';
 import { AmountShortenerPipe } from './shared/pipes/amount-shortener.pipe';

@ -126,6 +127,7 @@ import { AmountShortenerPipe } from './shared/pipes/amount-shortener.pipe';
    AssetCirculationComponent,
    MiningDashboardComponent,
    HashrateChartComponent,
+    HashrateChartPoolsComponent,
    MiningStartComponent,
    AmountShortenerPipe,
  ],
--- a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.html
+++ b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.html
@ -1,6 +1,6 @@
 <div [class]="widget === false ? 'full-container' : ''">

-  <div class="card-header mb-0 mb-lg-4" [style]="widget ? 'display:none' : ''">
+  <div class="card-header mb-0 mb-md-4" [style]="widget ? 'display:none' : ''">
    <form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(hashrateObservable$ | async) as hashrates">
      <div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="hashrates.availableTimespanDay >= 90">
@ -31,7 +31,7 @@
    <div class="spinner-border text-light"></div>
  </div>
  
-  <div class="mt-3" *ngIf="!widget">
+  <!-- <div class="mt-3" *ngIf="!widget">
    <table class="table table-borderless table-sm text-center">
      <thead>
        <tr>
@ -53,6 +53,6 @@
        </tr>
      </tbody>
    </table>
-  </div>
+  </div> -->

 </div>
--- a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts
+++ b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts
@ -45,12 +45,15 @@ export class HashrateChartComponent implements OnInit {
    private apiService: ApiService,
    private formBuilder: FormBuilder,
  ) {
-    this.seoService.setTitle($localize`:@@mining.hashrate-difficulty:Hashrate and Difficulty`);
    this.radioGroupForm = this.formBuilder.group({ dateSpan: '1y' });
    this.radioGroupForm.controls.dateSpan.setValue('1y');
  }

  ngOnInit(): void {
+    if (!this.widget) {
+      this.seoService.setTitle($localize`:@@mining.hashrate-difficulty:Hashrate and Difficulty`);
+    }
+
    this.hashrateObservable$ = this.radioGroupForm.get('dateSpan').valueChanges
      .pipe(
        startWith('1y'),
@ -172,7 +175,7 @@ export class HashrateChartComponent implements OnInit {
      },
      xAxis: {
        type: 'time',
-        splitNumber: this.isMobile() ? 5 : 10,
+        splitNumber: (this.isMobile() || this.widget) ? 5 : 10,
      },
      legend: {
        data: [
@ -243,6 +246,7 @@ export class HashrateChartComponent implements OnInit {
        {
          name: 'Hashrate',
          showSymbol: false,
+          symbol: 'none',
          data: data.hashrates,
          type: 'line',
          lineStyle: {
@ -253,6 +257,7 @@ export class HashrateChartComponent implements OnInit {
          yAxisIndex: 1,
          name: 'Difficulty',
          showSymbol: false,
+          symbol: 'none',
          data: data.difficulty,
          type: 'line',
          lineStyle: {
--- a/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.html
+++ b/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.html
@ -0,0 +1,34 @@
+<div [class]="widget === false ? 'full-container' : ''">
+
+  <div class="card-header mb-0 mb-md-4" [style]="widget ? 'display:none' : ''">
+    <form [formGroup]="radioGroupForm" class="formRadioGroup" *ngIf="(hashrateObservable$ | async) as hashrates">
+      <div class="btn-group btn-group-toggle" ngbRadioGroup name="radioBasic" formControlName="dateSpan">
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="hashrates.availableTimespanDay >= 90">
+          <input ngbButton type="radio" [value]="'3m'"> 3M
+        </label>
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="hashrates.availableTimespanDay >= 180">
+          <input ngbButton type="radio" [value]="'6m'"> 6M
+        </label>
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="hashrates.availableTimespanDay >= 365">
+          <input ngbButton type="radio" [value]="'1y'"> 1Y
+        </label>
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="hashrates.availableTimespanDay >= 730">
+          <input ngbButton type="radio" [value]="'2y'"> 2Y
+        </label>
+        <label ngbButtonLabel class="btn-primary btn-sm" *ngIf="hashrates.availableTimespanDay >= 1095">
+          <input ngbButton type="radio" [value]="'3y'"> 3Y
+        </label>
+        <label ngbButtonLabel class="btn-primary btn-sm">
+          <input ngbButton type="radio" [value]="'all'"> ALL
+        </label>
+      </div>
+    </form>
+  </div>
+
+  <div *ngIf="hashrateObservable$ | async" [class]="!widget ? 'chart' : 'chart-widget'"
+    echarts [initOpts]="chartInitOptions" [options]="chartOptions"></div>
+  <div class="text-center loadingGraphs" *ngIf="isLoading">
+    <div class="spinner-border text-light"></div>
+  </div>
+
+</div>
--- a/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.scss
+++ b/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.scss
@ -0,0 +1,50 @@
+.main-title {
+  position: relative;
+  color: #ffffff91;
+  margin-top: -13px;
+  font-size: 10px;
+  text-transform: uppercase;
+  font-weight: 500;
+  text-align: center;
+  padding-bottom: 3px;
+}
+
+.full-container {
+  width: 100%;
+  height: calc(100% - 100px);
+  @media (max-width: 992px) {
+    height: calc(100% - 140px);
+  };
+  @media (max-width: 576px) {
+    height: calc(100% - 180px);
+  };
+}
+
+.chart {
+  width: 100%;
+  height: 100%;
+  padding-bottom: 20px;
+  padding-right: 20px;
+}
+.chart-widget {
+  width: 100%;
+  height: 100%;
+  max-height: 275px;
+}
+
+.formRadioGroup {
+  margin-top: 6px;
+  display: flex;
+  flex-direction: column;
+  @media (min-width: 830px) {
+    flex-direction: row;
+    float: right;
+    margin-top: 0px;
+  }
+  .btn-sm {
+    font-size: 9px;
+    @media (min-width: 830px) {
+      font-size: 14px;
+    }
+  }
+}
--- a/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.ts
+++ b/frontend/src/app/components/hashrates-chart-pools/hashrate-chart-pools.component.ts
@ -0,0 +1,185 @@
+import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core';
+import { EChartsOption } from 'echarts';
+import { Observable } from 'rxjs';
+import { map, share, startWith, switchMap, tap } from 'rxjs/operators';
+import { ApiService } from 'src/app/services/api.service';
+import { SeoService } from 'src/app/services/seo.service';
+import { FormBuilder, FormGroup } from '@angular/forms';
+import { poolsColor } from 'src/app/app.constants';
+
+@Component({
+  selector: 'app-hashrate-chart-pools',
+  templateUrl: './hashrate-chart-pools.component.html',
+  styleUrls: ['./hashrate-chart-pools.component.scss'],
+  styles: [`
+    .loadingGraphs {
+      position: absolute;
+      top: 50%;
+      left: calc(50% - 15px);
+      z-index: 100;
+    }
+  `],
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class HashrateChartPoolsComponent implements OnInit {
+  @Input() widget: boolean = false;
+  @Input() right: number | string = 40;
+  @Input() left: number | string = 25;
+
+  radioGroupForm: FormGroup;
+
+  chartOptions: EChartsOption = {};
+  chartInitOptions = {
+    renderer: 'svg',
+    width: 'auto',
+    height: 'auto',
+  };
+
+  hashrateObservable$: Observable<any>;
+  isLoading = true;
+
+  constructor(
+    @Inject(LOCALE_ID) public locale: string,
+    private seoService: SeoService,
+    private apiService: ApiService,
+    private formBuilder: FormBuilder,
+  ) {
+    this.radioGroupForm = this.formBuilder.group({ dateSpan: '1y' });
+    this.radioGroupForm.controls.dateSpan.setValue('1y');
+  }
+
+  ngOnInit(): void {
+    if (!this.widget) {
+      this.seoService.setTitle($localize`:@@mining.pools-historical-dominance:Pools Historical Dominance`);
+    }
+
+    this.hashrateObservable$ = this.radioGroupForm.get('dateSpan').valueChanges
+      .pipe(
+        startWith('1y'),
+        switchMap((timespan) => {
+          this.isLoading = true;
+          return this.apiService.getHistoricalPoolsHashrate$(timespan)
+            .pipe(
+              tap((data: any) => {
+                // Prepare series (group all hashrates data point by pool)
+                const grouped = {};
+                for (const hashrate of data.hashrates) {
+                  if (!grouped.hasOwnProperty(hashrate.poolName)) {
+                    grouped[hashrate.poolName] = [];
+                  }
+                  grouped[hashrate.poolName].push(hashrate);
+                }
+
+                const series = [];
+                const legends = [];
+                for (const name in grouped) {
+                  series.push({
+                    stack: 'Total',
+                    name: name,
+                    showSymbol: false,
+                    symbol: 'none',
+                    data: grouped[name].map((val) => [val.timestamp * 1000, (val.share * 100).toFixed(2)]),
+                    type: 'line',
+                    lineStyle: { width: 0 },
+                    areaStyle: { opacity: 1 },
+                    smooth: true,
+                    color: poolsColor[name.replace(/[^a-zA-Z0-9]/g, "").toLowerCase()],
+                    emphasis: {
+                      disabled: true,
+                      scale: false,
+                    },
+                  });
+
+                  legends.push({
+                    name: name,
+                    inactiveColor: 'rgb(110, 112, 121)',
+                    textStyle: {
+                      color: 'white',
+                    },
+                    icon: 'roundRect',
+                    itemStyle: {
+                      color: poolsColor[name.replace(/[^a-zA-Z0-9]/g, "").toLowerCase()],
+                    },
+                  });
+                }
+
+                this.prepareChartOptions({
+                  legends: legends,
+                  series: series
+                });
+                this.isLoading = false;
+              }),
+              map((data: any) => {
+                const availableTimespanDay = (
+                  (new Date().getTime() / 1000) - (data.oldestIndexedBlockTimestamp)
+                ) / 3600 / 24;
+                return {
+                  availableTimespanDay: availableTimespanDay,
+                };
+              }),
+            );
+        }),
+        share()
+      );
+  }
+
+  prepareChartOptions(data) {
+    this.chartOptions = {
+      grid: {
+        right: this.right,
+        left: this.left,
+        bottom: this.widget ? 30 : 20,
+        top: this.widget ? 10 : 40,
+      },
+      tooltip: {
+        trigger: 'axis',
+        axisPointer: {
+          type: 'line'
+        },
+        backgroundColor: 'rgba(17, 19, 31, 1)',
+        borderRadius: 4,
+        shadowColor: 'rgba(0, 0, 0, 0.5)',
+        textStyle: {
+          color: '#b1b1b1',
+          align: 'left',
+        },
+        borderColor: '#000',
+        formatter: function (data) {
+          let tooltip = `<b style="color: white; margin-left: 18px">${data[0].axisValueLabel}</b><br>`;
+          data.sort((a, b) => b.data[1] - a.data[1]);
+          for (const pool of data) {
+            if (pool.data[1] > 0) {
+              tooltip += `${pool.marker} ${pool.seriesName}: ${pool.data[1]}%<br>`
+            }
+          }
+          return tooltip;
+        }.bind(this)
+      },
+      xAxis: {
+        type: 'time',
+        splitNumber: (this.isMobile() || this.widget) ? 5 : 10,
+      },
+      legend: (this.isMobile() || this.widget) ? undefined : {
+        data: data.legends
+      },
+      yAxis: {
+        position: 'right',
+        axisLabel: {
+          color: 'rgb(110, 112, 121)',
+          formatter: (val) => `${val}%`,
+        },
+        splitLine: {
+          show: false,
+        },
+        type: 'value',
+        max: 100,
+        min: 0,
+      },
+      series: data.series,
+    };
+  }
+
+  isMobile() {
+    return (window.innerWidth <= 767.98);
+  }
+}
--- a/frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts
+++ b/frontend/src/app/components/incoming-transactions-graph/incoming-transactions-graph.component.ts
@ -160,6 +160,7 @@ export class IncomingTransactionsGraphComponent implements OnInit, OnChanges {
          type: 'line',
          smooth: false,
          showSymbol: false,
+          symbol: 'none',
          lineStyle: {
            width: 3,
          },
--- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html
+++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html
@ -2,16 +2,16 @@
  
  <div class="row row-cols-1 row-cols-md-2">

-    <!-- pool distribution -->
+    <!-- pools hashrate -->
    <div class="col">
      <div class="card">
-        <div class="card-body pool-ranking">
+        <div class="card-body">
          <h5 class="card-title">
-            <a href="" [routerLink]="['/mining/pools' | relativeUrl]" i18n="mining.pool-share">
-              Mining Pools Share (1w)
+            <a class="link" href="" [routerLink]="['/mining/hashrate/pools' | relativeUrl]" i18n="mining.pools-hashrate">
+              Mining Pools Dominance (1y)
            </a>
          </h5>
-          <app-pool-ranking [widget]=true></app-pool-ranking>
+          <app-hashrate-chart-pools [widget]=true></app-hashrate-chart-pools>
        </div>
      </div>
    </div>
@ -30,5 +30,19 @@
      </div>
    </div>

+    <!-- pool distribution -->
+    <div class="col">
+      <div class="card">
+        <div class="card-body pool-ranking">
+          <h5 class="card-title">
+            <a href="" [routerLink]="['/mining/pools' | relativeUrl]" i18n="mining.pool-share">
+              Mining Pools Share (1w)
+            </a>
+          </h5>
+          <app-pool-ranking [widget]=true></app-pool-ranking>
+        </div>
+      </div>
+    </div>
+
  </div>
 </div>
--- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.scss
+++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.scss
@ -12,7 +12,7 @@

 .card {
  background-color: #1d1f31;
-  height: 100%;
+  height: 340px;
 }

 .card-title {
--- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts
+++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts
@ -1,4 +1,5 @@
 import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { SeoService } from 'src/app/services/seo.service';

@Component({
  selector: 'app-mining-dashboard',
@ -8,7 +9,9 @@ import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
 })
 export class MiningDashboardComponent implements OnInit {

-  constructor() { }
+  constructor(private seoService: SeoService) {
+    this.seoService.setTitle($localize`:@@mining.mining-dashboard:Mining Dashboard`);
+  }

  ngOnInit(): void {
  }
--- a/frontend/src/app/components/pool-ranking/pool-ranking.component.ts
+++ b/frontend/src/app/components/pool-ranking/pool-ranking.component.ts
@ -1,4 +1,4 @@
-import { Component, Input, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup } from '@angular/forms';
 import { Router } from '@angular/router';
 import { EChartsOption, PieSeriesOption } from 'echarts';
@ -9,7 +9,7 @@ import { SeoService } from 'src/app/services/seo.service';
 import { StorageService } from '../..//services/storage.service';
 import { MiningService, MiningStats } from '../../services/mining.service';
 import { StateService } from '../../services/state.service';
-import { chartColors } from 'src/app/app.constants';
+import { chartColors, poolsColor } from 'src/app/app.constants';

@Component({
  selector: 'app-pool-ranking',
@ -18,11 +18,12 @@ import { chartColors } from 'src/app/app.constants';
  styles: [`
    .loadingGraphs {
      position: absolute;
-      top: 38%;
+      top: 50%;
      left: calc(50% - 15px);
      z-index: 100;
    }
  `],
+  changeDetection: ChangeDetectionStrategy.OnPush,
 })
 export class PoolRankingComponent implements OnInit {
  @Input() widget: boolean = false;
@ -49,13 +50,13 @@ export class PoolRankingComponent implements OnInit {
    private seoService: SeoService,
    private router: Router,
  ) {
-    this.seoService.setTitle($localize`:@@mining.mining-pools:Mining Pools`);
  }

  ngOnInit(): void {
    if (this.widget) {
      this.poolsWindowPreference = '1w';
    } else {
+      this.seoService.setTitle($localize`:@@mining.mining-pools:Mining Pools`);
      this.poolsWindowPreference = this.storageService.getValue('poolsWindowPreference') ? this.storageService.getValue('poolsWindowPreference') : '1w';    
    }
    this.radioGroupForm = this.formBuilder.group({ dateSpan: this.poolsWindowPreference });
@ -120,6 +121,9 @@ export class PoolRankingComponent implements OnInit {
        return;
      }
      data.push({
+        itemStyle: {
+          color: poolsColor[pool.name.replace(/[^a-zA-Z0-9]/g, "").toLowerCase()],
+        },
        value: pool.share,
        name: pool.name + (this.isMobile() ? `` : ` (${pool.share}%)`),
        label: {
@ -164,6 +168,7 @@ export class PoolRankingComponent implements OnInit {
    }

    this.chartOptions = {
+      color: chartColors,
      title: {
        text: this.widget ? '' : $localize`:@@mining.pool-chart-title:${network}:NETWORK: mining pools share`,
        left: 'center',
@ -216,7 +221,6 @@ export class PoolRankingComponent implements OnInit {
          }
        }
      ],
-      color: chartColors
    };
  }

--- a/frontend/src/app/services/api.service.ts
+++ b/frontend/src/app/services/api.service.ts
@ -163,4 +163,11 @@ export class ApiService {
        (interval !== undefined ? `/${interval}` : '')
      );
  }
+
+  getHistoricalPoolsHashrate$(interval: string | undefined): Observable<any> {
+    return this.httpClient.get<any[]>(
+        this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/hashrate/pools` +
+        (interval !== undefined ? `/${interval}` : '')
+      );
+  }
 }
--- a/production/nginx-cache-warmer
+++ b/production/nginx-cache-warmer
@ -27,6 +27,12 @@ do for url in / \
 	'/api/v1/mining/hashrate/2y' \
 	'/api/v1/mining/hashrate/3y' \
 	'/api/v1/mining/hashrate/all' \
+	'/api/v1/mining/hashrate/pools/3m' \
+	'/api/v1/mining/hashrate/pools/6m' \
+	'/api/v1/mining/hashrate/pools/1y' \
+	'/api/v1/mining/hashrate/pools/2y' \
+	'/api/v1/mining/hashrate/pools/3y' \
+	'/api/v1/mining/hashrate/pools/all' \

 	do
 		curl -s "https://${hostname}${url}" >/dev/null