From 87ee14f189eba9811ff16d7028ba9f9ac8f956eb Mon Sep 17 00:00:00 2001
From: natsoni <natsoni@protonmail.com>
Date: Wed, 26 Jun 2024 16:12:21 +0900
Subject: [PATCH] Show loading indicator on toggle in RBF list

---
 frontend/src/app/components/rbf-list/rbf-list.component.html | 2 +-
 frontend/src/app/components/rbf-list/rbf-list.component.ts   | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/frontend/src/app/components/rbf-list/rbf-list.component.html b/frontend/src/app/components/rbf-list/rbf-list.component.html
index 133cdfe33..a3baa8537 100644
--- a/frontend/src/app/components/rbf-list/rbf-list.component.html
+++ b/frontend/src/app/components/rbf-list/rbf-list.component.html
@@ -15,7 +15,7 @@
 
   <div class="clearfix"></div>
 
-  <div class="rbf-trees" style="min-height: 295px">
+  <div class="rbf-trees" [ngStyle]="{ 'min-height': '295px', 'opacity': isLoading ? '0.75' : '1' }">
     <ng-container *ngIf="rbfTrees$ | async as trees">
       <div *ngFor="let tree of trees" class="tree">
         <p class="info">
diff --git a/frontend/src/app/components/rbf-list/rbf-list.component.ts b/frontend/src/app/components/rbf-list/rbf-list.component.ts
index ff30dd1c9..25f7dea2e 100644
--- a/frontend/src/app/components/rbf-list/rbf-list.component.ts
+++ b/frontend/src/app/components/rbf-list/rbf-list.component.ts
@@ -38,6 +38,7 @@ export class RbfList implements OnInit, OnDestroy {
       this.fullRbf = (fragment === 'fullrbf');
       this.websocketService.startTrackRbf(this.fullRbf ? 'fullRbf' : 'all');
       this.nextRbfSubject.next(null);
+      this.isLoading = true;
     });
 
     this.rbfTrees$ = merge(