From a57c7ac8bb614d0691b8558538791ec43cb41590 Mon Sep 17 00:00:00 2001
From: rodribp <rodrigobonilla177@gmail.com>
Date: Mon, 15 Jun 2026 01:19:21 -0600
Subject: [PATCH 1/2] fix: remove and hide loading indicators from unnecesary
 components

---
 .../acceleration-fees-graph.component.html                  | 1 -
 .../components/address-graph/address-graph.component.html   | 1 -
 .../block-fee-rates-graph.component.html                    | 2 +-
 .../block-fees-graph/block-fees-graph.component.html        | 2 +-
 .../block-fees-subsidy-graph.component.html                 | 2 +-
 .../block-health-graph/block-health-graph.component.html    | 2 +-
 .../block-rewards-graph/block-rewards-graph.component.html  | 2 +-
 .../block-sizes-weights-graph.component.html                | 2 ++
 .../app/components/blocks-list/blocks-list.component.html   | 2 +-
 .../indexing-progress/indexing-progress.component.html      | 6 +++---
 .../indexing-progress/indexing-progress.component.ts        | 6 +++++-
 .../app/components/pool-ranking/pool-ranking.component.html | 2 +-
 frontend/src/app/components/pool/pool.component.html        | 2 +-
 .../app/components/price-chart/price-chart.component.html   | 1 -
 .../treasuries-graph/treasuries-graph.component.html        | 1 -
 .../src/app/components/utxo-graph/utxo-graph.component.html | 1 -
 16 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/frontend/src/app/components/acceleration/acceleration-fees-graph/acceleration-fees-graph.component.html b/frontend/src/app/components/acceleration/acceleration-fees-graph/acceleration-fees-graph.component.html
index 0e56ce992..e2d2b05d0 100644
--- a/frontend/src/app/components/acceleration/acceleration-fees-graph/acceleration-fees-graph.component.html
+++ b/frontend/src/app/components/acceleration/acceleration-fees-graph/acceleration-fees-graph.component.html
@@ -1,4 +1,3 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
 
 <div [class.full-container]="!widget">
   <div *ngIf="!widget" class="card-header mb-0 mb-md-4">
