Refactoring

apps/client/src/app/components/home-summary/home-summary.component.ts

@@ -101,7 +101,7 @@ export class HomeSummaryComponent implements OnDestroy, OnInit {
     this.isLoading = true;
 
     this.dataService
-      .fetchPortfolioDetails({})
+      .fetchPortfolioDetails()
       .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe(({ summary }) => {
         this.summary = summary;

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

@@ -72,7 +72,13 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
   public positions: {
     [symbol: string]: Pick<
       PortfolioPosition,
-      'assetClass' | 'assetSubClass' | 'currency' | 'exchange' | 'name'
+      | 'assetClass'
+      | 'assetClassLabel'
+      | 'assetSubClass'
+      | 'assetSubClassLabel'
+      | 'currency'
+      | 'exchange'
+      | 'name'
     > & { etfProvider: string; value: number };
   };
   public sectors: {
@@ -341,7 +347,9 @@ export class AllocationsPageComponent implements OnDestroy, OnInit {
       this.positions[symbol] = {
         value,
         assetClass: position.assetClass,
+        assetClassLabel: translate(position.assetClass),
         assetSubClass: position.assetSubClass,
+        assetSubClassLabel: translate(position.assetSubClass),
         currency: position.currency,
         etfProvider: this.extractEtfProvider({
           assetSubClass: position.assetSubClass,

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

@@ -93,7 +93,7 @@
             [baseCurrency]="user?.settings?.baseCurrency"
             [colorScheme]="user?.settings?.colorScheme"
             [isInPercent]="hasImpersonationId || user.settings.isRestrictedView"
-            [keys]="['assetClass', 'assetSubClass']"
+            [keys]="['assetClassLabel', 'assetSubClassLabel']"
             [locale]="user?.settings?.locale"
             [positions]="positions"
           ></gf-portfolio-proportion-chart>

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

@@ -44,7 +44,7 @@ export class FirePageComponent implements OnDestroy, OnInit {
     this.deviceType = this.deviceService.getDeviceInfo().deviceType;
 
     this.dataService
-      .fetchPortfolioDetails({})
+      .fetchPortfolioDetails()
       .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe(({ summary }) => {
         if (summary.cash === null || summary.currentValue === null) {

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

@@ -164,7 +164,11 @@ export class HoldingsPageComponent implements OnDestroy, OnInit {
     for (const [symbol, position] of Object.entries(
       this.portfolioDetails.holdings
     )) {
-      this.positionsArray.push(position);
+      this.positionsArray.push({
+        ...position,
+        assetClassLabel: translate(position.assetClass),
+        assetSubClassLabel: translate(position.assetSubClass)
+      });
     }
   }
 

apps/client/src/app/services/data.service.ts

@@ -341,7 +341,7 @@ export class DataService {
     filters
   }: {
     filters?: Filter[];
-  }): Observable<PortfolioDetails> {
+  } = {}): Observable<PortfolioDetails> {
     return this.http
       .get<any>('/api/v1/portfolio/details', {
         params: this.buildFiltersAsQueryParams({ filters })
@@ -356,14 +356,6 @@ export class DataService {
 
           if (response.holdings) {
             for (const symbol of Object.keys(response.holdings)) {
-              response.holdings[symbol].assetClass = translate(
-                response.holdings[symbol].assetClass
-              );
-
-              response.holdings[symbol].assetSubClass = translate(
-                response.holdings[symbol].assetSubClass
-              );
-
               response.holdings[symbol].dateOfFirstActivity = response.holdings[
                 symbol
               ].dateOfFirstActivity

libs/common/src/lib/interfaces/portfolio-position.interface.ts

@@ -7,7 +7,9 @@ import { Sector } from './sector.interface';
 export interface PortfolioPosition {
   allocationInPercentage: number;
   assetClass?: AssetClass;
+  assetClassLabel?: string;
   assetSubClass?: AssetSubClass | 'CASH';
+  assetSubClassLabel?: string;
   countries: Country[];
   currency: string;
   dataSource: DataSource;

libs/ui/src/lib/holdings-table/holdings-table.component.html

@@ -31,7 +31,7 @@
         <div class="text-truncate">
           {{ element.name }}
           <span *ngIf="element.name === element.symbol"
-            >({{ element.assetSubClass }})</span
+            >({{ element.assetSubClassLabel }})</span
           >
         </div>
         <div>

libs/ui/src/lib/holdings-table/holdings-table.component.ts

@@ -14,7 +14,6 @@ import { MatSort } from '@angular/material/sort';
 import { MatTableDataSource } from '@angular/material/table';
 import { Router } from '@angular/router';
 import { PortfolioPosition, UniqueAsset } from '@ghostfolio/common/interfaces';
-import { translate } from '@ghostfolio/ui/i18n';
 import { AssetClass, Order as OrderModel } from '@prisma/client';
 import { Subject, Subscription } from 'rxjs';
 
@@ -42,7 +41,7 @@ export class HoldingsTableComponent implements OnChanges, OnDestroy, OnInit {
   public dataSource: MatTableDataSource<PortfolioPosition> =
     new MatTableDataSource();
   public displayedColumns = [];
-  public ignoreAssetSubClasses = [translate(AssetClass.CASH)];
+  public ignoreAssetSubClasses = [AssetClass.CASH];
   public isLoading = true;
   public routeQueryParams: Subscription;