Emit paginator event

apps/client/src/app/pages/portfolio/activities/activities-page.component.ts

@@ -1,5 +1,6 @@
 import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
+import { PageEvent } from '@angular/material/paginator';
 import { MatTableDataSource } from '@angular/material/table';
 import { ActivatedRoute, Router } from '@angular/router';
 import { CreateOrderDto } from '@ghostfolio/api/app/order/create-order.dto';
@@ -11,6 +12,7 @@ import { DataService } from '@ghostfolio/client/services/data.service';
 import { IcsService } from '@ghostfolio/client/services/ics/ics.service';
 import { ImpersonationStorageService } from '@ghostfolio/client/services/impersonation-storage.service';
 import { UserService } from '@ghostfolio/client/services/user/user.service';
+import { DEFAULT_PAGE_SIZE } from '@ghostfolio/common/config';
 import { downloadAsFile } from '@ghostfolio/common/helper';
 import { User } from '@ghostfolio/common/interfaces';
 import { hasPermission, permissions } from '@ghostfolio/common/permissions';
@@ -37,6 +39,8 @@ export class ActivitiesPageComponent implements OnDestroy, OnInit {
   public hasImpersonationId: boolean;
   public hasPermissionToCreateActivity: boolean;
   public hasPermissionToDeleteActivity: boolean;
+  public pageIndex = 0;
+  public pageSize = DEFAULT_PAGE_SIZE;
   public routeQueryParams: Subscription;
   public user: User;
 
@@ -123,6 +127,10 @@ export class ActivitiesPageComponent implements OnDestroy, OnInit {
       });
   }
 
+  public onChangePage(page: PageEvent) {
+    this.pageIndex = page.pageIndex;
+  }
+
   public onCloneActivity(aActivity: Activity) {
     this.openCreateActivityDialog(aActivity);
   }

apps/client/src/app/pages/portfolio/activities/activities-page.html

@@ -10,6 +10,8 @@
         [hasPermissionToCreateActivity]="hasPermissionToCreateActivity"
         [hasPermissionToExportActivities]="!hasImpersonationId"
         [locale]="user?.settings?.locale"
+        [pageIndex]="pageIndex"
+        [pageSize]="pageSize"
         [showActions]="!hasImpersonationId && hasPermissionToDeleteActivity && !user.settings.isRestrictedView"
         (activityDeleted)="onDeleteActivity($event)"
         (activityToClone)="onCloneActivity($event)"
@@ -19,6 +21,7 @@
         (exportDrafts)="onExportDrafts($event)"
         (import)="onImport()"
         (importDividends)="onImportDividends()"
+        (pageChanged)="onChangePage($event)"
       ></gf-activities-table-lazy>
       <gf-activities-table
         *ngIf="user?.settings?.isExperimentalFeatures !== true"

apps/client/src/app/pages/portfolio/activities/activities-page.module.ts

@@ -4,8 +4,8 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatSnackBarModule } from '@angular/material/snack-bar';
 import { RouterModule } from '@angular/router';
 import { ImportActivitiesService } from '@ghostfolio/client/services/import-activities.service';
-import { GfActivitiesTableModule } from '@ghostfolio/ui/activities-table/activities-table.module';
 import { GfActivitiesTableLazyModule } from '@ghostfolio/ui/activities-table-lazy/activities-table-lazy.module';
+import { GfActivitiesTableModule } from '@ghostfolio/ui/activities-table/activities-table.module';
 
 import { ActivitiesPageRoutingModule } from './activities-page-routing.module';
 import { ActivitiesPageComponent } from './activities-page.component';

libs/ui/src/lib/activities-table-lazy/activities-table-lazy.component.ts

@@ -40,6 +40,7 @@ export class ActivitiesTableLazyComponent
   @Input() hasPermissionToExportActivities: boolean;
   @Input() hasPermissionToOpenDetails = true;
   @Input() locale: string;
+  @Input() pageIndex: number;
   @Input() pageSize = DEFAULT_PAGE_SIZE;
   @Input() showActions = true;
   @Input() showCheckbox = false;
@@ -54,6 +55,7 @@ export class ActivitiesTableLazyComponent
   @Output() exportDrafts = new EventEmitter<string[]>();
   @Output() import = new EventEmitter<void>();
   @Output() importDividends = new EventEmitter<UniqueAsset>();
+  @Output() pageChanged = new EventEmitter<PageEvent>();
   @Output() selectedActivities = new EventEmitter<Activity[]>();
 
   @ViewChild(MatPaginator) paginator: MatPaginator;
@@ -67,7 +69,6 @@ export class ActivitiesTableLazyComponent
   public isAfter = isAfter;
   public isLoading = true;
   public isUUID = isUUID;
-  public pageIndex = 0;
   public routeQueryParams: Subscription;
   public searchKeywords: string[] = [];
   public selectedRows = new SelectionModel<Activity>(true, []);
@@ -136,7 +137,7 @@ export class ActivitiesTableLazyComponent
   }
 
   public onChangePage(page: PageEvent) {
-    this.pageIndex = page.pageIndex;
+    this.pageChanged.emit(page);
   }
 
   public onClickActivity(activity: Activity) {