Integrate net performance

apps/api/src/app/portfolio/interfaces/portfolio-position-detail.interface.ts

@@ -11,6 +11,8 @@ export interface PortfolioPositionDetail {
   marketPrice: number;
   maxPrice: number;
   minPrice: number;
+  netPerformance: number;
+  netPerformancePercent: number;
   quantity: number;
   symbol: string;
   transactionCount: number;

apps/api/src/app/portfolio/portfolio.service.ts

@@ -233,6 +233,8 @@ export class PortfolioService {
         marketPrice: item.marketPrice,
         marketState: dataProviderResponse.marketState,
         name: symbolProfile.name,
+        netPerformance: item.netPerformance?.toNumber() ?? 0,
+        netPerformancePercent: item.netPerformancePercentage?.toNumber() ?? 0,
         quantity: item.quantity.toNumber(),
         sectors: symbolProfile.sectors,
         symbol: item.symbol,
@@ -280,6 +282,8 @@ export class PortfolioService {
         marketPrice: undefined,
         maxPrice: undefined,
         minPrice: undefined,
+        netPerformance: undefined,
+        netPerformancePercent: undefined,
         quantity: undefined,
         symbol: aSymbol,
         transactionCount: undefined
@@ -325,7 +329,7 @@ export class PortfolioService {
         transactionCount
       } = position;
 
-      // Convert investment and gross performance to currency of user
+      // Convert investment, gross and net performance to currency of user
       const userCurrency = this.request.user.Settings.currency;
       const investment = this.exchangeRateDataService.toCurrency(
         position.investment.toNumber(),
@@ -337,6 +341,11 @@ export class PortfolioService {
         currency,
         userCurrency
       );
+      const netPerformance = this.exchangeRateDataService.toCurrency(
+        position.netPerformance.toNumber(),
+        currency,
+        userCurrency
+      );
 
       const historicalData = await this.dataProviderService.getHistorical(
         [aSymbol],
@@ -398,10 +407,12 @@ export class PortfolioService {
         marketPrice,
         maxPrice,
         minPrice,
+        netPerformance,
         transactionCount,
         averagePrice: averagePrice.toNumber(),
         grossPerformancePercent: position.grossPerformancePercentage.toNumber(),
         historicalData: historicalDataArray,
+        netPerformancePercent: position.netPerformancePercentage.toNumber(),
         quantity: quantity.toNumber(),
         symbol: aSymbol
       };
@@ -451,6 +462,8 @@ export class PortfolioService {
         grossPerformancePercent: undefined,
         historicalData: historicalDataArray,
         investment: 0,
+        netPerformance: undefined,
+        netPerformancePercent: undefined,
         quantity: 0,
         symbol: aSymbol,
         transactionCount: undefined
@@ -514,6 +527,9 @@ export class PortfolioService {
           investment: new Big(position.investment).toNumber(),
           marketState: dataProviderResponses[position.symbol].marketState,
           name: symbolProfileMap[position.symbol].name,
+          netPerformance: position.netPerformance?.toNumber() ?? null,
+          netPerformancePercentage:
+            position.netPerformancePercentage?.toNumber() ?? null,
           quantity: new Big(position.quantity).toNumber()
         };
       })
@@ -539,6 +555,8 @@ export class PortfolioService {
         performance: {
           currentGrossPerformance: 0,
           currentGrossPerformancePercent: 0,
+          currentNetPerformance: 0,
+          currentNetPerformancePercent: 0,
           currentValue: 0
         }
       };
@@ -558,11 +576,17 @@ export class PortfolioService {
       currentPositions.grossPerformance.toNumber();
     const currentGrossPerformancePercent =
       currentPositions.grossPerformancePercentage.toNumber();
+    const currentNetPerformance = currentPositions.netPerformance.toNumber();
+    const currentNetPerformancePercent =
+      currentPositions.netPerformancePercentage.toNumber();
+
     return {
       hasErrors: currentPositions.hasErrors || hasErrors,
       performance: {
         currentGrossPerformance,
         currentGrossPerformancePercent,
+        currentNetPerformance,
+        currentNetPerformancePercent,
         currentValue: currentValue
       }
     };
@@ -733,6 +757,8 @@ export class PortfolioService {
       marketPrice: 0,
       marketState: MarketState.open,
       name: 'Cash',
+      netPerformance: 0,
+      netPerformancePercent: 0,
       quantity: 0,
       sectors: [],
       symbol: ghostfolioCashSymbol,

apps/client/src/app/components/portfolio-performance/portfolio-performance.component.html

@@ -37,7 +37,7 @@
         [colorizeSign]="true"
         [isCurrency]="true"
         [locale]="locale"
-        [value]="isLoading ? undefined : performance?.currentGrossPerformance"
+        [value]="isLoading ? undefined : performance?.currentNetPerformance"
       ></gf-value>
     </div>
     <div class="col">
@@ -46,7 +46,7 @@
         [isPercent]="true"
         [locale]="locale"
         [value]="
-          isLoading ? undefined : performance?.currentGrossPerformancePercent
+          isLoading ? undefined : performance?.currentNetPerformancePercent
         "
       ></gf-value>
     </div>

apps/client/src/app/components/portfolio-performance/portfolio-performance.component.ts

@@ -52,7 +52,7 @@ export class PortfolioPerformanceComponent implements OnChanges, OnInit {
 
         new CountUp(
           'value',
-          this.performance?.currentGrossPerformancePercent * 100,
+          this.performance?.currentNetPerformancePercent * 100,
           {
             decimalPlaces: 2,
             duration: 0.75,

apps/client/src/app/components/portfolio-summary/portfolio-summary.component.html

@@ -9,23 +9,6 @@
   <div class="row">
     <div class="col"><hr /></div>
   </div>
-  <div class="row px-3">
-    <div class="d-flex flex-grow-1" i18n>
-      Fees for {{ summary?.ordersCount }} {summary?.ordersCount, plural, =1
-      {order} other {orders}}
-    </div>
-    <div class="d-flex justify-content-end">
-      <gf-value
-        class="justify-content-end"
-        [currency]="baseCurrency"
-        [locale]="locale"
-        [value]="isLoading ? undefined : summary?.fees"
-      ></gf-value>
-    </div>
-  </div>
-  <div class="row">
-    <div class="col"><hr /></div>
-  </div>
   <div class="row px-3 py-1">
     <div class="d-flex flex-grow-1" i18n>Buy</div>
     <div class="d-flex justify-content-end">
@@ -66,7 +49,7 @@
     </div>
   </div>
   <div class="row px-3 py-1">
-    <div class="d-flex flex-grow-1" i18n>Absolute Performance</div>
+    <div class="d-flex flex-grow-1" i18n>Absolute Gross Performance</div>
     <div class="d-flex justify-content-end">
       <gf-value
         class="justify-content-end"
@@ -77,7 +60,7 @@
     </div>
   </div>
   <div class="row px-3 py-1">
-    <div class="d-flex flex-grow-1 ml-3" i18n>Performance (TWR)</div>
+    <div class="d-flex flex-grow-1 ml-3" i18n>Gross Performance (TWR)</div>
     <div class="d-flex flex-column flex-wrap justify-content-end">
       <gf-value
         class="justify-content-end"
@@ -91,6 +74,48 @@
       ></gf-value>
     </div>
   </div>
+  <div class="row px-3 py-1">
+    <div class="d-flex flex-grow-1" i18n>
+      Fees for {{ summary?.ordersCount }} {summary?.ordersCount, plural, =1
+      {order} other {orders}}
+    </div>
+    <div class="d-flex justify-content-end">
+      <span *ngIf="summary?.fees || summary?.fees === 0" class="mr-1">-</span>
+      <gf-value
+        class="justify-content-end"
+        [currency]="baseCurrency"
+        [locale]="locale"
+        [value]="isLoading ? undefined : summary?.fees"
+      ></gf-value>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col"><hr /></div>
+  </div>
+  <div class="row px-3 py-1">
+    <div class="d-flex flex-grow-1" i18n>Absolute Net Performance</div>
+    <div class="d-flex justify-content-end">
+      <gf-value
+        class="justify-content-end"
+        [currency]="baseCurrency"
+        [locale]="locale"
+        [value]="isLoading ? undefined : summary?.currentNetPerformance"
+      ></gf-value>
+    </div>
+  </div>
+  <div class="row px-3 py-1">
+    <div class="d-flex flex-grow-1 ml-3" i18n>Net Performance (TWR)</div>
+    <div class="d-flex flex-column flex-wrap justify-content-end">
+      <gf-value
+        class="justify-content-end"
+        position="end"
+        [colorizeSign]="true"
+        [isPercent]="true"
+        [locale]="locale"
+        [value]="isLoading ? undefined : summary?.currentNetPerformancePercent"
+      ></gf-value>
+    </div>
+  </div>
   <div class="row">
     <div class="col"><hr /></div>
   </div>

apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.component.ts

@@ -34,6 +34,8 @@ export class PositionDetailDialog implements OnDestroy {
   public marketPrice: number;
   public maxPrice: number;
   public minPrice: number;
+  public netPerformance: number;
+  public netPerformancePercent: number;
   public quantity: number;
   public transactionCount: number;
 
@@ -60,6 +62,8 @@ export class PositionDetailDialog implements OnDestroy {
           marketPrice,
           maxPrice,
           minPrice,
+          netPerformance,
+          netPerformancePercent,
           quantity,
           transactionCount
         }) => {
@@ -86,6 +90,8 @@ export class PositionDetailDialog implements OnDestroy {
           this.marketPrice = marketPrice;
           this.maxPrice = maxPrice;
           this.minPrice = minPrice;
+          this.netPerformance = netPerformance;
+          this.netPerformancePercent = netPerformancePercent;
           this.quantity = quantity;
           this.transactionCount = transactionCount;
 

apps/client/src/app/components/position/position-detail-dialog/position-detail-dialog.html

@@ -25,7 +25,7 @@
           [colorizeSign]="true"
           [currency]="data.baseCurrency"
           [locale]="data.locale"
-          [value]="grossPerformance"
+          [value]="netPerformance"
         ></gf-value>
       </div>
       <div class="col-6 mb-3">
@@ -35,7 +35,7 @@
           [colorizeSign]="true"
           [isPercent]="true"
           [locale]="data.locale"
-          [value]="grossPerformancePercent"
+          [value]="netPerformancePercent"
         ></gf-value>
       </div>
       <div class="col-6 mb-3">

apps/client/src/app/components/position/position.component.html

@@ -11,7 +11,7 @@
           [isLoading]="isLoading"
           [marketState]="position?.marketState"
           [range]="range"
-          [value]="position?.grossPerformancePercentage"
+          [value]="position?.netPerformancePercentage"
         ></gf-trend-indicator>
       </div>
       <div *ngIf="isLoading" class="flex-grow-1">
@@ -47,13 +47,13 @@
             [colorizeSign]="true"
             [currency]="baseCurrency"
             [locale]="locale"
-            [value]="position?.grossPerformance"
+            [value]="position?.netPerformance"
           ></gf-value>
           <gf-value
             [colorizeSign]="true"
             [isPercent]="true"
             [locale]="locale"
-            [value]="position?.grossPerformancePercentage"
+            [value]="position?.netPerformancePercentage"
           ></gf-value>
         </div>
       </div>

apps/client/src/app/components/positions-table/positions-table.component.html

@@ -30,7 +30,7 @@
           [colorizeSign]="true"
           [isPercent]="true"
           [locale]="locale"
-          [value]="isLoading ? undefined : element.grossPerformancePercent"
+          [value]="isLoading ? undefined : element.netPerformancePercent"
         ></gf-value>
       </div>
     </td>

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

@@ -1,5 +1,7 @@
 export interface PortfolioPerformance {
   currentGrossPerformance: number;
   currentGrossPerformancePercent: number;
+  currentNetPerformance: number;
+  currentNetPerformancePercent: number;
   currentValue: number;
 }

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

@@ -20,6 +20,8 @@ export interface PortfolioPosition {
   marketPrice: number;
   marketState: MarketState;
   name: string;
+  netPerformance: number;
+  netPerformancePercent: number;
   quantity: number;
   sectors: Sector[];
   transactionCount: number;

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

@@ -13,6 +13,8 @@ export interface Position {
   marketPrice?: number;
   marketState?: MarketState;
   name?: string;
+  netPerformance?: number;
+  netPerformancePercentage?: number;
   quantity: number;
   symbol: string;
   transactionCount: number;