Feature/simplify benchmark configuration (#1248)

* Simplify benchmark configuration

* Update changelog

apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.html

@@ -14,14 +14,13 @@
       <mat-label i18n>Compare with...</mat-label>
       <mat-select
         name="benchmark"
-        [compareWith]="compareUniqueAssets"
         [value]="benchmark"
         (selectionChange)="onChangeBenchmark($event.value)"
       >
         <mat-option
-          *ngFor="let currentBenchmark of benchmarks"
-          [value]="currentBenchmark"
-          >{{ currentBenchmark.symbol }}</mat-option
+          *ngFor="let symbolProfile of benchmarks"
+          [value]="symbolProfile.id"
+          >{{ symbolProfile.name }}</mat-option
         >
       </mat-select>
     </mat-form-field>

apps/client/src/app/components/benchmark-comparator/benchmark-comparator.component.ts

@@ -39,6 +39,7 @@ import {
   Tooltip
 } from 'chart.js';
 import annotationPlugin from 'chartjs-plugin-annotation';
+import { SymbolProfile } from '@prisma/client';
 
 @Component({
   selector: 'gf-benchmark-comparator',
@@ -48,14 +49,14 @@ import annotationPlugin from 'chartjs-plugin-annotation';
 })
 export class BenchmarkComparatorComponent implements OnChanges, OnDestroy {
   @Input() benchmarkDataItems: LineChartItem[] = [];
-  @Input() benchmark: UniqueAsset;
-  @Input() benchmarks: UniqueAsset[];
+  @Input() benchmark: string;
+  @Input() benchmarks: Partial<SymbolProfile>[];
   @Input() daysInMarket: number;
   @Input() locale: string;
   @Input() performanceDataItems: LineChartItem[];
   @Input() user: User;
 
-  @Output() benchmarkChanged = new EventEmitter<UniqueAsset>();
+  @Output() benchmarkChanged = new EventEmitter<string>();
   @Output() dateRangeChanged = new EventEmitter<DateRange>();
 
   @ViewChild('chartCanvas') chartCanvas;
@@ -85,18 +86,8 @@ export class BenchmarkComparatorComponent implements OnChanges, OnDestroy {
     }
   }
 
-  public compareUniqueAssets(
-    uniqueAsset1: UniqueAsset,
-    uniqueAsset2: UniqueAsset
-  ) {
-    return (
-      uniqueAsset1?.dataSource === uniqueAsset2?.dataSource &&
-      uniqueAsset1?.symbol === uniqueAsset2?.symbol
-    );
-  }
-
-  public onChangeBenchmark(benchmark: UniqueAsset) {
-    this.benchmarkChanged.next(benchmark);
+  public onChangeBenchmark(symbolProfileId: string) {
+    this.benchmarkChanged.next(symbolProfileId);
   }
 
   public onChangeDateRange(dateRange: DateRange) {

apps/client/src/app/pages/portfolio/analysis/analysis-page.component.ts

@@ -5,11 +5,11 @@ import { UserService } from '@ghostfolio/client/services/user/user.service';
 import {
   HistoricalDataItem,
   Position,
-  UniqueAsset,
   User
 } from '@ghostfolio/common/interfaces';
 import { InvestmentItem } from '@ghostfolio/common/interfaces/investment-item.interface';
 import { DateRange, GroupBy, ToggleOption } from '@ghostfolio/common/types';
+import { SymbolProfile } from '@prisma/client';
 import { differenceInDays } from 'date-fns';
 import { sortBy } from 'lodash';
 import { DeviceDetectorService } from 'ngx-device-detector';
@@ -24,7 +24,7 @@ import { takeUntil } from 'rxjs/operators';
 })
 export class AnalysisPageComponent implements OnDestroy, OnInit {
   public benchmarkDataItems: HistoricalDataItem[] = [];
-  public benchmarks: UniqueAsset[];
+  public benchmarks: Partial<SymbolProfile>[];
   public bottom3: Position[];
   public daysInMarket: number;
   public deviceType: string;
@@ -75,9 +75,9 @@ export class AnalysisPageComponent implements OnDestroy, OnInit {
       });
   }
 
-  public onChangeBenchmark(benchmark: UniqueAsset) {
+  public onChangeBenchmark(symbolProfileId: string) {
     this.dataService
-      .putUserSetting({ benchmark })
+      .putUserSetting({ benchmark: symbolProfileId })
       .pipe(takeUntil(this.unsubscribeSubject))
       .subscribe(() => {
         this.userService.remove();
@@ -179,9 +179,15 @@ export class AnalysisPageComponent implements OnDestroy, OnInit {
 
   private updateBenchmarkDataItems() {
     if (this.user.settings.benchmark) {
+      const { dataSource, symbol } =
+        this.benchmarks.find(({ id }) => {
+          return id === this.user.settings.benchmark;
+        }) ?? {};
+
       this.dataService
         .fetchBenchmarkBySymbol({
-          ...this.user.settings.benchmark,
+          dataSource,
+          symbol,
           startDate: this.firstOrderDate
         })
         .pipe(takeUntil(this.unsubscribeSubject))