@acorex/platform 20.8.8 → 20.8.9

package/fesm2022/{acorex-platform-themes-default-entity-master-list-view.component-DZeByyDy.mjs → acorex-platform-themes-default-entity-master-list-view.component-D2CtNrSn.mjs}

@@ -27,6 +27,7 @@ import * as i10 from '@acorex/core/translation';
 import { AXTranslationService, AXTranslationModule, translateSync } from '@acorex/core/translation';
 import { AXPAuthModule } from '@acorex/platform/auth';
 import { AXPThemeLayoutBlockComponent, AXPThemeLayoutHeaderComponent, AXPThemeLayoutToolbarComponent, AXPStateMessageComponent, AXPQueryFiltersComponent, AXPQuerySortsComponent, AXPQueryViewsComponent, AXPQueryColumnsComponent, AXPThemeLayoutStartSideComponent } from '@acorex/platform/layout/components';
+import { AXPCategoryTreeService, AXPEntityListViewColumnViewModel, getDataSourcePageIndex, restoreEntityListExpandedRows } from '@acorex/platform/layout/entity';
 import * as i7$1 from '@acorex/platform/layout/widget-core';
 import { AXPWidgetCoreModule } from '@acorex/platform/layout/widget-core';
 import { AXPWidgetsModule } from '@acorex/platform/layout/widgets';
@@ -37,12 +38,12 @@ import { FormsModule } from '@angular/forms';
 import { AXDropdownButtonModule } from '@acorex/components/dropdown-button';
 import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex/platform/layout/views';
 import { AXPLayoutThemeService } from '@acorex/platform/themes/shared';
+import { Subject, takeUntil } from 'rxjs';
 import * as i2$1 from '@acorex/components/skeleton';
 import { AXSkeletonModule } from '@acorex/components/skeleton';
 import { AXTreeViewModule, AXTreeViewComponent } from '@acorex/components/tree-view';
 import { AXPRefreshEvent, AXPSettingsService, AXPCommonSettings } from '@acorex/platform/common';
 import { AXHighlightService, AXPDeviceService } from '@acorex/platform/core';
-import { AXPCategoryTreeService, AXPEntityListViewColumnViewModel } from '@acorex/platform/layout/entity';
 import { AXPWorkflowService, ofType } from '@acorex/platform/workflow';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { isEqual } from 'lodash-es';
@@ -1089,7 +1090,10 @@ class AXPEntityMasterToolbarViewComponent {
         this.sortQueries = computed(() => this.vm
             .sortedFields()
             .filter((s) => !!s.dir)
-            .map((s) => ({ name: s.name, dir: s.dir })), ...(ngDevMode ? [{ debugName: "sortQueries" }] : []));
+            .map((s) => ({
+            name: s.name,
+            dir: s.dir,
+        })), ...(ngDevMode ? [{ debugName: "sortQueries" }] : []));
         this.sortDefinitions = computed(() => this.vm.sortableFields().map((s) => ({
             name: s.name,
             title: s.title,
@@ -1100,6 +1104,7 @@ class AXPEntityMasterToolbarViewComponent {
         // Prefer saved settings (view/columns/sorts/filters) if available, then apply
         await this.loadSettings();
         await this.vm.setView();
+        await this.vm.ensureListPagingResolved();
         this.filtersDefinitions.set(this.vm.filtersDef);
         this.isInitializing = true;
         // this.pendingInitialFilters = true;
@@ -1191,6 +1196,9 @@ class AXPEntityMasterToolbarViewComponent {
             const byKey = new Map(prev.map((c) => [keyOf(c), c]));
             return columns.map((newColumn) => {
                 const existing = byKey.get(keyOf(newColumn));
+                if (!existing) {
+                    return null;
+                }
                 return new AXPEntityListViewColumnViewModel(existing.property, {
                     ...existing.column,
                     options: {
@@ -1198,7 +1206,7 @@ class AXPEntityMasterToolbarViewComponent {
                         visible: newColumn.visible,
                     },
                 });
-            });
+            }).filter((c) => c != null);
         });
         // Persist column order/visibility
         this.vm.onColumnsChanged(this.vm.columns());
@@ -1245,6 +1253,9 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
         this.grid = viewChild('grid', ...(ngDevMode ? [{ debugName: "grid" }] : []));
         this.initializedFromRoute = false;
         this.lastEvaluatedViewName = null;
+        this.componentDestroyed = new Subject();
+        this.isRestoringExpandedRows = false;
+        this.restoreExpandedRowsScheduled = false;
         this.commandRowItems = computed(() => {
             return this.vm.primaryRowActions().map((c) => {
                 return {
@@ -1278,9 +1289,17 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
                     this.updateParentHasChildAfterRefresh(refreshTargetId);
                 }
                 else {
+                    if (!resetPagination) {
+                        await this.vm.ensureListPagingResolved();
+                        this.vm.applyPagingToDataSourceWithoutLoad();
+                    }
                     this.grid()?.refresh({
                         reset: resetPagination,
                     });
+                    if (!resetPagination) {
+                        this.scheduleSyncGridPagerUi();
+                    }
+                    this.scheduleRestoreExpandedRows();
                 }
             }
         });
@@ -1310,6 +1329,7 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
             if (this.lastEvaluatedViewName !== currentViewName) {
                 this.lastEvaluatedViewName = currentViewName;
                 this.recompute();
+                this.scheduleRestoreExpandedRows();
             }
         });
     }
@@ -1318,6 +1338,7 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
         this.queryParamSub = this.activeRoute.queryParamMap.subscribe(async (qp) => {
             const viewFromUrl = qp.get('view');
             await this.vm.setView(viewFromUrl);
+            this.scheduleRestoreExpandedRows();
         });
     }
     async ngAfterViewInit() {
@@ -1334,6 +1355,8 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
             });
         }
         this.initializedFromRoute = true;
