Fix pagination issue in extensible table component

npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.html

@@ -3,6 +3,8 @@
   [rows]="data"
   [count]="recordsTotal"
   [list]="list"
+  [offset]="list?.page"
+  (page)="setPage($event)"
   (activate)="tableActivate.emit($event)"
 >
   @if (actionsTemplate || (actionList.length && hasAtLeastOnePermittedAction)) {

npm/ng-packs/packages/components/extensible/src/lib/components/extensible-table/extensible-table.component.ts

@@ -1,7 +1,6 @@
 import {
   ABP,
-  ConfigStateService,
+  ConfigStateService, 
-  CoreModule,
   getShortDateFormat,
   getShortDateShortTimeFormat,
   getShortTimeFormat,
@@ -13,9 +12,7 @@ import {
 import {
   AsyncPipe,
   formatDate,
-  NgComponentOutlet,
+  NgComponentOutlet, 
-  NgFor,
-  NgIf,
   NgTemplateOutlet,
 } from '@angular/common';
 import {
@@ -175,14 +172,23 @@ export class ExtensibleTableComponent<R = any> implements OnChanges {
     );
   }
 
+  setPage({ offset }) {
+    this.list.page = offset;
+  }
+
   ngOnChanges({ data, recordsTotal }: SimpleChanges) {
-    if (data?.currentValue.length === 0 && recordsTotal?.currentValue) {
+    if (data?.currentValue.length < 1 && recordsTotal?.currentValue > 0) {
       let maxPage = Number(Number(recordsTotal?.currentValue / this.list.maxResultCount).toFixed());
 
-      if(recordsTotal?.currentValue % this.list.maxResultCount === 0){
+      if (recordsTotal?.currentValue % this.list.maxResultCount === 0) {
         maxPage -= 1;
       }
 
+      if (this.list.page < maxPage) {
+        this.list.page = this.list.page;
+        return;
+      }
+
       this.list.page = maxPage;
       return;
     }

npm/ng-packs/packages/theme-shared/src/lib/directives/ngx-datatable-list.directive.ts

@@ -53,14 +53,6 @@ export class NgxDatatableListDirective implements OnChanges, OnDestroy, OnInit {
     };
   }
 
-  private subscribeToPage() {
-    const sub = this.table.page.subscribe(({ offset }) => {
-      this.list.page = offset;
-      this.table.offset = offset;
-    });
-    this.subscription.add(sub);
-  }
-
   private subscribeToSort() {
     const sub = this.table.sort.subscribe(({ sorts: [{ prop, dir }] }) => {
       if (prop === this.list.sortKey && this.list.sortOrder === 'desc') {
@@ -101,7 +93,6 @@ export class NgxDatatableListDirective implements OnChanges, OnDestroy, OnInit {
   }
 
   ngOnInit() {
-    this.subscribeToPage();
     this.subscribeToSort();
   }
 }