Merge pull request #196 from porscheinformatik/bugfix/dataTableDispla…

…yedData fix data table display data
porscheinformatik · Jun 4, 2024 · a96b57d · a96b57d
2 parents c9b5290 + a5dea87
commit a96b57d
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 7 deletions.
diff --git a/projects/material-addons/src/lib/data-table/data-table.component.html b/projects/material-addons/src/lib/data-table/data-table.component.html
@@ -74,7 +74,7 @@
 
 <!-- Table -->
 <div
-  *ngIf="filterMode === 'COLUMN_BASED' || showEmptyTable || !!filteredPageData?.length; else noData"
+  *ngIf="filterMode === 'COLUMN_BASED' || showEmptyTable || !!dataSource.filteredData?.length; else noData"
   class="datatable"
   [class]="tableClass"
 >

diff --git a/projects/material-addons/src/lib/data-table/data-table.component.spec.ts b/projects/material-addons/src/lib/data-table/data-table.component.spec.ts
@@ -499,10 +499,11 @@ describe('DataTableComponent', () => {
         { rowId: 3, id: 3, name: 'Moose' },
       ];
       component.dataSource = new MatTableDataSource(initialData);
+      component.dataSource.sort = new MatSort();
       component.allSelected = false;
       const clearSpy = jest.spyOn(component['_selectionModel'], 'clear');
       const selectSpy = jest.spyOn(component['_selectionModel'], 'select');
-      const getAllDataSourceRowsOfCurrentPageSpy = jest.spyOn(component, 'filteredPageData', 'get');
+      const getAllDataSourceRowsOfCurrentPageSpy = jest.spyOn(component, 'displayedData', 'get');
       component.onToggleSelectAll();
 
       expect(clearSpy).toHaveBeenCalled();
@@ -522,10 +523,11 @@ describe('DataTableComponent', () => {
         { rowId: 3, name: 'Moose' },
       ];
       component.dataSource = new MatTableDataSource(initialData);
+      component.dataSource.sort = new MatSort();
       component.allSelected = true;
       const clearSpy = jest.spyOn(component['_selectionModel'], 'clear');
       const selectSpy = jest.spyOn(component['_selectionModel'], 'select');
-      const getAllDataSourceRowsOfCurrentPageSpy = jest.spyOn(component, 'filteredPageData', 'get');
+      const getAllDataSourceRowsOfCurrentPageSpy = jest.spyOn(component, 'displayedData', 'get');
       component.onToggleSelectAll();
 
       expect(clearSpy).toHaveBeenCalled();

diff --git a/projects/material-addons/src/lib/data-table/data-table.component.ts b/projects/material-addons/src/lib/data-table/data-table.component.ts
@@ -488,9 +488,9 @@ export class DataTableComponent implements AfterViewInit, OnChanges {
     return !!this._forceSelectionMode ? this._forceSelectionMode : this.actions.find((it) => it.type === 'BATCH') ? 'BATCH' : 'SINGLE';
   }
 
-  public get filteredPageData(): any[] {
-    // only use filtered data
-    return this.dataSource?._pageData(this.dataSource.filteredData);
+  // get filtered & sorted data of the current page
+  public get displayedData(): any[] {
+    return this.dataSource?._pageData(this.dataSource?.sortData(this.dataSource.filteredData, this.dataSource.sort));
   }
 
   public get showActionColumn(): boolean {
@@ -524,7 +524,7 @@ export class DataTableComponent implements AfterViewInit, OnChanges {
     this.allSelected = !this.allSelected;
     if (this.allSelected) {
       // select all rows of the current page
-      this.filteredPageData.forEach((row) => {
+      this.displayedData.forEach((row) => {
         if (!row.parentId) {
           this._selectionModel.select(row.rowId);
         }