diff --git a/apps/client/src/app/components/home-overview/home-overview.component.ts b/apps/client/src/app/components/home-overview/home-overview.component.ts index 6c9694a19..4f4d0a412 100644 --- a/apps/client/src/app/components/home-overview/home-overview.component.ts +++ b/apps/client/src/app/components/home-overview/home-overview.component.ts @@ -61,6 +61,8 @@ export class GfHomeOverviewComponent implements OnDestroy, OnInit { public showDetails = false; public unit: string; public user: User; + private graph_type: string; + public graph_unit: string; private unsubscribeSubject = new Subject(); @@ -97,6 +99,11 @@ export class GfHomeOverviewComponent implements OnDestroy, OnInit { this.unit = this.showDetails ? this.user.settings.baseCurrency : '%'; + this.graph_type = !this.showDetails + ? 'netPerformanceInPercentageWithCurrencyEffect' + : (localStorage.getItem('home_overview_graph_type') ?? + 'netPerformanceInPercentageWithCurrencyEffect'); + this.impersonationStorageService .onChangeHasImpersonation() .pipe(takeUntil(this.unsubscribeSubject)) @@ -131,14 +138,21 @@ export class GfHomeOverviewComponent implements OnDestroy, OnInit { this.errors = errors; this.performance = performance; - this.historicalDataItems = chart.map( - ({ date, netPerformanceInPercentageWithCurrencyEffect }) => { - return { - date, - value: netPerformanceInPercentageWithCurrencyEffect * 100 - }; - } - ); + const graph_multiplier = + this.graph_type === 'netPerformanceInPercentageWithCurrencyEffect' + ? 100 + : 1; + this.graph_unit = + this.graph_type === 'netPerformanceInPercentageWithCurrencyEffect' + ? '%' + : this.unit; + + this.historicalDataItems = chart.map((item) => { + return { + date: item.date, + value: item[this.graph_type] * graph_multiplier + }; + }); if ( this.deviceType === 'mobile' && @@ -155,4 +169,12 @@ export class GfHomeOverviewComponent implements OnDestroy, OnInit { this.changeDetectorRef.markForCheck(); } + + public onMetricClick(selectedgraph_type: string): void { + if (this.graph_type !== selectedgraph_type) { + this.graph_type = selectedgraph_type; + localStorage.setItem('home_overview_graph_type', this.graph_type); + this.update(); + } + } } diff --git a/apps/client/src/app/components/home-overview/home-overview.html b/apps/client/src/app/components/home-overview/home-overview.html index b36302ded..46703d9b1 100644 --- a/apps/client/src/app/components/home-overview/home-overview.html +++ b/apps/client/src/app/components/home-overview/home-overview.html @@ -69,7 +69,6 @@
@@ -99,6 +99,7 @@ [precision]="precision" [showDetails]="showDetails" [unit]="unit" + (metricClick)="onMetricClick($event)" /> diff --git a/apps/client/src/app/components/portfolio-performance/portfolio-performance.component.html b/apps/client/src/app/components/portfolio-performance/portfolio-performance.component.html index a2c5c17eb..6affc4a29 100644 --- a/apps/client/src/app/components/portfolio-performance/portfolio-performance.component.html +++ b/apps/client/src/app/components/portfolio-performance/portfolio-performance.component.html @@ -30,7 +30,12 @@ 'text-success': isAllTimeHigh }" > - + @if (!showDetails) { + + } + @if (showDetails) { + + }
{{ unit }} @@ -38,7 +43,10 @@
@if (showDetails) {
-
+
-
+
(); @ViewChild('value') value: ElementRef; @@ -95,4 +98,8 @@ export class GfPortfolioPerformanceComponent implements OnChanges { title: $localize`Market data is delayed for` }); } + + public onMetricClick(selectedChoice: string): void { + this.metricClick.emit(selectedChoice); // notify parent + } }