From 0730053d5d3c1ae66e5b40e888450248123a96eb Mon Sep 17 00:00:00 2001 From: nymkappa Date: Sun, 13 Mar 2022 11:38:45 +0100 Subject: [PATCH] Use bitcoin RPC getblock because esplora returns int for difficulty - Fix some css in mining dashboard --- backend/src/api/bitcoin/bitcoin-api.ts | 4 +- backend/src/api/blocks.ts | 37 +++++----- .../mining-dashboard.component.html | 62 ++++++++-------- .../mining-dashboard.component.scss | 71 ++++++++++--------- .../mining-dashboard.component.ts | 4 +- 5 files changed, 94 insertions(+), 84 deletions(-) diff --git a/backend/src/api/bitcoin/bitcoin-api.ts b/backend/src/api/bitcoin/bitcoin-api.ts index 97a428c23..8d66f82ef 100644 --- a/backend/src/api/bitcoin/bitcoin-api.ts +++ b/backend/src/api/bitcoin/bitcoin-api.ts @@ -70,7 +70,7 @@ class BitcoinApi implements AbstractBitcoinApi { } return this.bitcoindClient.getBlock(hash) - .then((block: IBitcoinApi.Block) => this.convertBlock(block)); + .then((block: IBitcoinApi.Block) => BitcoinApi.convertBlock(block)); } $getAddress(address: string): Promise { @@ -186,7 +186,7 @@ class BitcoinApi implements AbstractBitcoinApi { return esploraTransaction; } - private convertBlock(block: IBitcoinApi.Block): IEsploraApi.Block { + static convertBlock(block: IBitcoinApi.Block): IEsploraApi.Block { return { id: block.hash, height: block.height, diff --git a/backend/src/api/blocks.ts b/backend/src/api/blocks.ts index 7a9589348..8f066b5a4 100644 --- a/backend/src/api/blocks.ts +++ b/backend/src/api/blocks.ts @@ -11,6 +11,7 @@ import { IEsploraApi } from './bitcoin/esplora-api.interface'; import poolsRepository from '../repositories/PoolsRepository'; import blocksRepository from '../repositories/BlocksRepository'; import loadingIndicators from './loading-indicators'; +import BitcoinApi from './bitcoin/bitcoin-api'; class Blocks { private blocks: BlockExtended[] = []; @@ -103,8 +104,8 @@ class Blocks { * @param transactions * @returns BlockExtended */ - private async $getBlockExtended(block: IEsploraApi.Block, transactions: TransactionExtended[]): Promise { - const blockExtended: BlockExtended = Object.assign({extras: {}}, block); + private async $getBlockExtended(block: IEsploraApi.Block, transactions: TransactionExtended[]): Promise { + const blockExtended: BlockExtended = Object.assign({ extras: {} }, block); blockExtended.extras.reward = transactions[0].vout.reduce((acc, curr) => acc + curr.value, 0); blockExtended.extras.coinbaseTx = transactionUtils.stripCoinbaseTransaction(transactions[0]); @@ -112,19 +113,19 @@ class Blocks { blockExtended.extras.coinbaseRaw = coinbaseRaw.hex; if (block.height === 0) { - blockExtended.extras.medianFee = 0; // 50th percentiles - blockExtended.extras.feeRange = [0, 0, 0, 0, 0, 0, 0]; - blockExtended.extras.totalFees = 0; - blockExtended.extras.avgFee = 0; - blockExtended.extras.avgFeeRate = 0; - } else { + blockExtended.extras.medianFee = 0; // 50th percentiles + blockExtended.extras.feeRange = [0, 0, 0, 0, 0, 0, 0]; + blockExtended.extras.totalFees = 0; + blockExtended.extras.avgFee = 0; + blockExtended.extras.avgFeeRate = 0; + } else { const stats = await bitcoinClient.getBlockStats(block.id); blockExtended.extras.medianFee = stats.feerate_percentiles[2]; // 50th percentiles - blockExtended.extras.feeRange = [stats.minfeerate, stats.feerate_percentiles, stats.maxfeerate].flat(); - blockExtended.extras.totalFees = stats.totalfee; - blockExtended.extras.avgFee = stats.avgfee; - blockExtended.extras.avgFeeRate = stats.avgfeerate; - } + blockExtended.extras.feeRange = [stats.minfeerate, stats.feerate_percentiles, stats.maxfeerate].flat(); + blockExtended.extras.totalFees = stats.totalfee; + blockExtended.extras.avgFee = stats.avgfee; + blockExtended.extras.avgFeeRate = stats.avgfeerate; + } if (Common.indexingEnabled()) { let pool: PoolTag; @@ -239,7 +240,7 @@ class Blocks { indexedThisRun = 0; } const blockHash = await bitcoinApi.$getBlockHash(blockHeight); - const block = await bitcoinApi.$getBlock(blockHash); + const block = BitcoinApi.convertBlock(await bitcoinClient.getBlock(blockHash)); const transactions = await this.$getTransactionsExtended(blockHash, block.height, true, true); const blockExtended = await this.$getBlockExtended(block, transactions); await blocksRepository.$saveBlockInDatabase(blockExtended); @@ -276,7 +277,7 @@ class Blocks { if (blockchainInfo.blocks === blockchainInfo.headers) { const heightDiff = blockHeightTip % 2016; const blockHash = await bitcoinApi.$getBlockHash(blockHeightTip - heightDiff); - const block = await bitcoinApi.$getBlock(blockHash); + const block = BitcoinApi.convertBlock(await bitcoinClient.getBlock(blockHash)); this.lastDifficultyAdjustmentTime = block.timestamp; this.currentDifficulty = block.difficulty; @@ -300,7 +301,7 @@ class Blocks { } const blockHash = await bitcoinApi.$getBlockHash(this.currentBlockHeight); - const block = await bitcoinApi.$getBlock(blockHash); + const block = BitcoinApi.convertBlock(await bitcoinClient.getBlock(blockHash)); const txIds: string[] = await bitcoinApi.$getTxIdsForBlock(blockHash); const transactions = await this.$getTransactionsExtended(blockHash, block.height, false); const blockExtended: BlockExtended = await this.$getBlockExtended(block, transactions); @@ -332,14 +333,14 @@ class Blocks { /** * Index a block if it's missing from the database. Returns the block after indexing */ - public async $indexBlock(height: number): Promise { + public async $indexBlock(height: number): Promise { const dbBlock = await blocksRepository.$getBlockByHeight(height); if (dbBlock != null) { return this.prepareBlock(dbBlock); } const blockHash = await bitcoinApi.$getBlockHash(height); - const block = await bitcoinApi.$getBlock(blockHash); + const block = BitcoinApi.convertBlock(await bitcoinClient.getBlock(blockHash)); const transactions = await this.$getTransactionsExtended(blockHash, block.height, true); const blockExtended = await this.$getBlockExtended(block, transactions); diff --git a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html index 0e9ffb14d..63a93a3e4 100644 --- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html +++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.html @@ -5,30 +5,32 @@
Reward stats
-
-
-
-
-
Miners Reward
-
- -
in the last 8 blocks
+
+
+
+
+
+
Miners Reward
+
+ +
in the last 8 blocks
+
-
-
-
Reward Per Tx
-
- {{ rewardStats.rewardPerTx | amountShortener }} - sats/tx -
in the last 8 blocks
+
+
Reward Per Tx
+
+ {{ rewardStats.rewardPerTx | amountShortener }} + sats/tx +
in the last 8 blocks
+
-
-
-
Average Fee
-
- {{ rewardStats.feePerTx | amountShortener}} - sats/tx -
in the last 8 blocks
+
+
Average Fee
+
+ {{ rewardStats.feePerTx | amountShortener}} + sats/tx +
in the last 8 blocks
+
@@ -36,24 +38,24 @@
-
+
-
Miners Reward
-
+
Miners Reward
+
-
Reward Per Tx
-
+
Reward Per Tx
+
-
Average Fee
-
+
Average Fee
+
@@ -136,4 +138,4 @@
-
+
\ No newline at end of file diff --git a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.scss b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.scss index 148d589c6..a345be972 100644 --- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.scss +++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.scss @@ -59,50 +59,57 @@ padding-bottom: 3px; } -.fee-estimation-container { +.reward-container { display: flex; - justify-content: space-between; - @media (min-width: 376px) { - flex-direction: row; + flex-direction: row; + justify-content: space-around; + height: 76px; + .shared-block { + color: #ffffff66; + font-size: 12px; } .item { - max-width: 150px; - margin: 0; - width: -webkit-fill-available; - @media (min-width: 376px) { - margin: 0 auto 0px; - } - &:first-child{ + display: table-cell; + padding: 0 5px; + width: 100%; + &:nth-child(1) { display: none; @media (min-width: 485px) { - display: block; + display: table-cell; } @media (min-width: 768px) { display: none; } @media (min-width: 992px) { - display: block; + display: table-cell; } } - &:last-child { - margin-bottom: 0; - } - .card-text span { - color: #ffffff66; - font-size: 12px; - top: 0px; - } - .fee-text{ - border-bottom: 1px solid #ffffff1c; - width: fit-content; - margin: auto; - line-height: 1.45; - padding: 0px 2px; - } - .fiat { - display: block; - font-size: 14px !important; - } + } + .card-text { + font-size: 22px; + margin-top: -9px; + position: relative; + } + .card-text.skeleton { + margin-top: 0px; + } +} + +.more-padding { + padding: 18px; +} + +.card-wrapper { + .card { + height: auto !important; + } + .card-body { + display: flex; + flex: inherit; + text-align: center; + flex-direction: column; + justify-content: space-around; + padding: 22px 20px; } } diff --git a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts index 606bac5f1..c05c951b3 100644 --- a/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts +++ b/frontend/src/app/components/mining-dashboard/mining-dashboard.component.ts @@ -36,8 +36,8 @@ export class MiningDashboardComponent implements OnInit { return { 'totalReward': totalReward, - 'rewardPerTx': totalReward / totalTx, - 'feePerTx': totalFee / totalTx, + 'rewardPerTx': Math.round(totalReward / totalTx), + 'feePerTx': Math.round(totalFee / totalTx), } }) );