[ACS-9249] Add number of files to Folder Information (#4626)

* [ACS-9249] Add number of files to Folder Information

* [ACS-9249] cr fix

* [ACS-9249] fix e2e's

e2e/playwright/folder-information-actions/src/tests/folder-information.e2e.ts

@@ -126,6 +126,7 @@ test.describe('Actions - Folder Information', () => {
   async function checkFolderInformation(
     page: PersonalFilesPage | MyLibrariesPage | SearchPage,
     folderName: string,
+    expectedNumber: string,
     expectedSize: string,
     location: string,
     isEmptyFolder?: 'isEmpty'
@@ -134,6 +135,7 @@ test.describe('Actions - Folder Information', () => {
     await page.acaHeader.clickMoreActions();
     await page.matMenu.clickMenuItem('Folder Information');
     await expect(async () => {
+      expect(await page.folderInformationDialog.folderNumberOfFiles.textContent()).toContain(expectedNumber);
       expect(await page.folderInformationDialog.folderSize.textContent()).toContain(expectedSize);
     }).toPass({
       intervals: [1_000],
@@ -151,34 +153,46 @@ test.describe('Actions - Folder Information', () => {
 
   test('[XAT-17722] Folder information Empty folder size and number of documents as 0', async ({ personalFiles }) => {
     await personalFiles.navigate();
-    await checkFolderInformation(personalFiles, emptyFolder, '0 bytes for 0 files', `/Company Home/User Homes/${username}`, 'isEmpty');
+    await checkFolderInformation(personalFiles, emptyFolder, '0', '0 bytes', `/Company Home/User Homes/${username}`, 'isEmpty');
   });
 
   test('[XAT-17715] Folder information correct folder size and number of documents - single file', async ({ personalFiles }) => {
     await personalFiles.navigate();
-    await checkFolderInformation(personalFiles, folder1File, 'for 1 files', `/Company Home/User Homes/${username}`);
+    await checkFolderInformation(personalFiles, folder1File, '1', '13,877 bytes (13.88 KB on disk)', `/Company Home/User Homes/${username}`);
   });
 
   test('[XAT-17752] Folder information correct folder size and number of documents - multiple files', async ({ personalFiles }) => {
     await personalFiles.navigate();
-    await checkFolderInformation(personalFiles, folderXFiles, 'for 3 files', `/Company Home/User Homes/${username}`);
+    await checkFolderInformation(personalFiles, folderXFiles, '3', '41,631 bytes (41.63 KB on disk)', `/Company Home/User Homes/${username}`);
   });
 
   test('[XAT-17753] Folder information correct folder size and number of documents - folder and files', async ({ personalFiles }) => {
     await personalFiles.navigate();
-    await checkFolderInformation(personalFiles, folderXFilesAndFolders, 'for 5 files', `/Company Home/User Homes/${username}`);
+    await checkFolderInformation(
+      personalFiles,
+      folderXFilesAndFolders,
+      '5',
+      '69,385 bytes (69.39 KB on disk)',
+      `/Company Home/User Homes/${username}`
+    );
   });
 
   test('[XAT-17758] Folder information correct folder size and number of documents - from libraries', async ({ myLibrariesPage }) => {
     await myLibrariesPage.navigate();
     await myLibrariesPage.dataTable.getRowByName(libraryForFolder).dblclick();
-    await checkFolderInformation(myLibrariesPage, folderInLibrary, 'for 1 files', `/Company Home/Sites/${libraryForFolder}/documentLibrary`);
+    await checkFolderInformation(
+      myLibrariesPage,
+      folderInLibrary,
+      '1',
+      '13,877 bytes (13.88 KB on disk)',
+      `/Company Home/Sites/${libraryForFolder}/documentLibrary`
+    );
   });
 
   test('[XAT-17759] Folder information correct folder size and number of documents - from search', async ({ personalFiles, searchPage }) => {
     await personalFiles.navigate();
     await searchPage.searchWithin(folderForSearch, 'folders');
-    await checkFolderInformation(searchPage, folderForSearch, 'for 2 files', `/Company Home/User Homes/${username}`);
+    await checkFolderInformation(searchPage, folderForSearch, '2', '27,754 bytes (27.75 KB on disk)', `/Company Home/User Homes/${username}`);
   });
 
   test('[XAT-17766] Folder information correct folder size and number of documents - nested folders', async ({ personalFiles }) => {
@@ -188,7 +202,8 @@ test.describe('Actions - Folder Information', () => {
     await checkFolderInformation(
       personalFiles,
       folderNested3,
-      'for 1 files',
+      '1',
+      '13,877 bytes (13.88 KB on disk)',
       `/Company Home/User Homes/${username}/${folderNested1}/${folderNested2}`
     );
   });

projects/aca-content/assets/i18n/en.json

@@ -467,9 +467,10 @@
           "ICON": "Folder Icon",
           "TITLE": "Folder Information",
           "SIZE" : "Size",
+          "NUMBER_OF_FILES": "Number of files",
           "CALCULATING": "Calculating...",
-          "CALCULATED_SIZE_LARGE": "{{sizeInBytes}} bytes ({{sizeInLargeUnit}} {{unit}} on disk) for {{count}} files",
+          "CALCULATED_SIZE_LARGE": "{{sizeInBytes}} bytes ({{sizeInLargeUnit}} {{unit}} on disk)",
-          "CALCULATED_SIZE_NORMAL": "{{sizeInBytes}} bytes for {{count}} files",
+          "CALCULATED_SIZE_NORMAL": "{{sizeInBytes}} bytes",
           "LOCATION": "Location",
           "CREATED": "Created",
           "MODIFIED": "Modified",

projects/aca-content/src/lib/dialogs/folder-details/folder-information.component.html

@@ -4,6 +4,12 @@
 </div>
 <mat-divider/>
 <div class="aca-folder-info-body">
+  <div class="aca-folder-info-item">
+    <div class="aca-folder-info-item-label">{{ 'APP.FOLDER_INFO.NUMBER_OF_FILES' | translate }}</div>
+    <div class="aca-folder-info-item-value"
+         data-automation-id="folder-info-number-of-files">{{ folderDetails.numberOfFiles }}</div>
+  </div>
+  <mat-divider/>
   <div class="aca-folder-info-item">
     <div class="aca-folder-info-item-label">{{ 'APP.FOLDER_INFO.SIZE' | translate }}</div>
     <div class="aca-folder-info-item-value"

projects/aca-content/src/lib/dialogs/folder-details/folder-information.component.spec.ts

@@ -37,6 +37,8 @@ describe('FolderInformationComponent', () => {
   let initiateFolderSizeCalculationSpy: jasmine.Spy<(nodeId: string) => Observable<JobIdBodyEntry>>;
   let getFolderSizeInfoSpy: jasmine.Spy<(nodeId: string, jobId: string) => Observable<SizeDetailsEntry>>;
 
+  const getNumberOfFiles = (): string => unitTestingUtils.getInnerTextByDataAutomationId('folder-info-number-of-files');
+
   const mockSub = new Subject<JobIdBodyEntry>();
   const dialogData = {
     name: 'mock-folder',
@@ -77,6 +79,7 @@ describe('FolderInformationComponent', () => {
   it('should render all information in init', () => {
     fixture.detectChanges();
     expect(unitTestingUtils.getInnerTextByDataAutomationId('folder-info-name')).toBe('mock-folder');
+    expect(getNumberOfFiles()).toBe('APP.FOLDER_INFO.CALCULATING');
     expect(unitTestingUtils.getInnerTextByDataAutomationId('folder-info-size')).toBe('APP.FOLDER_INFO.CALCULATING');
     expect(unitTestingUtils.getInnerTextByDataAutomationId('folder-info-location')).toBe('mock-folder-path');
     expect(unitTestingUtils.getInnerTextByDataAutomationId('folder-info-creation-date')).toBe('01/02/2024 11:11');
@@ -115,6 +118,7 @@ describe('FolderInformationComponent', () => {
     expect(getFolderSizeInfoSpy).toHaveBeenCalledTimes(4);
     tick(5000);
     expect(getFolderSizeInfoSpy).not.toHaveBeenCalledTimes(5);
+    expect(fixture.componentInstance.folderDetails.numberOfFiles).toBe(1);
   }));
 
   it('should not make new API request, and display error message if response returned from API is neither COMPLETE, nor IN_PROGRESS', fakeAsync(() => {
@@ -125,6 +129,8 @@ describe('FolderInformationComponent', () => {
     tick(1000);
     fixture.detectChanges();
     expect(getFolderSizeInfoSpy).toHaveBeenCalledTimes(1);
+    fixture.detectChanges();
+    expect(getNumberOfFiles()).toBe('APP.FOLDER_INFO.ERROR');
     expect(unitTestingUtils.getInnerTextByDataAutomationId('folder-info-size')).toBe('APP.FOLDER_INFO.ERROR');
     tick(5000);
     expect(getFolderSizeInfoSpy).not.toHaveBeenCalledTimes(2);

projects/aca-content/src/lib/dialogs/folder-details/folder-information.component.ts

@@ -42,6 +42,7 @@ class FolderDetails {
   created: Date;
   modified: Date;
   icon: string;
+  numberOfFiles: string | number;
 }
 
 @Component({
@@ -70,6 +71,7 @@ export class FolderInformationComponent implements OnInit {
     this.folderDetails.modified = this.data.modifiedAt;
     this.folderDetails.icon = this.contentService.getNodeIcon(this.data);
     this.folderDetails.size = this.translateService.instant('APP.FOLDER_INFO.CALCULATING');
+    this.folderDetails.numberOfFiles = this.translateService.instant('APP.FOLDER_INFO.CALCULATING');
 
     this.nodesService
       .initiateFolderSizeCalculation(this.data.id)
@@ -91,6 +93,7 @@ export class FolderInformationComponent implements OnInit {
         }),
         takeUntilDestroyed(this.destroyRef),
         catchError(() => {
+          this.folderDetails.numberOfFiles = this.translateService.instant('APP.FOLDER_INFO.ERROR');
           this.folderDetails.size = this.translateService.instant('APP.FOLDER_INFO.ERROR');
           return of(null);
         })
@@ -108,15 +111,16 @@ export class FolderInformationComponent implements OnInit {
           const params = {
             sizeInBytes: parseFloat(folderInfo.entry.sizeInBytes).toLocaleString('en'),
             sizeInLargeUnit: size.toFixed(2),
-            unit: MEMORY_UNIT_LIST[unitIndex],
+            unit: MEMORY_UNIT_LIST[unitIndex]
-            count: folderInfo.entry.numberOfFiles
           };
           this.folderDetails.size = this.translateService.instant(
             isMoreThanBytes ? 'APP.FOLDER_INFO.CALCULATED_SIZE_LARGE' : 'APP.FOLDER_INFO.CALCULATED_SIZE_NORMAL',
             params
           );
+          this.folderDetails.numberOfFiles = folderInfo.entry.numberOfFiles;
         } else if (folderInfo?.entry?.status !== SizeDetails.StatusEnum.IN_PROGRESS) {
           this.folderDetails.size = this.translateService.instant('APP.FOLDER_INFO.ERROR');
+          this.folderDetails.numberOfFiles = this.translateService.instant('APP.FOLDER_INFO.ERROR');
         }
       });
   }

projects/aca-playwright-shared/src/page-objects/components/dialogs/folder-information-dialog.component.ts

@@ -34,6 +34,7 @@ export class FolderInformationDialogComponent extends BaseComponent {
 
   folderName = this.getChild('.aca-folder-info-header');
   doneButton = this.getChild('[data-automation-id="adf-dialog-actions-confirm"]');
+  folderNumberOfFiles = this.getChild('[data-automation-id="folder-info-number-of-files"]');
   folderSize = this.getChild('[data-automation-id="folder-info-size"]');
   folderLocation = this.getChild('[data-automation-id="folder-info-location"]');
   folderCreationDate = this.getChild('[data-automation-id="folder-info-creation-date"]');