diff --git a/frontend/src/app/components/pool/pool.component.html b/frontend/src/app/components/pool/pool.component.html
index 66b3db5e3..7be7c220c 100644
--- a/frontend/src/app/components/pool/pool.component.html
+++ b/frontend/src/app/components/pool/pool.component.html
@@ -1,7 +1,7 @@
-
-
+
+
{{ poolStats.pool.name }}
@@ -54,27 +54,27 @@
-
Height |
Timestamp |
Mined |
- Reward |
- Transactions |
+ Reward |
+ Transactions |
Size |
-
+
{{ block.height }} |
{{ block.timestamp * 1000 | date:'yyyy-MM-dd HH:mm' }} |
|
-
+ |
|
- {{ block.tx_count | number }} |
+ {{ block.tx_count | number }} |
|
-
\ No newline at end of file
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Addresses |
+
+
+ |
+
+ ~ |
+
+
+
+ Coinbase Tags |
+ |
+
+
+
+
+
+
+
+
+ Mined Blocks |
+ |
+
+
+ Empty Blocks |
+ |
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/frontend/src/app/components/pool/pool.component.scss b/frontend/src/app/components/pool/pool.component.scss
index 65f16b6b8..b7c496995 100644
--- a/frontend/src/app/components/pool/pool.component.scss
+++ b/frontend/src/app/components/pool/pool.component.scss
@@ -37,4 +37,15 @@ div.scrollable {
padding: 0;
overflow: auto;
max-height: 100px;
+}
+
+.skeleton-loader {
+ width: 100%;
+ max-width: 90px;
+ margin: 15px auto 3px;
+}
+
+.table {
+ margin: 0px auto;
+ max-width: 900px;
}
\ No newline at end of file
diff --git a/frontend/src/app/components/pool/pool.component.ts b/frontend/src/app/components/pool/pool.component.ts
index 282febf2f..0e0e116dd 100644
--- a/frontend/src/app/components/pool/pool.component.ts
+++ b/frontend/src/app/components/pool/pool.component.ts
@@ -13,6 +13,14 @@ import { formatNumber } from '@angular/common';
selector: 'app-pool',
templateUrl: './pool.component.html',
styleUrls: ['./pool.component.scss'],
+ styles: [`
+ .loadingGraphs {
+ position: absolute;
+ top: 50%;
+ left: calc(50% - 15px);
+ z-index: 100;
+ }
+ `],
changeDetection: ChangeDetectionStrategy.OnPush
})
export class PoolComponent implements OnInit {
@@ -48,6 +56,7 @@ export class PoolComponent implements OnInit {
this.poolStats$ = this.route.params.pipe(map((params) => params.poolId))
.pipe(
switchMap((poolId: any) => {
+ this.isLoading = true;
this.poolId = poolId;
return this.apiService.getPoolHashrate$(this.poolId)
.pipe(