From e77f8be7782ded9bfc9725d962bd60e0440d80a6 Mon Sep 17 00:00:00 2001
From: Michael Shamoon <4887959+shamoon@users.noreply.github.com>
Date: Wed, 8 Sep 2021 21:12:44 -0700
Subject: [PATCH] Show loading with spinner on document list reloading

---
 .../components/document-list/document-list.component.html | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src-ui/src/app/components/document-list/document-list.component.html b/src-ui/src/app/components/document-list/document-list.component.html
index 1b805bb2e..2da5f6813 100644
--- a/src-ui/src/app/components/document-list/document-list.component.html
+++ b/src-ui/src/app/components/document-list/document-list.component.html
@@ -82,8 +82,14 @@
 
 <div class="d-flex justify-content-between align-items-center">
   <p>
+    <ng-container *ngIf="list.isReloading">
+      <div class="spinner-border spinner-border-sm mr-2" role="status"></div>
+      Loading...
+    </ng-container>
     <span i18n *ngIf="list.selected.size > 0">{list.collectionSize, plural, =1 {Selected {{list.selected.size}} of one document} other {Selected {{list.selected.size}} of {{list.collectionSize || 0}} documents}}</span>
-    <span i18n *ngIf="list.selected.size == 0">{list.collectionSize, plural, =1 {One document} other {{{list.collectionSize || 0}} documents}}</span>&nbsp;<span i18n *ngIf="isFiltered">(filtered)</span>
+    <ng-container *ngIf="!list.isReloading">
+      <span i18n *ngIf="list.selected.size == 0">{list.collectionSize, plural, =1 {One document} other {{{list.collectionSize || 0}} documents}}</span>&nbsp;<span i18n *ngIf="isFiltered">(filtered)</span>
+    </ng-container>
   </p>
   <ngb-pagination [pageSize]="list.currentPageSize" [collectionSize]="list.collectionSize" [(page)]="list.currentPage" [maxSize]="5"
   [rotate]="true" aria-label="Default pagination"></ngb-pagination>