fix: make scouting filters immediate and loading state precise

frontend/src/app/app.component.html

@@ -82,27 +82,45 @@
   </section>
 
   <section class="quickbar" aria-label="Quick filters">
-    <div class="chip-group">
+    <div class="chip-group" aria-label="Position quick filter">
+      <button
+        type="button"
+        [class.active]="filters.position === ''"
+        [attr.aria-pressed]="filters.position === ''"
+        (click)="setPosition('')"
+      >
+        All positions
+      </button>
       <button
         *ngFor="let position of positions"
         type="button"
         [class.active]="filters.position === position"
-        (click)="togglePosition(position)"
+        [attr.aria-pressed]="filters.position === position"
+        (click)="setPosition(position)"
       >
         {{ position }}
       </button>
     </div>
-    <div class="chip-group league-chips">
+    <div class="chip-group league-chips" aria-label="League quick filter">
+      <button
+        type="button"
+        [class.active]="filters.league === ''"
+        [attr.aria-pressed]="filters.league === ''"
+        (click)="setLeague('')"
+      >
+        All leagues
+      </button>
       <button
         *ngFor="let league of leagues"
         type="button"
         [class.active]="filters.league === league"
-        (click)="toggleLeague(league)"
+        [attr.aria-pressed]="filters.league === league"
+        (click)="setLeague(league)"
       >
         {{ league }}
       </button>
     </div>
-    <span class="filter-count">{{ activeFiltersCount }} active</span>
+    <span class="filter-count">{{ isUpdatingResults ? 'Updating...' : activeFiltersCount + ' active' }}</span>
   </section>
 
   <p *ngIf="errorMessage" class="alert">{{ errorMessage }}</p>
@@ -151,7 +169,7 @@
         </tbody>
       </table>
       <div *ngIf="!loading && players.length === 0" class="empty">No players match the current filters.</div>
-      <div *ngIf="loading" class="empty">Loading scouting board...</div>
+      <div *ngIf="showLoadingPlaceholder" class="empty">Loading scouting board...</div>
     </div>
 
     <aside class="detail" *ngIf="selectedPlayer">