Feature/harmonize name column of historical market data table (#2632)

* Harmonize name column

* Update changelog

CHANGELOG.md

@@ -5,6 +5,12 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## Unreleased
+
+### Changed
+
+- Harmonized the name column in the historical market data table of the admin control panel
+
 ## 2.21.0 - 2023-11-09
 
 ### Changed

apps/client/src/app/components/admin-market-data/admin-market-data.component.ts

@@ -20,6 +20,7 @@ import { Filter, UniqueAsset, User } from '@ghostfolio/common/interfaces';
 import { AdminMarketDataItem } from '@ghostfolio/common/interfaces/admin-market-data.interface';
 import { translate } from '@ghostfolio/ui/i18n';
 import { AssetSubClass, DataSource, Prisma } from '@prisma/client';
+import { isUUID } from 'class-validator';
 import { DeviceDetectorService } from 'ngx-device-detector';
 import { Subject } from 'rxjs';
 import { distinctUntilChanged, switchMap, takeUntil } from 'rxjs/operators';
@@ -83,7 +84,7 @@ export class AdminMarketDataComponent
   public defaultDateFormat: string;
   public deviceType: string;
   public displayedColumns = [
-    'symbol',
+    'nameWithSymbol',
     'dataSource',
     'assetClass',
     'assetSubClass',
@@ -97,6 +98,7 @@ export class AdminMarketDataComponent
   ];
   public filters$ = new Subject<Filter[]>();
   public isLoading = false;
+  public isUUID = isUUID;
   public placeholder = '';
   public pageSize = DEFAULT_PAGE_SIZE;
   public totalItems = 0;

apps/client/src/app/components/admin-market-data/admin-market-data.html

@@ -28,6 +28,24 @@
           </td>
         </ng-container>
 
+        <ng-container matColumnDef="nameWithSymbol">
+          <th
+            *matHeaderCellDef
+            class="px-1"
+            mat-header-cell
+            mat-sort-header="symbol"
+          >
+            <ng-container i18n>Name</ng-container>
+          </th>
+          <td *matCellDef="let element" class="line-height-1 px-1" mat-cell>
+            <div class="text-truncate">{{ element.name }}</div>
+            <div *ngIf="!isUUID(element.symbol)">
+              <small class="text-muted">{{ element.symbol | gfSymbol }}</small>
+            </div>
+          </td>
+          <td *matFooterCellDef class="px-1" mat-footer-cell></td>
+        </ng-container>
+
         <ng-container matColumnDef="dataSource">
           <th *matHeaderCellDef class="px-1" mat-header-cell mat-sort-header>
             <ng-container i18n>Data Source</ng-container>

apps/client/src/app/components/admin-market-data/admin-market-data.module.ts

@@ -6,6 +6,7 @@ import { MatPaginatorModule } from '@angular/material/paginator';
 import { MatSortModule } from '@angular/material/sort';
 import { MatTableModule } from '@angular/material/table';
 import { RouterModule } from '@angular/router';
+import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
 import { GfActivitiesFilterModule } from '@ghostfolio/ui/activities-filter/activities-filter.module';
 import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
 
@@ -20,6 +21,7 @@ import { GfCreateAssetProfileDialogModule } from './create-asset-profile-dialog/
     GfActivitiesFilterModule,
     GfAssetProfileDialogModule,
     GfCreateAssetProfileDialogModule,
+    GfSymbolModule,
     MatButtonModule,
     MatMenuModule,
     MatPaginatorModule,