From 078c7ac22861b83252fb54dc61dd00f02aa8314b Mon Sep 17 00:00:00 2001 From: nymkappa Date: Thu, 14 Apr 2022 15:37:03 +0900 Subject: [PATCH 01/10] Add /api/v1/mining/blocks/fee-rates/{interval} API --- backend/src/api/mining.ts | 12 ++++++- backend/src/index.ts | 1 + backend/src/repositories/BlocksRepository.ts | 35 ++++++++++++++++++++ backend/src/routes.ts | 16 +++++++++ 4 files changed, 63 insertions(+), 1 deletion(-) diff --git a/backend/src/api/mining.ts b/backend/src/api/mining.ts index 201813899..94191a09f 100644 --- a/backend/src/api/mining.ts +++ b/backend/src/api/mining.ts @@ -15,7 +15,7 @@ class Mining { } /** - * Get historical block reward and total fee + * Get historical block total fee */ public async $getHistoricalBlockFees(interval: string | null = null): Promise { return await BlocksRepository.$getHistoricalBlockFees( @@ -34,6 +34,16 @@ class Mining { ); } + /** + * Get historical block fee rates percentiles + */ + public async $getHistoricalBlockFeeRates(interval: string | null = null): Promise { + return await BlocksRepository.$getHistoricalBlockFeeRates( + this.getTimeRange(interval), + Common.getSqlInterval(interval) + ); + } + /** * Generate high level overview of the pool ranks and general stats */ diff --git a/backend/src/index.ts b/backend/src/index.ts index 943448e3a..89131aed8 100644 --- a/backend/src/index.ts +++ b/backend/src/index.ts @@ -326,6 +326,7 @@ class Server { .get(config.MEMPOOL.API_URL_PREFIX + 'mining/reward-stats/:blockCount', routes.$getRewardStats) .get(config.MEMPOOL.API_URL_PREFIX + 'mining/blocks/fees/:interval', routes.$getHistoricalBlockFees) .get(config.MEMPOOL.API_URL_PREFIX + 'mining/blocks/rewards/:interval', routes.$getHistoricalBlockRewards) + .get(config.MEMPOOL.API_URL_PREFIX + 'mining/blocks/fee-rates/:interval', routes.$getHistoricalBlockFeeRates) ; } diff --git a/backend/src/repositories/BlocksRepository.ts b/backend/src/repositories/BlocksRepository.ts index 8e96a0c38..e495f1f94 100644 --- a/backend/src/repositories/BlocksRepository.ts +++ b/backend/src/repositories/BlocksRepository.ts @@ -427,6 +427,41 @@ class BlocksRepository { throw e; } } + + /** + * Get the historical averaged block fee rate percentiles + */ + public async $getHistoricalBlockFeeRates(div: number, interval: string | null): Promise { + let connection; + try { + connection = await DB.getConnection(); + + let query = `SELECT CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, + CAST(AVG(JSON_EXTRACT(fee_span, '$[0]')) as INT) as avg_fee_0, + CAST(AVG(JSON_EXTRACT(fee_span, '$[1]')) as INT) as avg_fee_10, + CAST(AVG(JSON_EXTRACT(fee_span, '$[2]')) as INT) as avg_fee_25, + CAST(AVG(JSON_EXTRACT(fee_span, '$[3]')) as INT) as avg_fee_50, + CAST(AVG(JSON_EXTRACT(fee_span, '$[4]')) as INT) as avg_fee_75, + CAST(AVG(JSON_EXTRACT(fee_span, '$[5]')) as INT) as avg_fee_90, + CAST(AVG(JSON_EXTRACT(fee_span, '$[6]')) as INT) as avg_fee_100 + FROM blocks`; + + if (interval !== null) { + query += ` WHERE blockTimestamp BETWEEN DATE_SUB(NOW(), INTERVAL ${interval}) AND NOW()`; + } + + query += ` GROUP BY UNIX_TIMESTAMP(blockTimestamp) DIV ${div}`; + + const [rows]: any = await connection.query(query); + connection.release(); + + return rows; + } catch (e) { + connection.release(); + logger.err('Cannot generate block fee rates history. Reason: ' + (e instanceof Error ? e.message : e)); + throw e; + } + } } export default new BlocksRepository(); diff --git a/backend/src/routes.ts b/backend/src/routes.ts index 9d4adb796..2b56fd8b3 100644 --- a/backend/src/routes.ts +++ b/backend/src/routes.ts @@ -670,6 +670,22 @@ class Routes { } } + public async $getHistoricalBlockFeeRates(req: Request, res: Response) { + try { + const blockFees = await mining.$getHistoricalBlockFeeRates(req.params.interval ?? null); + 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, + blockFees: blockFees, + }); + } catch (e) { + res.status(500).send(e instanceof Error ? e.message : e); + } + } + public async getBlock(req: Request, res: Response) { try { const result = await bitcoinApi.$getBlock(req.params.hash); From 3ce6e81a390fbe8a0c16693ac709106b0a22b055 Mon Sep 17 00:00:00 2001 From: nymkappa Date: Fri, 15 Apr 2022 00:21:38 +0900 Subject: [PATCH 02/10] Add block fee rate percentiles chart --- backend/src/repositories/BlocksRepository.ts | 12 +- backend/src/routes.ts | 4 +- frontend/src/app/app-routing.module.ts | 19 +- frontend/src/app/app.module.ts | 2 + frontend/src/app/bitcoin.utils.ts | 4 +- .../block-fee-rates-graph.component.html | 46 ++++ .../block-fee-rates-graph.component.scss | 135 +++++++++ .../block-fee-rates-graph.component.ts | 257 ++++++++++++++++++ .../block-fees-graph.component.html | 17 -- .../block-fees-graph.component.ts | 9 +- .../block-rewards-graph.component.html | 19 +- .../block-rewards-graph.component.ts | 8 +- .../components/graphs/graphs.component.html | 4 + .../hashrate-chart.component.ts | 8 +- .../statistics/statistics.component.ts | 2 +- frontend/src/app/services/api.service.ts | 7 + frontend/src/app/shared/graphs.utils.ts | 7 +- 17 files changed, 505 insertions(+), 55 deletions(-) create mode 100644 frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html create mode 100644 frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss create mode 100644 frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts diff --git a/backend/src/repositories/BlocksRepository.ts b/backend/src/repositories/BlocksRepository.ts index e495f1f94..6a2b85305 100644 --- a/backend/src/repositories/BlocksRepository.ts +++ b/backend/src/repositories/BlocksRepository.ts @@ -387,7 +387,9 @@ class BlocksRepository { */ public async $getHistoricalBlockFees(div: number, interval: string | null): Promise { try { - let query = `SELECT CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, + let query = `SELECT + CAST(AVG(height) as INT) as avg_height, + CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, CAST(AVG(fees) as INT) as avg_fees FROM blocks`; @@ -410,7 +412,9 @@ class BlocksRepository { */ public async $getHistoricalBlockRewards(div: number, interval: string | null): Promise { try { - let query = `SELECT CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, + let query = `SELECT + CAST(AVG(height) as INT) as avg_height, + CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, CAST(AVG(reward) as INT) as avg_rewards FROM blocks`; @@ -436,7 +440,9 @@ class BlocksRepository { try { connection = await DB.getConnection(); - let query = `SELECT CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, + let query = `SELECT + CAST(AVG(height) as INT) as avg_height, + CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, CAST(AVG(JSON_EXTRACT(fee_span, '$[0]')) as INT) as avg_fee_0, CAST(AVG(JSON_EXTRACT(fee_span, '$[1]')) as INT) as avg_fee_10, CAST(AVG(JSON_EXTRACT(fee_span, '$[2]')) as INT) as avg_fee_25, diff --git a/backend/src/routes.ts b/backend/src/routes.ts index 2b56fd8b3..3722a6c64 100644 --- a/backend/src/routes.ts +++ b/backend/src/routes.ts @@ -672,14 +672,14 @@ class Routes { public async $getHistoricalBlockFeeRates(req: Request, res: Response) { try { - const blockFees = await mining.$getHistoricalBlockFeeRates(req.params.interval ?? null); + const blockFeeRates = await mining.$getHistoricalBlockFeeRates(req.params.interval ?? null); 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, - blockFees: blockFees, + blockFeeRates: blockFeeRates, }); } catch (e) { res.status(500).send(e instanceof Error ? e.message : e); diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index 64d906b77..a9485f823 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -35,6 +35,7 @@ import { GraphsComponent } from './components/graphs/graphs.component'; import { BlocksList } from './components/blocks-list/blocks-list.component'; import { BlockFeesGraphComponent } from './components/block-fees-graph/block-fees-graph.component'; import { BlockRewardsGraphComponent } from './components/block-rewards-graph/block-rewards-graph.component'; +import { BlockFeeRatesGraphComponent } from './components/block-fee-rates-graph/block-fee-rates-graph.component'; let routes: Routes = [ { @@ -126,7 +127,11 @@ let routes: Routes = [ { path: 'mining/block-rewards', component: BlockRewardsGraphComponent, - } + }, + { + path: 'mining/block-fee-rates', + component: BlockFeeRatesGraphComponent, + }, ], }, { @@ -264,7 +269,11 @@ let routes: Routes = [ { path: 'mining/block-rewards', component: BlockRewardsGraphComponent, - } + }, + { + path: 'mining/block-fee-rates', + component: BlockFeeRatesGraphComponent, + }, ] }, { @@ -400,7 +409,11 @@ let routes: Routes = [ { path: 'mining/block-rewards', component: BlockRewardsGraphComponent, - } + }, + { + path: 'mining/block-fee-rates', + component: BlockFeeRatesGraphComponent, + }, ] }, { diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 8d7253fdf..27a637efc 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -83,6 +83,7 @@ import { RewardStatsComponent } from './components/reward-stats/reward-stats.com import { DataCyDirective } from './data-cy.directive'; import { BlockFeesGraphComponent } from './components/block-fees-graph/block-fees-graph.component'; import { BlockRewardsGraphComponent } from './components/block-rewards-graph/block-rewards-graph.component'; +import { BlockFeeRatesGraphComponent } from './components/block-fee-rates-graph/block-fee-rates-graph.component'; @NgModule({ declarations: [ @@ -147,6 +148,7 @@ import { BlockRewardsGraphComponent } from './components/block-rewards-graph/blo RewardStatsComponent, BlockFeesGraphComponent, BlockRewardsGraphComponent, + BlockFeeRatesGraphComponent, ], imports: [ BrowserModule.withServerTransition({ appId: 'serverApp' }), diff --git a/frontend/src/app/bitcoin.utils.ts b/frontend/src/app/bitcoin.utils.ts index 72fde7471..82b929f93 100644 --- a/frontend/src/app/bitcoin.utils.ts +++ b/frontend/src/app/bitcoin.utils.ts @@ -143,8 +143,10 @@ export function selectPowerOfTen(val: number) { }; let selectedPowerOfTen; - if (val < powerOfTen.mega) { + if (val < powerOfTen.kilo) { selectedPowerOfTen = { divider: 1, unit: '' }; // no scaling + } else if (val < powerOfTen.mega) { + selectedPowerOfTen = { divider: powerOfTen.kilo, unit: 'k' }; } else if (val < powerOfTen.giga) { selectedPowerOfTen = { divider: powerOfTen.mega, unit: 'M' }; } else if (val < powerOfTen.terra) { diff --git a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html new file mode 100644 index 000000000..e262b32b8 --- /dev/null +++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html @@ -0,0 +1,46 @@ +
+
+ Block fee rates +
+
+ + + + + + + + + + +
+
+
+ +
+
+
+ +
+ +
\ No newline at end of file diff --git a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss new file mode 100644 index 000000000..54dbe5fad --- /dev/null +++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.scss @@ -0,0 +1,135 @@ +.card-header { + border-bottom: 0; + font-size: 18px; + @media (min-width: 465px) { + font-size: 20px; + } +} + +.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 { + padding: 0px 15px; + width: 100%; + min-height: 500px; + height: calc(100% - 150px); + @media (max-width: 992px) { + height: 100%; + padding-bottom: 100px; + }; +} + +.chart { + width: 100%; + height: 100%; + padding-bottom: 20px; + padding-right: 10px; + @media (max-width: 992px) { + padding-bottom: 25px; + } + @media (max-width: 829px) { + padding-bottom: 50px; + } + @media (max-width: 767px) { + padding-bottom: 25px; + } + @media (max-width: 629px) { + padding-bottom: 55px; + } + @media (max-width: 567px) { + padding-bottom: 55px; + } +} +.chart-widget { + width: 100%; + height: 100%; + max-height: 270px; +} + +.formRadioGroup { + margin-top: 6px; + display: flex; + flex-direction: column; + @media (min-width: 1130px) { + position: relative; + top: -65px; + } + @media (min-width: 830px) and (max-width: 1130px) { + position: relative; + top: 0px; + } + @media (min-width: 830px) { + flex-direction: row; + float: right; + margin-top: 0px; + } + .btn-sm { + font-size: 9px; + @media (min-width: 830px) { + font-size: 14px; + } + } +} + +.pool-distribution { + min-height: 56px; + display: block; + @media (min-width: 485px) { + display: flex; + flex-direction: row; + } + h5 { + margin-bottom: 10px; + } + .item { + width: 50%; + display: inline-block; + margin: 0px auto 20px; + &:nth-child(2) { + order: 2; + @media (min-width: 485px) { + order: 3; + } + } + &:nth-child(3) { + order: 3; + @media (min-width: 485px) { + order: 2; + display: block; + } + @media (min-width: 768px) { + display: none; + } + @media (min-width: 992px) { + display: block; + } + } + .card-title { + font-size: 1rem; + color: #4a68b9; + } + .card-text { + font-size: 18px; + span { + color: #ffffff66; + font-size: 12px; + } + } + } +} + +.skeleton-loader { + width: 100%; + display: block; + max-width: 80px; + margin: 15px auto 3px; +} diff --git a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts new file mode 100644 index 000000000..f9516dc30 --- /dev/null +++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts @@ -0,0 +1,257 @@ +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 { formatNumber } from '@angular/common'; +import { FormBuilder, FormGroup } from '@angular/forms'; +import { formatterXAxis } from 'src/app/shared/graphs.utils'; +import { StorageService } from 'src/app/services/storage.service'; +import { MiningService } from 'src/app/services/mining.service'; +import { selectPowerOfTen } from 'src/app/bitcoin.utils'; + +@Component({ + selector: 'app-block-fee-rates-graph', + templateUrl: './block-fee-rates-graph.component.html', + styleUrls: ['./block-fee-rates-graph.component.scss'], + styles: [` + .loadingGraphs { + position: absolute; + top: 50%; + left: calc(50% - 15px); + z-index: 100; + } + `], + changeDetection: ChangeDetectionStrategy.OnPush, +}) +export class BlockFeeRatesGraphComponent implements OnInit { + @Input() right: number | string = 45; + @Input() left: number | string = 75; + + miningWindowPreference: string; + radioGroupForm: FormGroup; + + chartOptions: EChartsOption = {}; + chartInitOptions = { + renderer: 'svg', + }; + + statsObservable$: Observable; + isLoading = true; + formatNumber = formatNumber; + timespan = ''; + + constructor( + @Inject(LOCALE_ID) public locale: string, + private seoService: SeoService, + private apiService: ApiService, + private formBuilder: FormBuilder, + private storageService: StorageService, + private miningService: MiningService + ) { + this.radioGroupForm = this.formBuilder.group({ dateSpan: '1y' }); + this.radioGroupForm.controls.dateSpan.setValue('1y'); + } + + ngOnInit(): void { + this.seoService.setTitle($localize`:@@mining.block-fee-rates:Block Fee Rates`); + this.miningWindowPreference = this.miningService.getDefaultTimespan('24h'); + this.radioGroupForm = this.formBuilder.group({ dateSpan: this.miningWindowPreference }); + this.radioGroupForm.controls.dateSpan.setValue(this.miningWindowPreference); + + this.statsObservable$ = this.radioGroupForm.get('dateSpan').valueChanges + .pipe( + startWith(this.miningWindowPreference), + switchMap((timespan) => { + this.storageService.setValue('miningWindowPreference', timespan); + this.timespan = timespan; + this.isLoading = true; + return this.apiService.getHistoricalBlockFeeRates$(timespan) + .pipe( + tap((data: any) => { + // Group by percentile + const seriesData = { + 'Min': [], + '10th': [], + '25th': [], + 'Median': [], + '75th': [], + '90th': [], + 'Max': [] + }; + for (const rate of data.blockFeeRates) { + const timestamp = rate.timestamp * 1000; + seriesData['Min'].push([timestamp, rate.avg_fee_0, rate.avg_height]); + seriesData['10th'].push([timestamp, rate.avg_fee_10, rate.avg_height]); + seriesData['25th'].push([timestamp, rate.avg_fee_25, rate.avg_height]); + seriesData['Median'].push([timestamp, rate.avg_fee_50, rate.avg_height]); + seriesData['75th'].push([timestamp, rate.avg_fee_75, rate.avg_height]); + seriesData['90th'].push([timestamp, rate.avg_fee_90, rate.avg_height]); + seriesData['Max'].push([timestamp, rate.avg_fee_100, rate.avg_height]); + } + + // Prepare chart + const series = []; + const legends = []; + for (const percentile in seriesData) { + series.push({ + zlevel: 0, + stack: 'Total', + name: percentile, + data: seriesData[percentile], + type: 'bar', + barWidth: '100%', + large: true, + }); + + legends.push({ + name: percentile, + inactiveColor: 'rgb(110, 112, 121)', + textStyle: { + color: 'white', + }, + icon: 'roundRect', + enabled: false, + selected: false, + }); + } + + 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 = { + color: ['#D81B60', '#8E24AA', '#1E88E5', '#7CB342', '#FDD835', '#6D4C41', '#546E7A'], + animation: false, + grid: { + right: this.right, + left: this.left, + bottom: 70, + top: this.isMobile() ? 10 : 50, + }, + tooltip: { + show: !this.isMobile(), + 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) { + if (data.length <= 0) { + return ''; + } + let tooltip = ` + ${formatterXAxis(this.locale, this.timespan, parseInt(data[0].axisValue, 10))}
`; + + for (const pool of data.reverse()) { + tooltip += `${pool.marker} ${pool.seriesName}: ${pool.data[1]} sats/vByte
`; + } + + if (['24h', '3d'].includes(this.timespan)) { + tooltip += `At block: ${data[0].data[2]}`; + } else { + tooltip += `Around block ${data[0].data[2]}`; + } + + return tooltip; + }.bind(this) + }, + xAxis: data.series.length === 0 ? undefined : { + type: 'category', + splitNumber: this.isMobile() ? 5 : 10, + axisLabel: { + hideOverlap: true, + formatter: val => formatterXAxis(this.locale, this.timespan, parseInt(val, 10)), + }, + }, + legend: (data.series.length === 0) ? undefined : { + data: data.legends, + selected: { + 'Min': true, + '10th': true, + '25th': true, + 'Median': true, + '75th': true, + '90th': true, + 'Max': false, + } + }, + yAxis: data.series.length === 0 ? undefined : { + position: 'left', + axisLabel: { + color: 'rgb(110, 112, 121)', + formatter: (val) => { + const selectedPowerOfTen: any = selectPowerOfTen(val); + const newVal = Math.round(val / selectedPowerOfTen.divider); + return `${newVal}${selectedPowerOfTen.unit} sats/vB`; + }, + }, + splitLine: { + lineStyle: { + type: 'dotted', + color: '#ffffff66', + opacity: 0.25, + } + }, + type: 'value', + max: () => this.timespan === 'all' ? 5000 : undefined, + }, + series: data.series, + dataZoom: [{ + type: 'inside', + realtime: true, + zoomLock: true, + maxSpan: 100, + minSpan: 10, + moveOnMouseMove: false, + }, { + showDetail: false, + show: true, + type: 'slider', + brushSelect: false, + realtime: true, + left: 20, + right: 15, + selectedDataBackground: { + lineStyle: { + color: '#fff', + opacity: 0.45, + }, + areaStyle: { + opacity: 0, + } + }, + }], + }; + } + + isMobile() { + return (window.innerWidth <= 767.98); + } +} 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 index fc811c5ea..605004820 100644 --- 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 @@ -44,20 +44,3 @@ - - -
-
-
Hashrate
-

- -

-
-
-
Difficulty
-

- -

-
-
- \ No newline at end of file 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 index 74de3c317..56744aaa4 100644 --- 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 @@ -25,7 +25,6 @@ import { MiningService } from 'src/app/services/mining.service'; changeDetection: ChangeDetectionStrategy.OnPush, }) export class BlockFeesGraphComponent implements OnInit { - @Input() tableOnly = false; @Input() right: number | string = 45; @Input() left: number | string = 75; @@ -150,8 +149,12 @@ export class BlockFeesGraphComponent implements OnInit { } }, splitLine: { - show: false, - } + lineStyle: { + type: 'dotted', + color: '#ffffff66', + opacity: 0.25, + } + }, }, ], series: [ 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 index c2a3bcf00..32baafc45 100644 --- 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 @@ -44,21 +44,4 @@ - - - -
-
-
Hashrate
-

- -

-
-
-
Difficulty
-

- -

-
-
- \ No newline at end of file + \ No newline at end of file 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 index a22617922..f58204992 100644 --- 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 @@ -149,8 +149,12 @@ export class BlockRewardsGraphComponent implements OnInit { } }, splitLine: { - show: false, - } + lineStyle: { + type: 'dotted', + color: '#ffffff66', + opacity: 0.25, + } + }, }, ], series: [ diff --git a/frontend/src/app/components/graphs/graphs.component.html b/frontend/src/app/components/graphs/graphs.component.html index e3bdb0629..dce79ad97 100644 --- a/frontend/src/app/components/graphs/graphs.component.html +++ b/frontend/src/app/components/graphs/graphs.component.html @@ -16,6 +16,10 @@ [routerLink]="['/graphs/mining/hashrate-difficulty' | relativeUrl]" i18n="mining.hashrate-difficulty"> Hashrate & Difficulty + + Block Fee Rates + Block Fees diff --git a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts index 4cac95557..c5476df82 100644 --- a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts +++ b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts @@ -290,8 +290,12 @@ export class HashrateChartComponent implements OnInit { } }, splitLine: { - show: false, - } + lineStyle: { + type: 'dotted', + color: '#ffffff66', + opacity: 0.25, + } + }, } ], series: data.hashrates.length === 0 ? [] : [ diff --git a/frontend/src/app/components/statistics/statistics.component.ts b/frontend/src/app/components/statistics/statistics.component.ts index 1336339bc..252bb13af 100644 --- a/frontend/src/app/components/statistics/statistics.component.ts +++ b/frontend/src/app/components/statistics/statistics.component.ts @@ -179,7 +179,7 @@ export class StatisticsComponent implements OnInit { } // Find median value - const vBytes : number[] = []; + const vBytes: number[] = []; for (const stat of this.mempoolStats) { vBytes.push(stat.vbytes_per_second); } diff --git a/frontend/src/app/services/api.service.ts b/frontend/src/app/services/api.service.ts index 16a8d21d5..133292837 100644 --- a/frontend/src/app/services/api.service.ts +++ b/frontend/src/app/services/api.service.ts @@ -182,6 +182,13 @@ export class ApiService { ); } + getHistoricalBlockFeeRates$(interval: string | undefined) : Observable { + return this.httpClient.get( + this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/blocks/fee-rates` + + (interval !== undefined ? `/${interval}` : '') + ); + } + getRewardStats$(blockCount: number = 144): Observable { return this.httpClient.get(this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/reward-stats/${blockCount}`); } diff --git a/frontend/src/app/shared/graphs.utils.ts b/frontend/src/app/shared/graphs.utils.ts index e0ffe841e..096a37bce 100644 --- a/frontend/src/app/shared/graphs.utils.ts +++ b/frontend/src/app/shared/graphs.utils.ts @@ -1,10 +1,9 @@ export const formatterXAxis = ( locale: string, windowPreference: string, - value: string + value: string | number ) => { - - if(value.length === 0){ + if (typeof value === 'string' && value.length === 0){ return null; } @@ -13,6 +12,7 @@ export const formatterXAxis = ( case '2h': return date.toLocaleTimeString(locale, { hour: 'numeric', minute: 'numeric' }); case '24h': + case '3d': return date.toLocaleTimeString(locale, { weekday: 'short', hour: 'numeric', minute: 'numeric' }); case '1w': case '1m': @@ -22,6 +22,7 @@ export const formatterXAxis = ( return date.toLocaleTimeString(locale, { month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric' }); case '2y': case '3y': + case 'all': return date.toLocaleDateString(locale, { year: 'numeric', month: 'short', day: 'numeric' }); } }; From b79fb6265c48e92bd2a51f68213c4482686f74cd Mon Sep 17 00:00:00 2001 From: nymkappa Date: Fri, 15 Apr 2022 00:34:15 +0900 Subject: [PATCH 03/10] 24h/3d block fee rates chart is clickable --- .../block-fee-rates-graph.component.html | 3 +- .../block-fee-rates-graph.component.ts | 30 +++++++++++++++++-- 2 files changed, 30 insertions(+), 3 deletions(-) diff --git a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html index e262b32b8..1fb97407b 100644 --- a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html +++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.html @@ -37,7 +37,8 @@ -
+
diff --git a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts index f9516dc30..1d6a0c4c5 100644 --- a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts +++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts @@ -1,4 +1,4 @@ -import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, OnInit } from '@angular/core'; +import { ChangeDetectionStrategy, Component, Inject, Input, LOCALE_ID, NgZone, OnInit } from '@angular/core'; import { EChartsOption } from 'echarts'; import { Observable } from 'rxjs'; import { map, share, startWith, switchMap, tap } from 'rxjs/operators'; @@ -10,6 +10,9 @@ import { formatterXAxis } from 'src/app/shared/graphs.utils'; import { StorageService } from 'src/app/services/storage.service'; import { MiningService } from 'src/app/services/mining.service'; import { selectPowerOfTen } from 'src/app/bitcoin.utils'; +import { RelativeUrlPipe } from 'src/app/shared/pipes/relative-url/relative-url.pipe'; +import { StateService } from 'src/app/services/state.service'; +import { Router } from '@angular/router'; @Component({ selector: 'app-block-fee-rates-graph', @@ -41,6 +44,7 @@ export class BlockFeeRatesGraphComponent implements OnInit { isLoading = true; formatNumber = formatNumber; timespan = ''; + chartInstance: any = undefined; constructor( @Inject(LOCALE_ID) public locale: string, @@ -48,7 +52,10 @@ export class BlockFeeRatesGraphComponent implements OnInit { private apiService: ApiService, private formBuilder: FormBuilder, private storageService: StorageService, - private miningService: MiningService + private miningService: MiningService, + private stateService: StateService, + private router: Router, + private zone: NgZone, ) { this.radioGroupForm = this.formBuilder.group({ dateSpan: '1y' }); this.radioGroupForm.controls.dateSpan.setValue('1y'); @@ -251,6 +258,25 @@ export class BlockFeeRatesGraphComponent implements OnInit { }; } + onChartInit(ec) { + if (this.chartInstance !== undefined) { + return; + } + + this.chartInstance = ec; + this.chartInstance.on('click', (e) => { + if (e.data.data === 9999) { // "Other" + return; + } + this.zone.run(() => { + if (['24h', '3d'].includes(this.timespan)) { + const url = new RelativeUrlPipe(this.stateService).transform(`/block/${e.data[2]}`); + this.router.navigate([url]); + } + }); + }); + } + isMobile() { return (window.innerWidth <= 767.98); } From 31ded69a4c500bcd6c8ad917cc8b4be0555a5754 Mon Sep 17 00:00:00 2001 From: nymkappa Date: Fri, 15 Apr 2022 18:05:58 +0900 Subject: [PATCH 04/10] Update cache warmer --- backend/src/repositories/BlocksRepository.ts | 8 +------- production/nginx-cache-warmer | 10 ++++++++++ 2 files changed, 11 insertions(+), 7 deletions(-) diff --git a/backend/src/repositories/BlocksRepository.ts b/backend/src/repositories/BlocksRepository.ts index 6a2b85305..78a17eb71 100644 --- a/backend/src/repositories/BlocksRepository.ts +++ b/backend/src/repositories/BlocksRepository.ts @@ -436,10 +436,7 @@ class BlocksRepository { * Get the historical averaged block fee rate percentiles */ public async $getHistoricalBlockFeeRates(div: number, interval: string | null): Promise { - let connection; try { - connection = await DB.getConnection(); - let query = `SELECT CAST(AVG(height) as INT) as avg_height, CAST(AVG(UNIX_TIMESTAMP(blockTimestamp)) as INT) as timestamp, @@ -458,12 +455,9 @@ class BlocksRepository { query += ` GROUP BY UNIX_TIMESTAMP(blockTimestamp) DIV ${div}`; - const [rows]: any = await connection.query(query); - connection.release(); - + const [rows]: any = await DB.query(query); return rows; } catch (e) { - connection.release(); logger.err('Cannot generate block fee rates history. Reason: ' + (e instanceof Error ? e.message : e)); throw e; } diff --git a/production/nginx-cache-warmer b/production/nginx-cache-warmer index 3c3204493..165a97860 100755 --- a/production/nginx-cache-warmer +++ b/production/nginx-cache-warmer @@ -57,6 +57,16 @@ do for url in / \ '/api/v1/mining/blocks/rewards/2y' \ '/api/v1/mining/blocks/rewards/3y' \ '/api/v1/mining/blocks/rewards/all' \ + '/api/v1/mining/blocks/fee-rates/24h' \ + '/api/v1/mining/blocks/fee-rates/3d' \ + '/api/v1/mining/blocks/fee-rates/1w' \ + '/api/v1/mining/blocks/fee-rates/1m' \ + '/api/v1/mining/blocks/fee-rates/3m' \ + '/api/v1/mining/blocks/fee-rates/6m' \ + '/api/v1/mining/blocks/fee-rates/1y' \ + '/api/v1/mining/blocks/fee-rates/2y' \ + '/api/v1/mining/blocks/fee-rates/3y' \ + '/api/v1/mining/blocks/fee-rates/all' \ do curl -s "https://${hostname}${url}" >/dev/null From d0b27813b0ef7206202dd46c4d9b05ca8306753f Mon Sep 17 00:00:00 2001 From: nymkappa Date: Fri, 15 Apr 2022 19:39:27 +0900 Subject: [PATCH 05/10] Save fee rates legend preference - Fix xaxis label --- .../block-fee-rates-graph.component.ts | 37 ++++++++++++++----- .../block-fees-graph.component.ts | 2 +- .../block-rewards-graph.component.ts | 2 +- .../hashrate-chart.component.ts | 2 +- frontend/src/app/shared/graphs.utils.ts | 33 ++++++++++++++++- 5 files changed, 61 insertions(+), 15 deletions(-) diff --git a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts index 1d6a0c4c5..9b4363fd8 100644 --- a/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts +++ b/frontend/src/app/components/block-fee-rates-graph/block-fee-rates-graph.component.ts @@ -6,7 +6,7 @@ import { ApiService } from 'src/app/services/api.service'; import { SeoService } from 'src/app/services/seo.service'; import { formatNumber } from '@angular/common'; import { FormBuilder, FormGroup } from '@angular/forms'; -import { formatterXAxis } from 'src/app/shared/graphs.utils'; +import { formatterXAxis, formatterXAxisLabel, formatterXAxisTimeCategory } from 'src/app/shared/graphs.utils'; import { StorageService } from 'src/app/services/storage.service'; import { MiningService } from 'src/app/services/mining.service'; import { selectPowerOfTen } from 'src/app/bitcoin.utils'; @@ -152,7 +152,7 @@ export class BlockFeeRatesGraphComponent implements OnInit { grid: { right: this.right, left: this.left, - bottom: 70, + bottom: 80, top: this.isMobile() ? 10 : 50, }, tooltip: { @@ -189,17 +189,28 @@ export class BlockFeeRatesGraphComponent implements OnInit { return tooltip; }.bind(this) }, - xAxis: data.series.length === 0 ? undefined : { + xAxis: data.series.length === 0 ? undefined : + { + name: formatterXAxisLabel(this.locale, this.timespan), + nameLocation: 'middle', + nameTextStyle: { + padding: [10, 0, 0, 0], + }, type: 'category', - splitNumber: this.isMobile() ? 5 : 10, + boundaryGap: false, + axisLine: { onZero: true }, axisLabel: { + formatter: val => formatterXAxisTimeCategory(this.locale, this.timespan, parseInt(val, 10)), + align: 'center', + fontSize: 11, + lineHeight: 12, hideOverlap: true, - formatter: val => formatterXAxis(this.locale, this.timespan, parseInt(val, 10)), + padding: [0, 5], }, }, legend: (data.series.length === 0) ? undefined : { data: data.legends, - selected: { + selected: JSON.parse(this.storageService.getValue('fee_rates_legend')) ?? { 'Min': true, '10th': true, '25th': true, @@ -207,7 +218,8 @@ export class BlockFeeRatesGraphComponent implements OnInit { '75th': true, '90th': true, 'Max': false, - } + }, + id: 4242, }, yAxis: data.series.length === 0 ? undefined : { position: 'left', @@ -216,7 +228,7 @@ export class BlockFeeRatesGraphComponent implements OnInit { formatter: (val) => { const selectedPowerOfTen: any = selectPowerOfTen(val); const newVal = Math.round(val / selectedPowerOfTen.divider); - return `${newVal}${selectedPowerOfTen.unit} sats/vB`; + return `${newVal}${selectedPowerOfTen.unit} s/vB`; }, }, splitLine: { @@ -227,7 +239,7 @@ export class BlockFeeRatesGraphComponent implements OnInit { } }, type: 'value', - max: () => this.timespan === 'all' ? 5000 : undefined, + max: (val) => this.timespan === 'all' ? Math.min(val.max, 5000) : undefined, }, series: data.series, dataZoom: [{ @@ -235,7 +247,7 @@ export class BlockFeeRatesGraphComponent implements OnInit { realtime: true, zoomLock: true, maxSpan: 100, - minSpan: 10, + minSpan: 5, moveOnMouseMove: false, }, { showDetail: false, @@ -264,6 +276,7 @@ export class BlockFeeRatesGraphComponent implements OnInit { } this.chartInstance = ec; + this.chartInstance.on('click', (e) => { if (e.data.data === 9999) { // "Other" return; @@ -275,6 +288,10 @@ export class BlockFeeRatesGraphComponent implements OnInit { } }); }); + + this.chartInstance.on('legendselectchanged', (e) => { + this.storageService.setValue('fee_rates_legend', JSON.stringify(e.selected)); + }); } isMobile() { 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 index 56744aaa4..488634cc7 100644 --- 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 @@ -175,7 +175,7 @@ export class BlockFeesGraphComponent implements OnInit { realtime: true, zoomLock: true, maxSpan: 100, - minSpan: 10, + minSpan: 5, moveOnMouseMove: false, }, { showDetail: false, 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 index f58204992..fd1f6a680 100644 --- 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 @@ -175,7 +175,7 @@ export class BlockRewardsGraphComponent implements OnInit { realtime: true, zoomLock: true, maxSpan: 100, - minSpan: 10, + minSpan: 5, moveOnMouseMove: false, }, { showDetail: false, diff --git a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts index c5476df82..737323a7c 100644 --- a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts +++ b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts @@ -328,7 +328,7 @@ export class HashrateChartComponent implements OnInit { realtime: true, zoomLock: true, maxSpan: 100, - minSpan: 10, + minSpan: 5, moveOnMouseMove: false, }, { showDetail: false, diff --git a/frontend/src/app/shared/graphs.utils.ts b/frontend/src/app/shared/graphs.utils.ts index 096a37bce..cf12f2f94 100644 --- a/frontend/src/app/shared/graphs.utils.ts +++ b/frontend/src/app/shared/graphs.utils.ts @@ -3,7 +3,7 @@ export const formatterXAxis = ( windowPreference: string, value: string | number ) => { - if (typeof value === 'string' && value.length === 0){ + if (typeof value === 'string' && value.length === 0) { return null; } @@ -22,8 +22,9 @@ export const formatterXAxis = ( return date.toLocaleTimeString(locale, { month: 'short', day: 'numeric', hour: 'numeric', minute: 'numeric' }); case '2y': case '3y': - case 'all': return date.toLocaleDateString(locale, { year: 'numeric', month: 'short', day: 'numeric' }); + case 'all': + return date.toLocaleDateString(locale, { year: 'numeric', month: 'short' }); } }; @@ -36,6 +37,7 @@ export const formatterXAxisLabel = ( case '2h': case '24h': return date.toLocaleDateString(locale, { year: 'numeric', month: 'short', day: 'numeric' }); + case '3d': case '1w': return date.toLocaleDateString(locale, { year: 'numeric', month: 'long' }); case '1m': @@ -48,3 +50,30 @@ export const formatterXAxisLabel = ( return null; } }; + +export const formatterXAxisTimeCategory = ( + locale: string, + windowPreference: string, + value: number +) => { + const date = new Date(value); + switch (windowPreference) { + case '2h': + return date.toLocaleTimeString(locale, { hour: 'numeric', minute: 'numeric' }); + case '24h': + return date.toLocaleTimeString(locale, { weekday: 'short', hour: 'numeric' }); + case '3d': + case '1w': + return date.toLocaleTimeString(locale, { month: 'short', day: 'numeric', hour: 'numeric' }); + case '1m': + case '3m': + return date.toLocaleDateString(locale, { month: 'long', day: 'numeric' }); + case '6m': + case '1y': + return date.toLocaleDateString(locale, { year: 'numeric', month: 'short', day: 'numeric' }); + case '2y': + case '3y': + case 'all': + return date.toLocaleDateString(locale, { year: 'numeric', month: 'long' }); + } +}; From f7d57a273799495278ba4b0a831dc9149a440345 Mon Sep 17 00:00:00 2001 From: nymkappa Date: Fri, 15 Apr 2022 20:43:10 +0900 Subject: [PATCH 06/10] Use block count instead of oldest block for timespan selection --- backend/src/routes.ts | 40 ++++++++----------- .../block-fees-graph.component.html | 20 +++++----- .../block-fees-graph.component.ts | 12 ++---- .../block-rewards-graph.component.html | 20 +++++----- .../block-rewards-graph.component.ts | 12 ++---- ...difficulty-adjustments-table.components.ts | 3 +- .../hashrate-chart.component.html | 14 +++---- .../hashrate-chart.component.ts | 13 +++--- .../hashrate-chart-pools.component.html | 14 +++---- .../hashrate-chart-pools.component.ts | 15 +++---- .../pool-ranking/pool-ranking.component.html | 22 +++++----- .../pool-ranking/pool-ranking.component.ts | 2 +- frontend/src/app/services/api.service.ts | 14 +++---- frontend/src/app/services/mining.service.ts | 13 +++--- 14 files changed, 96 insertions(+), 118 deletions(-) diff --git a/backend/src/routes.ts b/backend/src/routes.ts index 9d4adb796..e1ffad61f 100644 --- 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); } @@ -970,7 +964,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 index fc811c5ea..8f1e017d7 100644 --- 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 @@ Block fees
-
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 index 74de3c317..9b542e010 100644 --- 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 @@ -69,19 +69,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 index c2a3bcf00..c5824038f 100644 --- 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 @@ Block rewards
-
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 index a22617922..e096ce1ac 100644 --- 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/frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts b/frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts index 5e8b3ded7..1026bc145 100644 --- a/frontend/src/app/components/difficulty-adjustments-table/difficulty-adjustments-table.components.ts +++ b/frontend/src/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 index 93f17dcdf..b01a68dc4 100644 --- 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 @@ Hashrate & Difficulty
-
diff --git a/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts b/frontend/src/app/components/hashrate-chart/hashrate-chart.component.ts index 4cac95557..838854360 100644 --- 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, }; diff --git 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 index f3d547dd6..97f6c5164 100644 --- 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 @@ -4,25 +4,25 @@ Mining pools dominance
-
diff --git 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 index 85bea9840..e974b20aa 100644 --- 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 @@ -72,10 +72,11 @@ export class HashrateChartPoolsComponent implements OnInit { this.isLoading = true; return this.apiService.getHistoricalPoolsHashrate$(timespan) .pipe( - tap((data: any) => { + tap((response) => { + const hashrates = response.body; // Prepare series (group all hashrates data point by pool) const grouped = {}; - for (const hashrate of data.hashrates) { + for (const hashrate of hashrates) { if (!grouped.hasOwnProperty(hashrate.poolName)) { grouped[hashrate.poolName] = []; } @@ -119,7 +120,6 @@ export class HashrateChartPoolsComponent implements OnInit { this.prepareChartOptions({ legends: legends, series: series, - timestamp: data.oldestIndexedBlockTimestamp, }); this.isLoading = false; @@ -128,13 +128,10 @@ export class HashrateChartPoolsComponent implements OnInit { throw new Error(); } }), - 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), + } }), retryWhen((errors) => errors.pipe( delay(60000) diff --git a/frontend/src/app/components/pool-ranking/pool-ranking.component.html b/frontend/src/app/components/pool-ranking/pool-ranking.component.html index 3c038df80..9a9fe45bd 100644 --- a/frontend/src/app/components/pool-ranking/pool-ranking.component.html +++ b/frontend/src/app/components/pool-ranking/pool-ranking.component.html @@ -26,36 +26,36 @@
Mining pools share + *ngIf="!widget && (miningStatsObservable$ | async) as stats">
-
diff --git a/frontend/src/app/components/pool-ranking/pool-ranking.component.ts b/frontend/src/app/components/pool-ranking/pool-ranking.component.ts index 95c2be2b7..4056b0ed6 100644 --- a/frontend/src/app/components/pool-ranking/pool-ranking.component.ts +++ b/frontend/src/app/components/pool-ranking/pool-ranking.component.ts @@ -276,7 +276,7 @@ export class PoolRankingComponent implements OnInit { totalEmptyBlock: 0, totalEmptyBlockRatio: '', pools: [], - availableTimespanDay: 0, + totalBlockCount: 0, miningUnits: { hashrateDivider: 1, hashrateUnit: '', diff --git a/frontend/src/app/services/api.service.ts b/frontend/src/app/services/api.service.ts index 16a8d21d5..4c10077d3 100644 --- a/frontend/src/app/services/api.service.ts +++ b/frontend/src/app/services/api.service.ts @@ -125,10 +125,10 @@ export class ApiService { return this.httpClient.post(this.apiBaseUrl + this.apiBasePath + '/api/tx', hexPayload, { responseType: 'text' as 'json'}); } - listPools$(interval: string | undefined) : Observable { - return this.httpClient.get( + listPools$(interval: string | undefined) : Observable { + return this.httpClient.get( this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/pools` + - (interval !== undefined ? `/${interval}` : '') + (interval !== undefined ? `/${interval}` : ''), { observe: 'response' } ); } @@ -157,28 +157,28 @@ export class ApiService { getHistoricalHashrate$(interval: string | undefined): Observable { return this.httpClient.get( this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/hashrate` + - (interval !== undefined ? `/${interval}` : '') + (interval !== undefined ? `/${interval}` : ''), { observe: 'response' } ); } getHistoricalPoolsHashrate$(interval: string | undefined): Observable { return this.httpClient.get( this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/hashrate/pools` + - (interval !== undefined ? `/${interval}` : '') + (interval !== undefined ? `/${interval}` : ''), { observe: 'response' } ); } getHistoricalBlockFees$(interval: string | undefined) : Observable { return this.httpClient.get( this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/blocks/fees` + - (interval !== undefined ? `/${interval}` : '') + (interval !== undefined ? `/${interval}` : ''), { observe: 'response' } ); } getHistoricalBlockRewards$(interval: string | undefined) : Observable { return this.httpClient.get( this.apiBaseUrl + this.apiBasePath + `/api/v1/mining/blocks/rewards` + - (interval !== undefined ? `/${interval}` : '') + (interval !== undefined ? `/${interval}` : ''), { observe: 'response' } ); } diff --git a/frontend/src/app/services/mining.service.ts b/frontend/src/app/services/mining.service.ts index 0480b09cd..7806debd7 100644 --- a/frontend/src/app/services/mining.service.ts +++ b/frontend/src/app/services/mining.service.ts @@ -18,7 +18,7 @@ export interface MiningStats { totalEmptyBlockRatio: string; pools: SinglePoolStats[]; miningUnits: MiningUnits; - availableTimespanDay: number; + totalBlockCount: number; } @Injectable({ @@ -37,7 +37,7 @@ export class MiningService { */ public getMiningStats(interval: string): Observable { return this.apiService.listPools$(interval).pipe( - map(pools => this.generateMiningStats(pools)) + map(response => this.generateMiningStats(response)) ); } @@ -82,7 +82,8 @@ export class MiningService { return preference; } - private generateMiningStats(stats: PoolsStats): MiningStats { + private generateMiningStats(response): MiningStats { + const stats: PoolsStats = response.body; const miningUnits = this.getMiningUnits(); const hashrateDivider = miningUnits.hashrateDivider; @@ -100,10 +101,6 @@ export class MiningService { }; }); - const availableTimespanDay = ( - (new Date().getTime() / 1000) - (stats.oldestIndexedBlockTimestamp) - ) / 3600 / 24; - return { lastEstimatedHashrate: (stats.lastEstimatedHashrate / hashrateDivider).toFixed(2), blockCount: stats.blockCount, @@ -111,7 +108,7 @@ export class MiningService { totalEmptyBlockRatio: totalEmptyBlockRatio, pools: poolsStats, miningUnits: miningUnits, - availableTimespanDay: availableTimespanDay, + totalBlockCount: parseInt(response.headers.get('x-total-count'), 10), }; } } From a68bab2c96c25c7fec88cad7f84afd523d2c388f Mon Sep 17 00:00:00 2001 From: nymkappa Date: Tue, 19 Apr 2022 22:38:25 +0900 Subject: [PATCH 07/10] Add Mercury Wallet on About page as Wallet Integration --- .../app/components/about/about.component.html | 4 +++ .../app/components/about/about.component.scss | 2 +- frontend/src/resources/profile/mercury.svg | 25 +++++++++++++++++++ 3 files changed, 30 insertions(+), 1 deletion(-) create mode 100644 frontend/src/resources/profile/mercury.svg diff --git a/frontend/src/app/components/about/about.component.html b/frontend/src/app/components/about/about.component.html index 74203ab81..27892626c 100644 --- a/frontend/src/app/components/about/about.component.html +++ b/frontend/src/app/components/about/about.component.html @@ -226,6 +226,10 @@ Phoenix + + + Mercury + Muun diff --git a/frontend/src/app/components/about/about.component.scss b/frontend/src/app/components/about/about.component.scss index 222c14944..a373683c6 100644 --- a/frontend/src/app/components/about/about.component.scss +++ b/frontend/src/app/components/about/about.component.scss @@ -185,6 +185,6 @@ } .community-integrations-sponsor { - max-width: 750px; + max-width: 830px; margin: auto; } diff --git a/frontend/src/resources/profile/mercury.svg b/frontend/src/resources/profile/mercury.svg new file mode 100644 index 000000000..35af2b8a7 --- /dev/null +++ b/frontend/src/resources/profile/mercury.svg @@ -0,0 +1,25 @@ + + + + + + + + + + + + + From 0565471ecfbfab0d3805042c6087d88f157edb60 Mon Sep 17 00:00:00 2001 From: nymkappa Date: Fri, 22 Apr 2022 04:03:08 -0400 Subject: [PATCH 08/10] Wait for external assets file writers to complete --- backend/src/api/common.ts | 2 +- backend/src/api/database-migration.ts | 9 ++- backend/src/api/liquid/icons.ts | 1 - backend/src/index.ts | 6 +- backend/src/sync-assets.ts | 96 +++++++++++++++------------ 5 files changed, 63 insertions(+), 51 deletions(-) diff --git a/backend/src/api/common.ts b/backend/src/api/common.ts index f9ae196b3..45ef5f576 100644 --- a/backend/src/api/common.ts +++ b/backend/src/api/common.ts @@ -77,7 +77,7 @@ export class Common { }; } - static sleep(ms: number): Promise { + static sleep$(ms: number): Promise { return new Promise((resolve) => { setTimeout(() => { resolve(); diff --git a/backend/src/api/database-migration.ts b/backend/src/api/database-migration.ts index 0e9a18220..45b82a3a5 100644 --- a/backend/src/api/database-migration.ts +++ b/backend/src/api/database-migration.ts @@ -1,8 +1,7 @@ import config from '../config'; import DB from '../database'; import logger from '../logger'; - -const sleep = (ms: number) => new Promise(res => setTimeout(res, ms)); +import { Common } from './common'; class DatabaseMigration { private static currentVersion = 17; @@ -25,7 +24,7 @@ class DatabaseMigration { await this.$createMigrationStateTable(); } catch (e) { logger.err('MIGRATIONS: Unable to create `state` table, aborting in 10 seconds. ' + e); - await sleep(10000); + await Common.sleep$(10000); process.exit(-1); } logger.debug('MIGRATIONS: `state` table initialized.'); @@ -36,7 +35,7 @@ class DatabaseMigration { databaseSchemaVersion = await this.$getSchemaVersionFromDatabase(); } catch (e) { logger.err('MIGRATIONS: Unable to get current database migration version, aborting in 10 seconds. ' + e); - await sleep(10000); + await Common.sleep$(10000); process.exit(-1); } @@ -52,7 +51,7 @@ class DatabaseMigration { await this.$createMissingTablesAndIndexes(databaseSchemaVersion); } catch (e) { logger.err('MIGRATIONS: Unable to create required tables, aborting in 10 seconds. ' + e); - await sleep(10000); + await Common.sleep$(10000); process.exit(-1); } diff --git a/backend/src/api/liquid/icons.ts b/backend/src/api/liquid/icons.ts index 1c7c658af..ee08757d0 100644 --- a/backend/src/api/liquid/icons.ts +++ b/backend/src/api/liquid/icons.ts @@ -1,5 +1,4 @@ import * as fs from 'fs'; -import config from '../../config'; import logger from '../../logger'; class Icons { diff --git a/backend/src/index.ts b/backend/src/index.ts index 943448e3a..00ba7cc37 100644 --- a/backend/src/index.ts +++ b/backend/src/index.ts @@ -85,16 +85,16 @@ class Server { this.setUpWebsocketHandling(); - await syncAssets.syncAssets(); + await syncAssets.syncAssets$(); diskCache.loadMempoolCache(); if (config.DATABASE.ENABLED) { await DB.checkDbConnection(); try { - if (process.env.npm_config_reindex != undefined) { // Re-index requests + if (process.env.npm_config_reindex !== undefined) { // Re-index requests const tables = process.env.npm_config_reindex.split(','); logger.warn(`Indexed data for "${process.env.npm_config_reindex}" tables will be erased in 5 seconds (using '--reindex')`); - await Common.sleep(5000); + await Common.sleep$(5000); await databaseMigration.$truncateIndexedData(tables); } await databaseMigration.$initializeOrMigrateDatabase(); diff --git a/backend/src/sync-assets.ts b/backend/src/sync-assets.ts index d7644e24b..032e71ee2 100644 --- a/backend/src/sync-assets.ts +++ b/backend/src/sync-assets.ts @@ -9,55 +9,69 @@ const PATH = './'; class SyncAssets { constructor() { } - public async syncAssets() { + public async syncAssets$() { for (const url of config.MEMPOOL.EXTERNAL_ASSETS) { - await this.downloadFile(url); + try { + await this.downloadFile$(url); + } catch (e) { + throw new Error(`Failed to download external asset. ` + (e instanceof Error ? e.message : e)); + } } } - private async downloadFile(url: string) { - const fileName = url.split('/').slice(-1)[0]; + private async downloadFile$(url: string) { + return new Promise((resolve, reject) => { + const fileName = url.split('/').slice(-1)[0]; - try { - if (config.SOCKS5PROXY.ENABLED) { - let socksOptions: any = { - agentOptions: { - keepAlive: true, - }, - host: config.SOCKS5PROXY.HOST, - port: config.SOCKS5PROXY.PORT - }; + try { + if (config.SOCKS5PROXY.ENABLED) { + const socksOptions: any = { + agentOptions: { + keepAlive: true, + }, + host: config.SOCKS5PROXY.HOST, + port: config.SOCKS5PROXY.PORT + }; - if (config.SOCKS5PROXY.USERNAME && config.SOCKS5PROXY.PASSWORD) { - socksOptions.username = config.SOCKS5PROXY.USERNAME; - socksOptions.password = config.SOCKS5PROXY.PASSWORD; + if (config.SOCKS5PROXY.USERNAME && config.SOCKS5PROXY.PASSWORD) { + socksOptions.username = config.SOCKS5PROXY.USERNAME; + socksOptions.password = config.SOCKS5PROXY.PASSWORD; + } + + const agent = new SocksProxyAgent(socksOptions); + + logger.info(`Downloading external asset ${fileName} over the Tor network...`); + return axios.get(url, { + httpAgent: agent, + httpsAgent: agent, + responseType: 'stream', + timeout: 30000 + }).then(function (response) { + const writer = fs.createWriteStream(PATH + fileName); + writer.on('finish', () => { + logger.info(`External asset ${fileName} saved to ${PATH + fileName}`); + resolve(0); + }); + response.data.pipe(writer); + }); + } else { + logger.info(`Downloading external asset ${fileName} over clearnet...`); + return axios.get(url, { + responseType: 'stream', + timeout: 30000 + }).then(function (response) { + const writer = fs.createWriteStream(PATH + fileName); + writer.on('finish', () => { + logger.info(`External asset ${fileName} saved to ${PATH + fileName}`); + resolve(0); + }); + response.data.pipe(writer); + }); } - - const agent = new SocksProxyAgent(socksOptions); - - logger.info(`Downloading external asset ${fileName} over the Tor network...`); - await axios.get(url, { - httpAgent: agent, - httpsAgent: agent, - responseType: 'stream', - timeout: 30000 - }).then(function (response) { - response.data.pipe(fs.createWriteStream(PATH + fileName)); - logger.info(`External asset ${fileName} saved to ${PATH + fileName}`); - }); - } else { - logger.info(`Downloading external asset ${fileName} over clearnet...`); - await axios.get(url, { - responseType: 'stream', - timeout: 30000 - }).then(function (response) { - response.data.pipe(fs.createWriteStream(PATH + fileName)); - logger.info(`External asset ${fileName} saved to ${PATH + fileName}`); - }); + } catch (e: any) { + reject(e); } - } catch (e: any) { - throw new Error(`Failed to download external asset. ` + e); - } + }); } } From c51216f97c61cb2e8193c96c61e0d321a266c65b Mon Sep 17 00:00:00 2001 From: nymkappa Date: Sat, 23 Apr 2022 08:56:55 +0900 Subject: [PATCH 09/10] Remove hardcoded liquid.network in asset icons url --- frontend/src/app/components/asset/asset.component.html | 2 +- .../components/assets/asset-group/asset-group.component.html | 2 +- .../assets/assets-featured/assets-featured.component.html | 4 ++-- frontend/src/app/dashboard/dashboard.component.html | 2 +- 4 files changed, 5 insertions(+), 5 deletions(-) diff --git a/frontend/src/app/components/asset/asset.component.html b/frontend/src/app/components/asset/asset.component.html index b1728a0ff..800e0a8f6 100644 --- a/frontend/src/app/components/asset/asset.component.html +++ b/frontend/src/app/components/asset/asset.component.html @@ -64,7 +64,7 @@
- + diff --git a/frontend/src/app/components/assets/asset-group/asset-group.component.html b/frontend/src/app/components/assets/asset-group/asset-group.component.html index ac0ed4327..df3f90abd 100644 --- a/frontend/src/app/components/assets/asset-group/asset-group.component.html +++ b/frontend/src/app/components/assets/asset-group/asset-group.component.html @@ -15,7 +15,7 @@
- +
{{ asset.name }} diff --git a/frontend/src/app/components/assets/assets-featured/assets-featured.component.html b/frontend/src/app/components/assets/assets-featured/assets-featured.component.html index b87713ceb..7893fda2c 100644 --- a/frontend/src/app/components/assets/assets-featured/assets-featured.component.html +++ b/frontend/src/app/components/assets/assets-featured/assets-featured.component.html @@ -3,14 +3,14 @@
- +
{{ group.name }}
Group of {{ group.assets.length | number }} assets
 - +
{{ group.name }} diff --git a/frontend/src/app/dashboard/dashboard.component.html b/frontend/src/app/dashboard/dashboard.component.html index 95ff4aa33..80ab9545d 100644 --- a/frontend/src/app/dashboard/dashboard.component.html +++ b/frontend/src/app/dashboard/dashboard.component.html @@ -79,7 +79,7 @@ - + From 0803fed0f4d4de06f27ec700f8467a3fad686104 Mon Sep 17 00:00:00 2001 From: nymkappa Date: Sat, 23 Apr 2022 15:50:45 +0900 Subject: [PATCH 10/10] Fix pool component hashrate api response handling --- backend/src/repositories/HashratesRepository.ts | 2 +- frontend/src/app/components/pool/pool.component.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/backend/src/repositories/HashratesRepository.ts b/backend/src/repositories/HashratesRepository.ts index 8388b9122..338948427 100644 --- 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 { + public async $getPoolWeeklyHashrate(slug: string): Promise { const pool = await PoolsRepository.$getPool(slug); if (!pool) { throw new Error(`This mining pool does not exist`); diff --git a/frontend/src/app/components/pool/pool.component.ts b/frontend/src/app/components/pool/pool.component.ts index 4d41c2437..9d644121a 100644 --- a/frontend/src/app/components/pool/pool.component.ts +++ b/frontend/src/app/components/pool/pool.component.ts @@ -56,7 +56,7 @@ export class PoolComponent implements OnInit { .pipe( switchMap((data) => { this.isLoading = false; - this.prepareChartOptions(data.hashrates.map(val => [val.timestamp * 1000, val.avgHashrate])); + this.prepareChartOptions(data.map(val => [val.timestamp * 1000, val.avgHashrate])); return [slug]; }), );