diff --git a/frontend/src/app/components/address-graph/address-graph.component.html b/frontend/src/app/components/address-graph/address-graph.component.html
index c9dd072c8..752db18ad 100644
--- a/frontend/src/app/components/address-graph/address-graph.component.html
+++ b/frontend/src/app/components/address-graph/address-graph.component.html
@@ -1,4 +1,3 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
 
 <div [class.full-container]="!widget">
   <ng-container *ngIf="!error">
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 76da8ce0d..5a232bbcb 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
@@ -1,4 +1,4 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
+<app-indexing-progress *ngIf="!widget" [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
 
 <div [class.full-container]="!widget">
   <div *ngIf="!widget" class="card-header mb-0 mb-md-4">
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 ff9629202..87cbbfe5c 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
@@ -1,4 +1,4 @@
-<app-indexing-progress></app-indexing-progress>
+<app-indexing-progress [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
 
 <div class="full-container">
   <div class="card-header mb-0 mb-md-4">
diff --git a/frontend/src/app/components/block-fees-subsidy-graph/block-fees-subsidy-graph.component.html b/frontend/src/app/components/block-fees-subsidy-graph/block-fees-subsidy-graph.component.html
index de242706c..e13bdc7ad 100644
--- a/frontend/src/app/components/block-fees-subsidy-graph/block-fees-subsidy-graph.component.html
+++ b/frontend/src/app/components/block-fees-subsidy-graph/block-fees-subsidy-graph.component.html
@@ -1,4 +1,4 @@
-<app-indexing-progress></app-indexing-progress>
+<app-indexing-progress [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
 
 <div class="full-container">
   <div class="card-header mb-0 mb-md-4">
diff --git a/frontend/src/app/components/block-health-graph/block-health-graph.component.html b/frontend/src/app/components/block-health-graph/block-health-graph.component.html
index aa9771d68..ae437a3b0 100644
--- a/frontend/src/app/components/block-health-graph/block-health-graph.component.html
+++ b/frontend/src/app/components/block-health-graph/block-health-graph.component.html
@@ -1,4 +1,4 @@
-<app-indexing-progress></app-indexing-progress>
+<app-indexing-progress [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
 
 <div class="full-container">
   <div class="card-header mb-0 mb-md-4">
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 7dcd90256..149ec4660 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
@@ -1,4 +1,4 @@
-<app-indexing-progress></app-indexing-progress>
+<app-indexing-progress [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
 
 <div class="full-container">
 
diff --git a/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.html b/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.html
index e036d8552..550877615 100644
--- a/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.html
+++ b/frontend/src/app/components/block-sizes-weights-graph/block-sizes-weights-graph.component.html
@@ -1,3 +1,5 @@
+<app-indexing-progress [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
+
 <div class="full-container">
 
   <div class="card-header mb-0 mb-md-4">
diff --git a/frontend/src/app/components/blocks-list/blocks-list.component.html b/frontend/src/app/components/blocks-list/blocks-list.component.html
index 737e636c0..0583f03f9 100644
--- a/frontend/src/app/components/blocks-list/blocks-list.component.html
+++ b/frontend/src/app/components/blocks-list/blocks-list.component.html
@@ -1,4 +1,4 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
+<app-indexing-progress *ngIf="!widget" [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
 
 <div class="container-xl" style="min-height: 335px" [ngClass]="{'widget': widget, 'full-height': !widget, 'legacy': !isMempoolModule}">
   <div *ngIf="!widget" class="float-start" style="display: flex; width: 100%; align-items: center;">
diff --git a/frontend/src/app/components/indexing-progress/indexing-progress.component.html b/frontend/src/app/components/indexing-progress/indexing-progress.component.html
index 783566744..9625f5314 100644
--- a/frontend/src/app/components/indexing-progress/indexing-progress.component.html
+++ b/frontend/src/app/components/indexing-progress/indexing-progress.component.html
@@ -1,3 +1,3 @@
-<app-loading-indicator [name]="'block-indexing'" i18n-label label="Indexing blocks"></app-loading-indicator>
-<app-loading-indicator [name]="'daily-hashrate-indexing'" i18n-label label="Indexing network hashrate"></app-loading-indicator>
-<app-loading-indicator [name]="'weekly-hashrate-indexing'" i18n-label label="Indexing pools hashrate"></app-loading-indicator>
+<app-loading-indicator *ngIf="showBlocks" [name]="'block-indexing'" i18n-label label="Indexing blocks"></app-loading-indicator>
+<app-loading-indicator *ngIf="showNetworkHashrate" [name]="'daily-hashrate-indexing'" i18n-label label="Indexing network hashrate"></app-loading-indicator>
+<app-loading-indicator *ngIf="showPoolsHashrate" [name]="'weekly-hashrate-indexing'" i18n-label label="Indexing pools hashrate"></app-loading-indicator>
diff --git a/frontend/src/app/components/indexing-progress/indexing-progress.component.ts b/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
index c81f7544b..becf12531 100644
--- a/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
+++ b/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
@@ -1,4 +1,4 @@
-import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
 
 @Component({
   selector: 'app-indexing-progress',
@@ -7,6 +7,10 @@ import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
   standalone: false,
 })
 export class IndexingProgressComponent implements OnInit {
+  @Input() showBlocks: boolean = true;
+  @Input() showNetworkHashrate: boolean = true;
+  @Input() showPoolsHashrate: boolean = true;
+
   constructor(
   ) {}
 
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 69682b560..33e120e79 100644
--- a/frontend/src/app/components/pool-ranking/pool-ranking.component.html
+++ b/frontend/src/app/components/pool-ranking/pool-ranking.component.html
@@ -1,4 +1,4 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
+<app-indexing-progress *ngIf="!widget" [showNetworkHashrate]="false" [showPoolsHashrate]="false"></app-indexing-progress>
 
 <div [class]="widget === false ? 'full-container' : ''">
 
diff --git a/frontend/src/app/components/pool/pool.component.html b/frontend/src/app/components/pool/pool.component.html
index 7135e5a21..55a6fc75a 100644
--- a/frontend/src/app/components/pool/pool.component.html
+++ b/frontend/src/app/components/pool/pool.component.html
@@ -1,4 +1,4 @@
-<app-indexing-progress></app-indexing-progress>
+<app-indexing-progress [showNetworkHashrate]="false"></app-indexing-progress>
 
 <div class="container-xl" *ngIf="!error; else errorTemplate">
 
diff --git a/frontend/src/app/components/price-chart/price-chart.component.html b/frontend/src/app/components/price-chart/price-chart.component.html
index 488e0c40b..be2cef7bc 100644
--- a/frontend/src/app/components/price-chart/price-chart.component.html
+++ b/frontend/src/app/components/price-chart/price-chart.component.html
@@ -1,4 +1,3 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
 
 <div [class]="widget === false ? 'full-container' : ''">
 
diff --git a/frontend/src/app/components/treasuries/treasuries-graph/treasuries-graph.component.html b/frontend/src/app/components/treasuries/treasuries-graph/treasuries-graph.component.html
index c9dd072c8..752db18ad 100644
--- a/frontend/src/app/components/treasuries/treasuries-graph/treasuries-graph.component.html
+++ b/frontend/src/app/components/treasuries/treasuries-graph/treasuries-graph.component.html
@@ -1,4 +1,3 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
 
 <div [class.full-container]="!widget">
   <ng-container *ngIf="!error">
diff --git a/frontend/src/app/components/utxo-graph/utxo-graph.component.html b/frontend/src/app/components/utxo-graph/utxo-graph.component.html
index 462e4328e..e8436245d 100644
--- a/frontend/src/app/components/utxo-graph/utxo-graph.component.html
+++ b/frontend/src/app/components/utxo-graph/utxo-graph.component.html
@@ -1,4 +1,3 @@
-<app-indexing-progress *ngIf="!widget"></app-indexing-progress>
 
 <div [class.full-container]="!widget">
   <ng-container *ngIf="!error">

From 72271d397d13ecb57807646f3e993f7f1931a29f Mon Sep 17 00:00:00 2001
From: rodribp <rodrigobonilla177@gmail.com>
Date: Mon, 3 Aug 2026 14:28:15 -0600
Subject: [PATCH 2/2] fix: stacked loading indicators

---
 .../indexing-progress.component.scss}                 | 11 +++++++++--
 .../indexing-progress/indexing-progress.component.ts  |  1 +
 .../loading-indicator.component.html                  |  2 +-
 .../loading-indicator/loading-indicator.component.ts  |  1 -
 4 files changed, 11 insertions(+), 4 deletions(-)
 rename frontend/src/app/components/{loading-indicator/loading-indicator.component.scss => indexing-progress/indexing-progress.component.scss} (75%)

diff --git a/frontend/src/app/components/loading-indicator/loading-indicator.component.scss b/frontend/src/app/components/indexing-progress/indexing-progress.component.scss
similarity index 75%
rename from frontend/src/app/components/loading-indicator/loading-indicator.component.scss
rename to frontend/src/app/components/indexing-progress/indexing-progress.component.scss
index af84083b7..b0f7fb9de 100644
--- a/frontend/src/app/components/loading-indicator/loading-indicator.component.scss
+++ b/frontend/src/app/components/indexing-progress/indexing-progress.component.scss
@@ -1,16 +1,23 @@
-.sticky-loading {
-  position: absolute;
+:host {
+  position: fixed;
   right: 10px;
   z-index: 1000;
   font-size: 14px;
+
+  display: flex;
+  flex-wrap: wrap;
+  gap: 4px;
+
   @media (width >= 992px) {
     left: 32px;
     top: 55px;
   }
+
   @media (576px <= width < 992px ) {
     left: 18px;
     top: 55px;
   }
+
   @media (width <= 575px) {
     left: 18px;
     top: 100px;
diff --git a/frontend/src/app/components/indexing-progress/indexing-progress.component.ts b/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
index becf12531..3aecb8204 100644
--- a/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
+++ b/frontend/src/app/components/indexing-progress/indexing-progress.component.ts
@@ -3,6 +3,7 @@ import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core
 @Component({
   selector: 'app-indexing-progress',
   templateUrl: './indexing-progress.component.html',
+  styleUrl: 'indexing-progress.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
   standalone: false,
 })
diff --git a/frontend/src/app/components/loading-indicator/loading-indicator.component.html b/frontend/src/app/components/loading-indicator/loading-indicator.component.html
index 378321701..4ebc7e140 100644
--- a/frontend/src/app/components/loading-indicator/loading-indicator.component.html
+++ b/frontend/src/app/components/loading-indicator/loading-indicator.component.html
@@ -1,3 +1,3 @@
-<div *ngIf="this.indexingProgress$ | async as progress" class="sticky-loading">
+<div *ngIf="this.indexingProgress$ | async as progress">
   <span *ngIf="progress >= 0" class="me-auto badge rounded-pill bg-warning">{{ this.label }} ({{ progress }}%)</span>
 </div>
\ No newline at end of file
diff --git a/frontend/src/app/components/loading-indicator/loading-indicator.component.ts b/frontend/src/app/components/loading-indicator/loading-indicator.component.ts
index 58ebf0a34..cf450ec90 100644
--- a/frontend/src/app/components/loading-indicator/loading-indicator.component.ts
+++ b/frontend/src/app/components/loading-indicator/loading-indicator.component.ts
@@ -7,7 +7,6 @@ import { WebsocketService } from '@app/services/websocket.service';
 @Component({
   selector: 'app-loading-indicator',
   templateUrl: './loading-indicator.component.html',
-  styleUrls: ['./loading-indicator.component.scss'],
   standalone: false,
   changeDetection: ChangeDetectionStrategy.OnPush
 })