From 65b54dda2584afd0b40c7eb011e80c61eaed1474 Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Sat, 7 Jun 2025 08:52:32 +0200
Subject: [PATCH] Refactoring

---
 .../lib/benchmark/benchmark.component.html    |  8 +++---
 .../lib/benchmark/benchmark.component.scss    | 10 ++++++++
 .../src/lib/benchmark/benchmark.component.ts  | 25 ++++---------------
 3 files changed, 19 insertions(+), 24 deletions(-)

diff --git a/libs/ui/src/lib/benchmark/benchmark.component.html b/libs/ui/src/lib/benchmark/benchmark.component.html
index 29aebc75c..b11a76507 100644
--- a/libs/ui/src/lib/benchmark/benchmark.component.html
+++ b/libs/ui/src/lib/benchmark/benchmark.component.html
@@ -3,9 +3,9 @@
     class="gf-table w-100"
     mat-table
     matSort
+    matSortActive="name"
+    matSortDirection="asc"
     [dataSource]="dataSource"
-    [matSortActive]="sortColumn"
-    [matSortDirection]="sortDirection"
   >
     <ng-container matColumnDef="name">
       <th *matHeaderCellDef class="px-2" i18n mat-header-cell mat-sort-header>
@@ -102,9 +102,9 @@
     <ng-container matColumnDef="change">
       <th
         *matHeaderCellDef
-        class="px-2 text-right"
+        class="px-2 justify-content-end"
         mat-header-cell
-        mat-sort-header
+        mat-sort-header="performances.allTimeHigh.performancePercent"
       >
         <span class="d-none d-sm-block text-nowrap" i18n
           >Change from All Time High</span
diff --git a/libs/ui/src/lib/benchmark/benchmark.component.scss b/libs/ui/src/lib/benchmark/benchmark.component.scss
index 5d4e87f30..990b8b294 100644
--- a/libs/ui/src/lib/benchmark/benchmark.component.scss
+++ b/libs/ui/src/lib/benchmark/benchmark.component.scss
@@ -1,3 +1,13 @@
 :host {
   display: block;
+
+  .gf-table {
+    th {
+      ::ng-deep {
+        .mat-sort-header-container {
+          justify-content: inherit;
+        }
+      }
+    }
+  }
 }
diff --git a/libs/ui/src/lib/benchmark/benchmark.component.ts b/libs/ui/src/lib/benchmark/benchmark.component.ts
index 0fb404ffd..7269bb70c 100644
--- a/libs/ui/src/lib/benchmark/benchmark.component.ts
+++ b/libs/ui/src/lib/benchmark/benchmark.component.ts
@@ -12,7 +12,6 @@ import { GfValueComponent } from '@ghostfolio/ui/value';
 
 import { CommonModule } from '@angular/common';
 import {
-  AfterViewInit,
   CUSTOM_ELEMENTS_SCHEMA,
   ChangeDetectionStrategy,
   Component,
@@ -26,7 +25,7 @@ import {
 import { MatButtonModule } from '@angular/material/button';
 import { MatDialog } from '@angular/material/dialog';
 import { MatMenuModule } from '@angular/material/menu';
-import { MatSort, MatSortModule, SortDirection } from '@angular/material/sort';
+import { MatSort, MatSortModule } from '@angular/material/sort';
 import { MatTableDataSource, MatTableModule } from '@angular/material/table';
 import { ActivatedRoute, Router, RouterModule } from '@angular/router';
 import { get, isNumber } from 'lodash';
@@ -54,9 +53,7 @@ import { BenchmarkDetailDialogParams } from './benchmark-detail-dialog/interface
   styleUrls: ['./benchmark.component.scss'],
   templateUrl: './benchmark.component.html'
 })
-export class GfBenchmarkComponent
-  implements AfterViewInit, OnChanges, OnDestroy
-{
+export class GfBenchmarkComponent implements OnChanges, OnDestroy {
   @Input() benchmarks: Benchmark[];
   @Input() deviceType: string;
   @Input() hasPermissionToDeleteItem: boolean;
@@ -78,8 +75,6 @@ export class GfBenchmarkComponent
   public isLoading = true;
   public isNumber = isNumber;
   public resolveMarketCondition = resolveMarketCondition;
-  public sortColumn = 'name';
-  public sortDirection: SortDirection = 'asc';
   public translate = translate;
 
   private unsubscribeSubject = new Subject<void>();
@@ -106,22 +101,12 @@ export class GfBenchmarkComponent
       });
   }
 
-  ngAfterViewInit() {
-    this.dataSource.sort = this.sort;
-
-    this.dataSource.sortingDataAccessor = (item, property) => {
-      switch (property) {
-        case 'change':
-          return item.performances?.allTimeHigh?.performancePercent;
-        default:
-          return get(item, property);
-      }
-    };
-  }
-
   public ngOnChanges() {
     if (this.benchmarks) {
       this.dataSource.data = this.benchmarks;
+      this.dataSource.sort = this.sort;
+      this.dataSource.sortingDataAccessor = get;
+
       this.isLoading = false;
     }