From e8f5bc8f2c0716cd20beb9315b67807157c6c9cc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Adina=20=C8=9Aeudan?= <adina.teudan.ext@knecon.com>
Date: Wed, 22 May 2024 14:37:08 +0300
Subject: [PATCH] RED-6959: Added selected items count to table header

---
 src/lib/listing/table-header/table-header.component.html | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/src/lib/listing/table-header/table-header.component.html b/src/lib/listing/table-header/table-header.component.html
index 527378c..3ca9bd8 100644
--- a/src/lib/listing/table-header/table-header.component.html
+++ b/src/lib/listing/table-header/table-header.component.html
@@ -1,15 +1,18 @@
 <div [class.selection-enabled]="selectionEnabled" class="header-item">
     <div [attr.help-mode-key]="helpModeKey" class="header-title">
         <iqser-round-checkbox
-            id="select-all-entities-toggle"
             (click)="listingService.selectAll()"
             *ngIf="selectionEnabled"
             [active]="listingService.areAllSelected$ | async"
             [indeterminate]="listingService.notAllSelected$ | async"
+            id="select-all-entities-toggle"
         ></iqser-round-checkbox>
 
         <span class="all-caps-label">
             {{ tableHeaderLabel | translate: { length: totalSize || (listingService.displayedLength$ | async) } }}
+            <span *ngIf="listingService.selectedLength$ | async as selectedItems">
+                ({{ 'table-header.selected-count' | translate: { count: selectedItems } }})
+            </span>
         </span>
     </div>
 
@@ -33,12 +36,12 @@
     <iqser-table-column-name
         *ngFor="let config of tableColumnConfigs"
         [class]="config.class"
+        [id]="config.id"
         [label]="config.notTranslatable ? config.label : (config.label | translate)"
         [leftIcon]="config.leftIcon"
         [rightIconTooltip]="config.rightIconTooltip"
         [rightIcon]="config.rightIcon"
         [sortByKey]="config.sortByKey"
-        [id]="config.id"
     ></iqser-table-column-name>
 
     <div *ngIf="hasEmptyColumn"></div>