Live document counts for bulk edit

src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.html

@@ -25,7 +25,7 @@
       </div>
       <div *ngIf="selectionModel.items" class="items">
         <ng-container *ngFor="let item of selectionModel.itemsSorted | filter: filterText">
-          <app-toggleable-dropdown-button *ngIf="allowSelectNone || item.id" [item]="item" [state]="selectionModel.get(item.id)" (toggle)="selectionModel.toggle(item.id)" (exclude)="excludeClicked(item.id)" [disabled]="disabled"></app-toggleable-dropdown-button>
+          <app-toggleable-dropdown-button *ngIf="allowSelectNone || item.id" [item]="item" [state]="selectionModel.get(item.id)" [count]="getUpdatedDocumentCount(item.id)" (toggle)="selectionModel.toggle(item.id)" (exclude)="excludeClicked(item.id)" [disabled]="disabled"></app-toggleable-dropdown-button>
         </ng-container>
       </div>
       <button *ngIf="editing" class="list-group-item list-group-item-action bg-light" (click)="applyClicked()" [disabled]="!modelIsDirty || disabled">

src-ui/src/app/components/common/filterable-dropdown/filterable-dropdown.component.ts

@@ -11,6 +11,7 @@ import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap'
 import { ToggleableItemState } from './toggleable-dropdown-button/toggleable-dropdown-button.component'
 import { MatchingModel } from 'src/app/data/matching-model'
 import { Subject } from 'rxjs'
+import { SelectionDataItem } from 'src/app/services/rest/document.service'
 
 export interface ChangedItems {
   itemsToAdd: MatchingModel[]
@@ -333,6 +334,15 @@ export class FilterableDropdownComponent {
     )
   }
 
+  @Input()
+  documentCounts: SelectionDataItem[]
+
+  getUpdatedDocumentCount(id: number) {
+    if (this.documentCounts) {
+      return this.documentCounts.find((c) => c.id === id)?.document_count
+    }
+  }
+
   modelIsDirty: boolean = false
 
   constructor(private filterPipe: FilterPipe) {

src-ui/src/app/components/common/filterable-dropdown/toggleable-dropdown-button/toggleable-dropdown-button.component.html

@@ -20,5 +20,5 @@
     <app-tag *ngIf="isTag; else displayName" [tag]="item" [clickable]="false"></app-tag>
     <ng-template #displayName><small>{{item.name}}</small></ng-template>
   </div>
-  <div class="badge badge-light rounded-pill ms-auto me-1">{{item.document_count}}</div>
+  <div class="badge badge-light rounded-pill ms-auto me-1">{{count ?? item.document_count}}</div>
 </button>

src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.html

@@ -34,6 +34,7 @@
         [applyOnClose]="applyOnClose"
         (opened)="openTagsDropdown()"
         [(selectionModel)]="tagSelectionModel"
+        [documentCounts]="tagDocumentCounts"
         (apply)="setTags($event)">
       </app-filterable-dropdown>
       <app-filterable-dropdown class="me-2 me-md-3" title="Correspondent" icon="person-fill" i18n-title
@@ -44,6 +45,7 @@
         [applyOnClose]="applyOnClose"
         (opened)="openCorrespondentDropdown()"
         [(selectionModel)]="correspondentSelectionModel"
+        [documentCounts]="correspondentDocumentCounts"
         (apply)="setCorrespondents($event)">
       </app-filterable-dropdown>
       <app-filterable-dropdown class="me-2 me-md-3" title="Document type" icon="file-earmark-fill" i18n-title
@@ -54,6 +56,7 @@
         [applyOnClose]="applyOnClose"
         (opened)="openDocumentTypeDropdown()"
         [(selectionModel)]="documentTypeSelectionModel"
+        [documentCounts]="documentTypeDocumentCounts"
         (apply)="setDocumentTypes($event)">
       </app-filterable-dropdown>
       <app-filterable-dropdown class="me-2 me-md-3" title="Storage path" icon="folder-fill" i18n-title
@@ -64,6 +67,7 @@
         [applyOnClose]="applyOnClose"
         (opened)="openStoragePathDropdown()"
         [(selectionModel)]="storagePathsSelectionModel"
+        [documentCounts]="storagePathDocumentCounts"
         (apply)="setStoragePaths($event)">
       </app-filterable-dropdown>
     </div>

src-ui/src/app/components/document-list/bulk-editor/bulk-editor.component.ts

@@ -49,6 +49,10 @@ export class BulkEditorComponent
   correspondentSelectionModel = new FilterableDropdownSelectionModel()
   documentTypeSelectionModel = new FilterableDropdownSelectionModel()
   storagePathsSelectionModel = new FilterableDropdownSelectionModel()
+  tagDocumentCounts: SelectionDataItem[]
+  correspondentDocumentCounts: SelectionDataItem[]
+  documentTypeDocumentCounts: SelectionDataItem[]
+  storagePathDocumentCounts: SelectionDataItem[]
   awaitingDownload: boolean
 
   unsubscribeNotifier: Subject<any> = new Subject()
@@ -197,6 +201,7 @@ export class BulkEditorComponent
       .getSelectionData(Array.from(this.list.selected))
       .pipe(first())
       .subscribe((s) => {
+        this.tagDocumentCounts = s.selected_tags
         this.applySelectionData(s.selected_tags, this.tagSelectionModel)
       })
   }
@@ -206,6 +211,7 @@ export class BulkEditorComponent
       .getSelectionData(Array.from(this.list.selected))
       .pipe(first())
       .subscribe((s) => {
+        this.documentTypeDocumentCounts = s.selected_document_types
         this.applySelectionData(
           s.selected_document_types,
           this.documentTypeSelectionModel
@@ -218,6 +224,7 @@ export class BulkEditorComponent
       .getSelectionData(Array.from(this.list.selected))
       .pipe(first())
       .subscribe((s) => {
+        this.correspondentDocumentCounts = s.selected_correspondents
         this.applySelectionData(
           s.selected_correspondents,
           this.correspondentSelectionModel
@@ -230,6 +237,7 @@ export class BulkEditorComponent
       .getSelectionData(Array.from(this.list.selected))
       .pipe(first())
       .subscribe((s) => {
+        this.storagePathDocumentCounts = s.selected_storage_paths
         this.applySelectionData(
           s.selected_storage_paths,
           this.storagePathsSelectionModel