Fix: use the header loading indicator on tasks page (#13949)

src-ui/src/app/components/admin/tasks/tasks.component.html

@@ -3,6 +3,7 @@
   i18n-title
   info="Tasks shows detailed information about document consumption and system tasks."
   i18n-info
+  [loading]="loading() && pagedTasks().length === 0"
   >
   <div class="btn-toolbar col col-md-auto align-items-center gap-2">
     <button class="btn btn-sm btn-outline-secondary me-2" (click)="clearSelection()" [hidden]="selectedTasks.size === 0">
@@ -21,11 +22,6 @@
   </div>
 </pngx-page-header>
 
-@if (loading() && pagedTasks().length === 0) {
-  <div class="spinner-border spinner-border-sm fw-normal ms-2 me-auto" role="status"></div>
-  <div class="visually-hidden" i18n>Loading...</div>
-}
-
 <div class="task-controls mb-3 gap-3 btn-toolbar align-items-center" role="toolbar">
   <div class="task-view-scope btn-group btn-group-sm" role="group">
     <input
@@ -285,6 +281,6 @@
       <ng-container [ngTemplateOutlet]="tasksTemplate" [ngTemplateOutletContext]="{tasks: tasksForSection(section), section: section}"></ng-container>
     </div>
   }
-} @else {
+} @else if (!loading() || pagedTasks().length > 0) {
   <div class="alert alert-secondary fst-italic" i18n>No tasks match the current filters.</div>
 }