Bugfix/fix cash position rows in holdings table (#2237)

* Fix cash position rows

* Update changelog

CHANGELOG.md

@@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Fixed
 
+- Fixed the rows with cash positions in the holdings table
 - Fixed an issue with the date parsing in the historical market data editor of the admin control panel
 
 ## 1.300.0 - 2023-08-11

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

@@ -28,8 +28,11 @@
         <ng-container i18n>Name</ng-container>
       </th>
       <td *matCellDef="let element" class="line-height-1 px-1" mat-cell>
-        <div *ngIf="element.name !== element.symbol" class="text-truncate">
+        <div class="text-truncate">
           {{ element.name }}
+          <span *ngIf="element.name === element.symbol"
+            >({{ element.assetSubClassLabel }})</span
+          >
         </div>
         <div>
           <small class="text-muted">{{ element.symbol }}</small>

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

@@ -14,12 +14,6 @@
           }
         }
       }
-
-      .mat-mdc-row {
-        &.cursor-pointer {
-          cursor: pointer;
-        }
-      }
     }
   }
 }

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

@@ -41,7 +41,7 @@ export class HoldingsTableComponent implements OnChanges, OnDestroy, OnInit {
   public dataSource: MatTableDataSource<PortfolioPosition> =
     new MatTableDataSource();
   public displayedColumns = [];
-  public ignoreAssetSubClasses = [AssetClass.CASH.toString()];
+  public ignoreAssetSubClasses = [AssetClass.CASH];
   public isLoading = true;
   public routeQueryParams: Subscription;