fix(platform): reset table rows before new rows emitted (#11058)

SAP · Dec 7, 2023 · 92a534b · 92a534b
1 parent a300708
commit 92a534b
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 9 deletions.
diff --git a/libs/platform/table-helpers/directives/table-data-source.directive.ts b/libs/platform/table-helpers/directives/table-data-source.directive.ts
@@ -233,5 +233,6 @@ export class TableDataSourceDirective<T> extends DataSourceDirective<T, TableDat
 
         this._tableDsSubscription?.unsubscribe();
         this._tableDsSubscription = null;
+        this._table.clearTableRows();
     }
 }
diff --git a/libs/platform/table-helpers/table.ts b/libs/platform/table-helpers/table.ts
@@ -170,6 +170,8 @@ export abstract class Table<T = any> implements PresetManagedComponent<PlatformT
 
     abstract refreshDndList(): void;
 
+    abstract clearTableRows(): void;
+
     /** Toolbar Sort Settings button click event */
     readonly openTableSortSettings: EventEmitter<void> = new EventEmitter<void>();
 

diff --git a/libs/platform/table/table.component.ts b/libs/platform/table/table.component.ts
@@ -1338,6 +1338,17 @@ export class TableComponent<T = any>
         tableEl.rows[position.rowIndex].cells[position.colIndex].focus();
     }
 
+    /**
+     * Clears the array of table rows. Triggered when new data source is applied.
+     */
+    clearTableRows(): void {
+        this._tableRows = [];
+        this._tableRowsVisible = [];
+        this._tableRowsInViewPortPlaceholder = [];
+        this._newTableRows = [];
+        this._dataSourceTableRows = [];
+    }
+
     // Private API
 
     /** @hidden */
@@ -1592,15 +1603,6 @@ export class TableComponent<T = any>
 
     /** @hidden */
     private _listenToTableRowsPipe(): void {
-        this._subscriptions.add(
-            /*
-             * Reset table when the data source is changed,
-             * because new data source can have different set of data
-             */
-            this._dataSourceDirective.dataSourceChanged.subscribe(() => {
-                this._setTableRows([]);
-            })
-        );
         this._subscriptions.add(
             this._dataSourceDirective.items$
                 .pipe(