Bugfix/allocation column of top holdings (#7974)

* Fix allocation column of top holdings of ETFs

* Update changelog

CHANGELOG.md

@@ -20,7 +20,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Fixed
 
 - Fixed the colors of the investment chart component (dark mode)
-- Fixed the value column of the top holdings on the allocations page in the _Presenter View_
+- Fixed the allocation column of the top holdings of ETFs on the allocations page after a change of the user settings
+- Fixed the value column of the top holdings of ETFs on the allocations page in the _Presenter View_
 - Fixed the projected sustainable retirement income on the _FIRE_ page for a projected total amount of zero (experimental)
 - Fixed the emergency fund in the portfolio summary for redacted values
 - Fixed the redaction of `valueInBaseCurrency` in the holdings of ETFs in a restricted view

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

@@ -134,11 +134,6 @@ export class GfAllocationsPageComponent implements OnInit {
   protected readonly UNKNOWN_KEY = UNKNOWN_KEY;
   protected user: User;
 
-  private topHoldingsMap: {
-    [name: string]: { name: string; value: number };
-  };
-  private totalValueInEtf = 0;
-
   private readonly changeDetectorRef = inject(ChangeDetectorRef);
   private readonly dataService = inject(DataService);
   private readonly destroyRef = inject(DestroyRef);
@@ -365,7 +360,6 @@ export class GfAllocationsPageComponent implements OnInit {
         value: 0
       }
     };
-    this.topHoldingsMap = {};
   }
 
   private initializeAllocationsData() {
@@ -388,7 +382,12 @@ export class GfAllocationsPageComponent implements OnInit {
       };
     }
 
+    const topHoldingsMap: {
+      [name: string]: { name: string; value: number };
+    } = {};
+
     let totalValueExcludingCashPositions = 0;
+    let totalValueInEtf = 0;
 
     for (const position of this.portfolioDetails.holdings) {
       const assetProfileIdentifier = getAssetProfileIdentifier(
@@ -474,12 +473,12 @@ export class GfAllocationsPageComponent implements OnInit {
               ? valueInBaseCurrency
               : allocationInPercentage * (position.valueInPercentage ?? 0);
 
-            const holdingData = this.topHoldingsMap[normalizedAssetName];
+            const holdingData = topHoldingsMap[normalizedAssetName];
 
             if (holdingData) {
               holdingData.value += value;
             } else {
-              this.topHoldingsMap[normalizedAssetName] = {
+              topHoldingsMap[normalizedAssetName] = {
                 name,
                 value
               };
@@ -515,7 +514,7 @@ export class GfAllocationsPageComponent implements OnInit {
       }
 
       if (this.holdings[assetProfileIdentifier].assetSubClass === 'ETF') {
-        this.totalValueInEtf += this.holdings[assetProfileIdentifier].value;
+        totalValueInEtf += this.holdings[assetProfileIdentifier].value;
       }
 
       const symbol = position.assetProfile.symbol;
@@ -582,7 +581,7 @@ export class GfAllocationsPageComponent implements OnInit {
       };
     }
 
-    this.topHoldings = Object.values(this.topHoldingsMap)
+    this.topHoldings = Object.values(topHoldingsMap)
       .map(({ name, value }): HoldingWithParents => {
         if (this.showValuesInPercentage()) {
           return {
@@ -594,7 +593,7 @@ export class GfAllocationsPageComponent implements OnInit {
         return {
           name,
           allocationInPercentage:
-            this.totalValueInEtf > 0 ? value / this.totalValueInEtf : 0,
+            totalValueInEtf > 0 ? value / totalValueInEtf : 0,
           parents: this.portfolioDetails.holdings
             .map((holding) => {
               if (holding.assetProfile.holdings.length > 0) {