From fde23ec9dc0e2ad743462b9f7a18be59116da7de Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Mon, 18 May 2026 21:53:44 +0300 Subject: [PATCH] Task/improve pagination for activities in account detail dialog (#6887) * Improve pagination in activities table * Update changelog --- CHANGELOG.md | 1 + .../account-detail-dialog.component.ts | 36 +++++++++++++------ .../account-detail-dialog.html | 3 ++ 3 files changed, 29 insertions(+), 11 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 447469ea7..14827175b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed +- Improved the pagination in the activities table of the account detail dialog - Improved the pagination in the activities table of the holding detail dialog - Randomized the placeholder in the assistant - Enabled the _Bull Dashboard_ in the admin control panel without requiring an environment variable (experimental) diff --git a/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.component.ts b/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.component.ts index 05f13f804..a429d9e64 100644 --- a/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.component.ts +++ b/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.component.ts @@ -1,6 +1,9 @@ import { GfInvestmentChartComponent } from '@ghostfolio/client/components/investment-chart/investment-chart.component'; import { UserService } from '@ghostfolio/client/services/user/user.service'; -import { NUMERICAL_PRECISION_THRESHOLD_6_FIGURES } from '@ghostfolio/common/config'; +import { + DEFAULT_PAGE_SIZE, + NUMERICAL_PRECISION_THRESHOLD_6_FIGURES +} from '@ghostfolio/common/config'; import { CreateAccountBalanceDto } from '@ghostfolio/common/dtos'; import { DATE_FORMAT, downloadAsFile } from '@ghostfolio/common/helper'; import { @@ -33,6 +36,7 @@ import { takeUntilDestroyed } from '@angular/core/rxjs-interop'; import { MatButtonModule } from '@angular/material/button'; import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog'; import { MatDialogModule } from '@angular/material/dialog'; +import { PageEvent } from '@angular/material/paginator'; import { Sort, SortDirection } from '@angular/material/sort'; import { MatTableDataSource } from '@angular/material/table'; import { MatTabsModule } from '@angular/material/tabs'; @@ -93,6 +97,8 @@ export class GfAccountDetailDialogComponent implements OnInit { protected isLoadingActivities: boolean; protected isLoadingChart: boolean; protected name: string | null; + protected pageIndex = 0; + protected pageSize = DEFAULT_PAGE_SIZE; protected platformName: string; protected sortColumn = 'date'; protected sortDirection: SortDirection = 'desc'; @@ -133,6 +139,21 @@ export class GfAccountDetailDialogComponent implements OnInit { this.initialize(); } + protected onAddAccountBalance(accountBalance: CreateAccountBalanceDto) { + this.dataService + .postAccountBalance(accountBalance) + .pipe(takeUntilDestroyed(this.destroyRef)) + .subscribe(() => { + this.initialize(); + }); + } + + protected onChangePage(page: PageEvent) { + this.pageIndex = page.pageIndex; + + this.fetchActivities(); + } + protected onCloneActivity(aActivity: Activity) { this.router.navigate( internalRoutes.portfolio.subRoutes.activities.routerLink, @@ -148,15 +169,6 @@ export class GfAccountDetailDialogComponent implements OnInit { this.dialogRef.close(); } - protected onAddAccountBalance(accountBalance: CreateAccountBalanceDto) { - this.dataService - .postAccountBalance(accountBalance) - .pipe(takeUntilDestroyed(this.destroyRef)) - .subscribe(() => { - this.initialize(); - }); - } - protected onDeleteAccountBalance(aId: string) { this.dataService .deleteAccountBalance(aId) @@ -287,8 +299,10 @@ export class GfAccountDetailDialogComponent implements OnInit { this.dataService .fetchActivities({ filters: [{ id: this.data.accountId, type: 'ACCOUNT' }], + skip: this.pageIndex * this.pageSize, sortColumn: this.sortColumn, - sortDirection: this.sortDirection + sortDirection: this.sortDirection, + take: this.pageSize }) .pipe(takeUntilDestroyed(this.destroyRef)) .subscribe(({ activities, count }) => { diff --git a/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.html b/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.html index 73412d49d..cd397e35e 100644 --- a/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.html +++ b/apps/client/src/app/components/account-detail-dialog/account-detail-dialog.html @@ -120,6 +120,8 @@ [hasPermissionToFilter]="false" [hasPermissionToOpenDetails]="false" [locale]="user?.settings?.locale" + [pageIndex]="pageIndex" + [pageSize]="pageSize" [showAccountColumn]="false" [showActions]=" !data.hasImpersonationId && @@ -133,6 +135,7 @@ (activityToClone)="onCloneActivity($event)" (activityToUpdate)="onUpdateActivity($event)" (export)="onExport()" + (pageChanged)="onChangePage($event)" (sortChanged)="onSortChanged($event)" />