Fixed the comments and formatted

apps/client/src/app/components/account-detail-dialog/account-detail-dialog.component.scss

@@ -3,9 +3,9 @@
 
   .mat-mdc-dialog-content {
     max-height: unset;
-  }
 
     .chart-container {
       aspect-ratio: 16 / 9;
     }
+  }
 }

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

@@ -38,7 +38,7 @@ export class AccountDetailDialog implements OnDestroy, OnInit {
   public isLoadingBenchmarkComparator: boolean;
   public name: string;
   public orders: OrderWithAccount[];
-  public performanceDataItems: HistoricalDataItem[];
+  public historicalDataItems: HistoricalDataItem[];
   public platformName: string;
   public transactionCount: number;
   public user: User;
@@ -60,8 +60,6 @@ export class AccountDetailDialog implements OnDestroy, OnInit {
         if (state?.user) {
           this.user = state.user;
 
-          this.update();
-
           this.changeDetectorRef.markForCheck();
         }
       });
@@ -114,6 +112,32 @@ export class AccountDetailDialog implements OnDestroy, OnInit {
       .subscribe(({ activities }) => {
         this.orders = activities;
 
+        this.changeDetectorRef.markForCheck();
+      });
+
+    this.dataService
+      .fetchPortfolioPerformance({
+        filters: [
+          {
+            id: this.data.accountId,
+            type: 'ACCOUNT'
+          }
+        ],
+        range: 'max'
+      })
+      .pipe(takeUntil(this.unsubscribeSubject))
+      .subscribe(({ chart, firstOrderDate }) => {
+        this.daysInMarket = differenceInDays(new Date(), firstOrderDate);
+
+        this.historicalDataItems = [];
+
+        chart.forEach(({ date, value, valueInPercentage }) => {
+          this.historicalDataItems.push({
+            date,
+            value: this.hasImpersonationId ? valueInPercentage : value
+          });
+        });
+
         this.changeDetectorRef.markForCheck();
       });
   }
@@ -148,35 +172,4 @@ export class AccountDetailDialog implements OnDestroy, OnInit {
     this.unsubscribeSubject.next();
     this.unsubscribeSubject.complete();
   }
-
-  private update() {
-    this.isLoadingBenchmarkComparator = false;
-
-    this.dataService
-      .fetchPortfolioPerformance({
-        range: this.user?.settings?.dateRange
-      })
-      .pipe(takeUntil(this.unsubscribeSubject))
-      .subscribe(({ chart, firstOrderDate }) => {
-        this.daysInMarket = differenceInDays(new Date(), firstOrderDate);
-
-        this.performanceDataItems = [];
-
-        for (const [
-          index,
-          { date, value, valueInPercentage }
-        ] of chart.entries()) {
-          if (index > 0 || this.user?.settings?.dateRange === 'max') {
-            // Ignore first item where value is 0
-            this.performanceDataItems.push({
-              date,
-              value: isNumber(value) ? value : valueInPercentage
-            });
-          }
-        }
-        this.changeDetectorRef.markForCheck();
-      });
-
-    this.changeDetectorRef.markForCheck();
-  }
 }

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

@@ -24,12 +24,10 @@
       <gf-investment-chart
         class="h-100"
         [currency]="user?.settings?.baseCurrency"
-        [daysInMarket]="daysInMarket"
-        [historicalDataItems]="performanceDataItems"
+        [historicalDataItems]="historicalDataItems"
         [isInPercent]="hasImpersonationId || user.settings.isRestrictedView"
         [isLoading]="isLoadingBenchmarkComparator"
         [locale]="user?.settings?.locale"
-        [range]="user?.settings?.dateRange"
       ></gf-investment-chart>
     </div>