Move break down of performance to general availability

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

@@ -425,6 +425,10 @@ export class PortfolioController {
           return nullifyValuesInObject(item, ['totalInvestment', 'value']);
         }
       );
+      performanceInformation.performance = nullifyValuesInObject(
+        performanceInformation.performance,
+        ['currentNetPerformance', 'currentNetPerformancePercent']
+      );
     }
 
     return performanceInformation;

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

@@ -18,136 +18,149 @@
     </div>
   </div>
 
-  @if (user?.settings?.isExperimentalFeatures) {
-    <div class="mb-5 row">
-      <div class="col">
-        <mat-card appearance="outlined" class="mb-3">
-          <mat-card-content>
-            <div class="d-flex py-1">
-              <div class="flex-grow-1 mr-2 text-truncate" i18n>
-                Absolute Asset Performance
-              </div>
-              <div class="d-flex justify-content-end">
-                <gf-value
-                  class="justify-content-end"
-                  position="end"
-                  [isCurrency]="true"
-                  [locale]="user?.settings?.locale"
-                  [unit]="user?.settings?.baseCurrency"
-                  [value]="
-                    isLoadingInvestmentChart
-                      ? undefined
-                      : performance?.currentNetPerformance
-                  "
-                />
-              </div>
+  <div class="mb-5 row">
+    <div class="col">
+      <mat-card appearance="outlined" class="mb-3">
+        <mat-card-content>
+          <div class="d-flex py-1">
+            <div
+              class="align-items-center d-flex flex-grow-1 mr-2 text-truncate"
+              i18n
+            >
+              <span>Absolute Asset Performance</span>
+              <gf-premium-indicator
+                *ngIf="user?.subscription?.type === 'Basic'"
+                class="ml-1"
+              />
+            </div>
+            <div class="d-flex justify-content-end">
+              <gf-value
+                class="justify-content-end"
+                position="end"
+                [isCurrency]="true"
+                [locale]="user?.settings?.locale"
+                [unit]="user?.settings?.baseCurrency"
+                [value]="
+                  isLoadingInvestmentChart
+                    ? undefined
+                    : performance?.currentNetPerformance
+                "
+              />
+            </div>
+          </div>
+          <div class="d-flex mb-3 ml-3 py-1">
+            <div class="flex-grow-1 mr-2 text-truncate" i18n>
+              Asset Performance
+            </div>
+            <div class="d-flex justify-content-end">
+              <gf-value
+                class="justify-content-end"
+                position="end"
+                [colorizeSign]="true"
+                [isPercent]="true"
+                [locale]="user?.settings?.locale"
+                [value]="
+                  isLoadingInvestmentChart
+                    ? undefined
+                    : performance?.currentNetPerformancePercent
+                "
+              />
             </div>
-            <div class="d-flex mb-3 ml-3 py-1">
-              <div class="flex-grow-1 mr-2 text-truncate" i18n>
-                Asset Performance
-              </div>
-              <div class="d-flex justify-content-end">
-                <gf-value
-                  class="justify-content-end"
-                  position="end"
-                  [colorizeSign]="true"
-                  [isPercent]="true"
-                  [locale]="user?.settings?.locale"
-                  [value]="
-                    isLoadingInvestmentChart
-                      ? undefined
-                      : performance?.currentNetPerformancePercent
-                  "
-                />
-              </div>
+          </div>
+          <div class="d-flex py-1">
+            <div
+              class="align-items-center d-flex flex-grow-1 mr-2 text-truncate"
+              i18n
+            >
+              <span>Absolute Currency Performance</span>
+              <gf-premium-indicator
+                *ngIf="user?.subscription?.type === 'Basic'"
+                class="ml-1"
+              />
             </div>
-            <div class="d-flex py-1">
-              <div class="flex-grow-1 mr-2 text-truncate" i18n>
-                Absolute Currency Performance
-              </div>
-              <div class="d-flex justify-content-end">
-                <gf-value
-                  class="justify-content-end"
-                  position="end"
-                  [isCurrency]="true"
-                  [locale]="user?.settings?.locale"
-                  [unit]="user?.settings?.baseCurrency"
-                  [value]="
-                    isLoadingInvestmentChart
-                      ? undefined
-                      : performance?.currentNetPerformanceWithCurrencyEffect ===
-                          null
-                        ? null
-                        : performance?.currentNetPerformanceWithCurrencyEffect -
-                          performance?.currentNetPerformance
-                  "
-                />
-              </div>
+            <div class="d-flex justify-content-end">
+              <gf-value
+                class="justify-content-end"
+                position="end"
+                [isCurrency]="true"
+                [locale]="user?.settings?.locale"
+                [unit]="user?.settings?.baseCurrency"
+                [value]="
+                  isLoadingInvestmentChart
+                    ? undefined
+                    : performance?.currentNetPerformance === null
+                      ? null
+                      : performance?.currentNetPerformanceWithCurrencyEffect -
+                        performance?.currentNetPerformance
+                "
+              />
+            </div>
+          </div>
+          <div class="d-flex ml-3 py-1">
+            <div class="flex-grow-1 mr-2 text-truncate" i18n>
+              Currency Performance
             </div>
-            <div class="d-flex ml-3 py-1">
-              <div class="flex-grow-1 mr-2 text-truncate" i18n>
-                Currency Performance
-              </div>
-              <div class="d-flex justify-content-end">
-                <gf-value
-                  class="justify-content-end"
-                  position="end"
-                  [colorizeSign]="true"
-                  [isPercent]="true"
-                  [locale]="user?.settings?.locale"
-                  [value]="
-                    isLoadingInvestmentChart
-                      ? undefined
+            <div class="d-flex justify-content-end">
+              <gf-value
+                class="justify-content-end"
+                position="end"
+                [colorizeSign]="true"
+                [isPercent]="true"
+                [locale]="user?.settings?.locale"
+                [value]="
+                  isLoadingInvestmentChart
+                    ? undefined
+                    : performance?.currentNetPerformancePercent === null
+                      ? null
                       : performance?.currentNetPerformancePercentWithCurrencyEffect -
                         performance?.currentNetPerformancePercent
-                  "
-                />
-              </div>
+                "
+              />
             </div>
-            <div><hr /></div>
-            <div class="d-flex py-1">
-              <div class="flex-grow-1 mr-2 text-truncate" i18n>
-                Absolute Net Performance
-              </div>
-              <div class="d-flex justify-content-end">
-                <gf-value
-                  class="justify-content-end"
-                  position="end"
-                  [isCurrency]="true"
-                  [locale]="user?.settings?.locale"
-                  [unit]="user?.settings?.baseCurrency"
-                  [value]="
-                    isLoadingInvestmentChart
-                      ? undefined
-                      : performance?.currentNetPerformanceWithCurrencyEffect
-                  "
-                />
-              </div>
+          </div>
+          <div><hr /></div>
+          <div class="d-flex py-1">
+            <div class="flex-grow-1 mr-2 text-truncate" i18n>
+              Absolute Net Performance
             </div>
-            <div class="d-flex ml-3 py-1">
-              <div class="flex-grow-1 mr-2 text-truncate" i18n>
-                Net Performance
-              </div>
-              <div class="d-flex justify-content-end">
-                <gf-value
-                  class="justify-content-end"
-                  position="end"
-                  [colorizeSign]="true"
-                  [isPercent]="true"
-                  [locale]="user?.settings?.locale"
-                  [value]="
-                    isLoadingInvestmentChart
-                      ? undefined
-                      : performance?.currentNetPerformancePercentWithCurrencyEffect
-                  "
-                />
-              </div>
+            <div class="d-flex justify-content-end">
+              <gf-value
+                class="justify-content-end"
+                position="end"
+                [isCurrency]="true"
+                [locale]="user?.settings?.locale"
+                [unit]="user?.settings?.baseCurrency"
+                [value]="
+                  isLoadingInvestmentChart
+                    ? undefined
+                    : performance?.currentNetPerformanceWithCurrencyEffect
+                "
+              />
             </div>
-          </mat-card-content>
-        </mat-card>
-      </div>
+          </div>
+          <div class="d-flex ml-3 py-1">
+            <div class="flex-grow-1 mr-2 text-truncate" i18n>
+              Net Performance
+            </div>
+            <div class="d-flex justify-content-end">
+              <gf-value
+                class="justify-content-end"
+                position="end"
+                [colorizeSign]="true"
+                [isPercent]="true"
+                [locale]="user?.settings?.locale"
+                [value]="
+                  isLoadingInvestmentChart
+                    ? undefined
+                    : performance?.currentNetPerformancePercentWithCurrencyEffect
+                "
+              />
+            </div>
+          </div>
+        </mat-card-content>
+      </mat-card>
     </div>
-  }
+  </div>
 
   <div class="mb-5 row">
     <div class="col-md-6">

libs/ui/src/lib/value/value.component.html

@@ -21,7 +21,11 @@
             h4: size === 'medium'
           }"
         >
-          {{ formattedValue }}%
+          @if (value === null) {
+            <span class="text-monospace text-muted">*****</span>%
+          } @else {
+            {{ formattedValue }}%
+          }
         </div>
         <div
           *ngIf="!isPercent"
@@ -31,12 +35,11 @@
             h4: size === 'medium'
           }"
         >
-          <ng-container *ngIf="value === null">
+          @if (value === null) {
             <span class="text-monospace text-muted">*****</span>
-          </ng-container>
-          <ng-container *ngIf="value !== null">
+          } @else {
             {{ formattedValue }}
-          </ng-container>
+          }
         </div>
         <small *ngIf="unit && size === 'medium'" class="ml-1">
           {{ unit }}