+        this.bindExpandedRowPersistence();
+        this.scheduleRestoreExpandedRows();
     }
     onColumnSizeChanged(e) {
         if (e.isUserInteraction && e.type === 'end') {
@@ -1341,12 +1364,10 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
         }
     }
     onPageChanged(e) {
-        if (e.isUserInteraction) {
-            const pageSizeChanged = e.take != this.vm.dataSource.pageSize;
-            if (pageSizeChanged) {
-                this.vm.saveSettings('pageSize', e.take);
-            }
+        if (e.isUserInteraction && !this.vm.skipListPagingPersistence) {
+            this.vm.saveListPaging(e.take, e.skip);
         }
+        this.scheduleRestoreExpandedRows();
     }
     onColumnsOrderChanged(e) {
         if (e.isUserInteraction) {
@@ -1491,9 +1512,94 @@ class AXPEntityMasterListViewComponent extends AXPPageLayoutBaseComponent {
         this.toggleEndSide();
     }
     ngOnDestroy() {
+        this.componentDestroyed.next();
+        this.componentDestroyed.complete();
         this.queryParamSub?.unsubscribe();
         this.vm.destroy();
     }
+    bindExpandedRowPersistence() {
+        if (!this.vm.parentKey()) {
+            return;
+        }
+        this.vm.dataSource.onItemExpanded.pipe(takeUntil(this.componentDestroyed)).subscribe((event) => {
+            const expandedItem = event?.expandedItem;
+            if (expandedItem && typeof expandedItem === 'object') {
+                this.vm.handleRowExpandChange(expandedItem);
+            }
+        });
+    }
+    scheduleSyncGridPagerUi() {
+        queueMicrotask(() => {
+            this.syncGridPagerUi();
+        });
+    }
+    syncGridPagerUi() {
+        const gridRef = this.grid();
+        if (!gridRef) {
+            return;
+        }
+        const pageIndex = getDataSourcePageIndex(this.vm.dataSource);
+        const take = this.vm.dataSource.config.pageSize;
+        const pagerPage = pageIndex + 1;
+        const grid = gridRef;
+        this.vm.skipListPagingPersistence = true;
+        try {
+            if (grid.page() !== pageIndex) {
+                grid.page.set(pageIndex);
+            }
+            grid.pageSize.set(take);
+            const pager = grid.dataPager;
+            if (pager && pager.value !== pagerPage) {
+                pager.goToPage(pagerPage);
+            }
+        }
+        finally {
+            this.vm.skipListPagingPersistence = false;
+        }
+    }
+    scheduleRestoreExpandedRows() {
+        if (!this.vm.parentKey() || this.restoreExpandedRowsScheduled) {
+            return;
+        }
+        this.restoreExpandedRowsScheduled = true;
+        queueMicrotask(() => {
+            this.restoreExpandedRowsScheduled = false;
+            void this.restoreExpandedRows();
+        });
+    }
+    async restoreExpandedRows() {
+        if (!this.vm.parentKey() || this.isRestoringExpandedRows) {
+            return;
+        }
+        const expandedRowIds = this.vm.getExpandedRowIds();
+        if (!expandedRowIds.length) {
+            return;
+        }
+        const gridRef = this.grid();
+        if (!gridRef || gridRef.dataSource.isLoading) {
+            return;
+        }
+        const gridWithDisplayedRows = gridRef;
+        const displayedRows = gridWithDisplayedRows.displayedRows?.() ?? [];
+        if (!displayedRows.length) {
+            return;
+        }
+        this.isRestoringExpandedRows = true;
+        this.vm.skipExpandedRowPersistence = true;
+        try {
+            const rowKey = this.vm.dataSource.config?.key ?? 'id';
+            await restoreEntityListExpandedRows({
+                expandedRowIds,
+                rowKey,
+                getDisplayedRows: () => gridWithDisplayedRows.displayedRows?.() ?? [],
+                expandRow: (row) => gridRef.expandRow(row),
+            });
+        }
+        finally {
+            this.vm.skipExpandedRowPersistence = false;
+            this.isRestoringExpandedRows = false;
+        }
+    }
     toggleCategoryDrawer() {
         this.toggleStartSide();
     }
@@ -1607,4 +1713,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImpo
         }], ctorParameters: () => [{ type: i1$1.AXPlatform }], propDecorators: { grid: [{ type: i0.ViewChild, args: ['grid', { isSignal: true }] }] } });
 
 export { AXPEntityMasterListViewComponent };
-//# sourceMappingURL=acorex-platform-themes-default-entity-master-list-view.component-DZeByyDy.mjs.map
+//# sourceMappingURL=acorex-platform-themes-default-entity-master-list-view.component-D2CtNrSn.mjs.map