@acorex/components 22.1.0-next.2 → 22.1.0-next.20

package/fesm2022/acorex-components-data-table.mjs

@@ -732,7 +732,8 @@ class AXDataTableTextColumnComponent extends AXDataTableColumnComponent {
     /**
      *  @ignore
      */
-    async handleExpandRow(row) {
+    async handleExpandRow(row, event) {
+        event?.stopPropagation();
         this.loadingRow.set(row);
         await this.grid.expandRow(row);
         this.loadingRow.set(null);
@@ -772,7 +773,7 @@ class AXDataTableTextColumnComponent extends AXDataTableColumnComponent {
       >
         @if (expandHandler && (row.data?.[grid.hasChildrenField] !== false || (row.data?.children?.length ?? 0) > 0)) {
           <div
-            (click)="handleExpandRow(row)"
+            (click)="handleExpandRow(row, $event)"
             class="ax-expand-handler"
             id="ax-expand-handler-container"
           >
@@ -812,7 +813,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
       >
         @if (expandHandler && (row.data?.[grid.hasChildrenField] !== false || (row.data?.children?.length ?? 0) > 0)) {
           <div
-            (click)="handleExpandRow(row)"
+            (click)="handleExpandRow(row, $event)"
             class="ax-expand-handler"
             id="ax-expand-handler-container"
           >
@@ -1407,7 +1408,8 @@ class AXRowExpandColumnComponent extends AXDataTableColumnComponent {
     /**
      *  @ignore
      */
-    async handleExpandRow(row) {
+    async handleExpandRow(row, event) {
+        event?.stopPropagation();
         this.loadingRow.set(row);
         await this.grid.expandRow(row);
         this.loadingRow.set(null);
@@ -1433,7 +1435,7 @@ class AXRowExpandColumnComponent extends AXDataTableColumnComponent {
         [attr.data-level]="row.data?.__meta__?.level || 0"
       >
         @if (row.data?.[grid.hasChildrenField] !== false || (row.data?.children?.length ?? 0) > 0) {
-          <div (click)="handleExpandRow(row)" class="ax-expand-handler">
+        <div (click)="handleExpandRow(row, $event)" class="ax-expand-handler">
             @if (loadingRow() === row) {
               <i class="fas fa-spinner-third ax-animate-twSpin ax-animate-infinite"></i>
             } @else {
@@ -1462,7 +1464,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.8", ngImpor
         [attr.data-level]="row.data?.__meta__?.level || 0"
       >
         @if (row.data?.[grid.hasChildrenField] !== false || (row.data?.children?.length ?? 0) > 0) {
-          <div (click)="handleExpandRow(row)" class="ax-expand-handler">
+        <div (click)="handleExpandRow(row, $event)" class="ax-expand-handler">
             @if (loadingRow() === row) {
               <i class="fas fa-spinner-third ax-animate-twSpin ax-animate-infinite"></i>
             } @else {
@@ -2119,27 +2121,17 @@ class AXDataTableComponent extends AXBaseDataTable {
             this.applyDataPagerMethods();
         }
         this.rtl = AXHtmlUtil.isRtl(this.getHostElement());
-        this.dataSource.useCache = false;
-        if (this.fetchDataMode == 'auto') {
-            this.dataSource.setPage(0);
-        }
-        this.displayedRows.set(new Array(this.dataSource.pageSize));
-        this.totalRows = this.dataSource.items.length;
         this.dataSource.onLoadingChanged.pipe(this._unsubscriber.takeUntilDestroy).subscribe((data) => {
             this.isLoading.set(data);
         });
+        this.isLoading.set(this.dataSource.isLoading);
         this.dataSource.onChanged.pipe(this._unsubscriber.takeUntilDestroy).subscribe((data) => {
             const shouldMoveToPreviousPage = data.totalCount > 0 && data.items.length === 0 && data.page > 0;
             if (shouldMoveToPreviousPage) {
                 this.goToPage(data.page);
                 return;
             }
-            this.clearResolvedCssClasses();
-            this.lastLoadedRows = data.items.filter((item) => !item[this.parentField]);
-            this.displayedRows.set(this.mergeRowsWithHighlights(this.lastLoadedRows));
-            this.totalRows = data.totalCount;
-            this.hasItems = data.totalCount > 0;
-            this.scheduleTextHighlight();
+            this.applyLoadedRows(data.items, data.totalCount);
         });
         this.dataSource.onItemExpanded.pipe(this._unsubscriber.takeUntilDestroy).subscribe((data) => {
             const { expandedItem, children } = data;
@@ -2156,6 +2148,21 @@ class AXDataTableComponent extends AXBaseDataTable {
             this.refreshExpandedItem(id);
         });
         this.pageSize.set(this.dataSource.pageSize);
+        const existingItems = (this.dataSource.items ?? []).filter((item) => item != null);
+        if (existingItems.length > 0) {
+            // Popup/lookup remounts this table; setPage(0) is a no-op on a warm source and
+            // would leave the default skeleton rows in place. Paint cached rows instead of refetching.
+            this.applyLoadedRows(existingItems, this.dataSource.totalCount || existingItems.length);
+            this.isLoading.set(false);
+        }
+        else {
+            this.dataSource.useCache = false;
+            if (this.fetchDataMode == 'auto') {
+                this.dataSource.setPage(0);
+            }
+            this.displayedRows.set(new Array(this.dataSource.pageSize));
+            this.totalRows = this.dataSource.items.length;
+        }
         //
         this.clickSubject
             .pipe(buffer(this.clickSubject.pipe(debounceTime(250))), filter((clickArray) => clickArray.length === 2))
@@ -2163,6 +2170,14 @@ class AXDataTableComponent extends AXBaseDataTable {
             this.handleRowDoubleClick(clickArray[0].event, clickArray[0].item);
         });
     }
+    applyLoadedRows(items, totalCount) {
+        this.clearResolvedCssClasses();
+        this.lastLoadedRows = items.filter((item) => item != null && !item[this.parentField]);
+        this.displayedRows.set(this.mergeRowsWithHighlights(this.lastLoadedRows));
+        this.totalRows = totalCount;
+        this.hasItems = totalCount > 0;
+        this.scheduleTextHighlight();
+    }
     /**
      *  @ignore
      */