From 715df765aeaf3e096e53349ec3edc64fc4342cff Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Wed, 19 Nov 2025 22:27:45 +0100
Subject: [PATCH] Extend summary by percentage values

---
 .../components/home-summary/home-summary.html |  1 +
 .../portfolio-summary.component.html          | 54 ++++++++++++++++---
 .../portfolio-summary.component.ts            | 21 ++++++++
 3 files changed, 69 insertions(+), 7 deletions(-)

diff --git a/apps/client/src/app/components/home-summary/home-summary.html b/apps/client/src/app/components/home-summary/home-summary.html
index a9e016c92..064923a04 100644
--- a/apps/client/src/app/components/home-summary/home-summary.html
+++ b/apps/client/src/app/components/home-summary/home-summary.html
@@ -7,6 +7,7 @@
           <gf-portfolio-summary
             [baseCurrency]="user?.settings?.baseCurrency"
             [deviceType]="deviceType"
+            [hasImpersonationId]="hasImpersonationId"
             [hasPermissionToUpdateUserSettings]="
               !hasImpersonationId && hasPermissionToUpdateUserSettings
             "
diff --git a/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.html b/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.html
index 0b2a9ea47..6fcd9d263 100644
--- a/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.html
+++ b/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.html
@@ -160,7 +160,21 @@
     </div>
   </div>
   <div class="flex-nowrap px-3 py-1 row">
-    <div class="flex-grow-1 text-truncate" i18n>Emergency Fund</div>
+    <div class="align-items-center d-flex flex-grow-1 text-truncate">
+      <ng-container i18n>Emergency Fund</ng-container>
+      @if (
+        !hasImpersonationId &&
+        summary?.totalValueInBaseCurrency > 0 &&
+        user?.settings?.isExperimentalFeatures
+      ) {
+        <gf-value
+          class="d-lg-inline-block d-none ml-2 small text-muted"
+          [isPercent]="true"
+          [locale]="locale"
+          [value]="isLoading ? undefined : emergencyFundPercentage"
+        />
+      }
+    </div>
     <div
       class="align-items-center d-flex justify-content-end"
       [ngClass]="{
@@ -223,10 +237,23 @@
     </div>
   </div>
   <div class="flex-nowrap px-3 py-1 row">
-    <div class="flex-grow-1 text-truncate" i18n>Buying Power</div>
-    <div class="justify-content-end">
+    <div class="align-items-center d-flex flex-grow-1 text-truncate">
+      <ng-container i18n>Buying Power</ng-container>
+      @if (
+        !hasImpersonationId &&
+        summary?.totalValueInBaseCurrency > 0 &&
+        user?.settings?.isExperimentalFeatures
+      ) {
+        <gf-value
+          class="d-lg-inline-block d-none ml-2 small text-muted"
+          [isPercent]="true"
+          [locale]="locale"
+          [value]="isLoading ? undefined : buyingPowerPercentage"
+        />
+      }
+    </div>
+    <div class="align-items-center d-flex justify-content-end">
       <gf-value
-        class="justify-content-end"
         [isCurrency]="true"
         [locale]="locale"
         [precision]="precision"
@@ -236,10 +263,23 @@
     </div>
   </div>
   <div class="flex-nowrap px-3 py-1 row">
-    <div class="flex-grow-1 text-truncate" i18n>Excluded from Analysis</div>
-    <div class="justify-content-end">
+    <div class="align-items-center d-flex flex-grow-1 text-truncate">
+      <ng-container i18n>Excluded from Analysis</ng-container>
+      @if (
+        !hasImpersonationId &&
+        summary?.totalValueInBaseCurrency > 0 &&
+        user?.settings?.isExperimentalFeatures
+      ) {
+        <gf-value
+          class="d-lg-inline-block d-none ml-2 small text-muted"
+          [isPercent]="true"
+          [locale]="locale"
+          [value]="isLoading ? undefined : excludedFromAnalysisPercentage"
+        />
+      }
+    </div>
+    <div class="align-items-center d-flex justify-content-end">
       <gf-value
-        class="justify-content-end"
         [isCurrency]="true"
         [locale]="locale"
         [precision]="precision"
diff --git a/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.ts b/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.ts
index 1719b20af..7eab9172e 100644
--- a/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.ts
+++ b/apps/client/src/app/components/portfolio-summary/portfolio-summary.component.ts
@@ -33,6 +33,7 @@ import {
 export class GfPortfolioSummaryComponent implements OnChanges {
   @Input() baseCurrency: string;
   @Input() deviceType: string;
+  @Input() hasImpersonationId: boolean;
   @Input() hasPermissionToUpdateUserSettings: boolean;
   @Input() isLoading: boolean;
   @Input() language: string;
@@ -49,6 +50,26 @@ export class GfPortfolioSummaryComponent implements OnChanges {
   public precision = 2;
   public timeInMarket: string;
 
+  public get buyingPowerPercentage() {
+    return this.summary?.totalValueInBaseCurrency
+      ? this.summary.cash / this.summary.totalValueInBaseCurrency
+      : 0;
+  }
+
+  public get emergencyFundPercentage() {
+    return this.summary?.totalValueInBaseCurrency
+      ? (this.summary.emergencyFund?.total || 0) /
+          this.summary.totalValueInBaseCurrency
+      : 0;
+  }
+
+  public get excludedFromAnalysisPercentage() {
+    return this.summary?.totalValueInBaseCurrency
+      ? this.summary.excludedAccountsAndActivities /
+          this.summary.totalValueInBaseCurrency
+      : 0;
+  }
+
   public constructor(private notificationService: NotificationService) {
     addIcons({ ellipsisHorizontalCircleOutline, informationCircleOutline });
   }