From 597843b7cf144d8545acea6b19f0622cd793ed9c Mon Sep 17 00:00:00 2001 From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com> Date: Sat, 21 Mar 2026 18:08:57 +0100 Subject: [PATCH] Prettify asset names --- .../top-holdings/top-holdings.component.html | 2 +- .../top-holdings/top-holdings.component.ts | 28 +++++++++++++------ 2 files changed, 21 insertions(+), 9 deletions(-) diff --git a/libs/ui/src/lib/top-holdings/top-holdings.component.html b/libs/ui/src/lib/top-holdings/top-holdings.component.html index 7a2a84126..6ff4ecf5b 100644 --- a/libs/ui/src/lib/top-holdings/top-holdings.component.html +++ b/libs/ui/src/lib/top-holdings/top-holdings.component.html @@ -16,7 +16,7 @@ Name -
{{ element?.name | titlecase }}
+
{{ prettifyAssetName(element?.name) }}
diff --git a/libs/ui/src/lib/top-holdings/top-holdings.component.ts b/libs/ui/src/lib/top-holdings/top-holdings.component.ts index 75a96fc5c..7c9ae033f 100644 --- a/libs/ui/src/lib/top-holdings/top-holdings.component.ts +++ b/libs/ui/src/lib/top-holdings/top-holdings.component.ts @@ -20,15 +20,14 @@ import { EventEmitter, Input, OnChanges, - OnDestroy, Output, ViewChild } from '@angular/core'; import { MatButtonModule } from '@angular/material/button'; import { MatPaginator, MatPaginatorModule } from '@angular/material/paginator'; import { MatTableDataSource, MatTableModule } from '@angular/material/table'; +import { capitalize } from 'lodash'; import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader'; -import { Subject } from 'rxjs'; import { GfValueComponent } from '../value/value.component'; @@ -58,7 +57,7 @@ import { GfValueComponent } from '../value/value.component'; styleUrls: ['./top-holdings.component.scss'], templateUrl: './top-holdings.component.html' }) -export class GfTopHoldingsComponent implements OnChanges, OnDestroy { +export class GfTopHoldingsComponent implements OnChanges { @Input() baseCurrency: string; @Input() locale = getLocale(); @Input() pageSize = Number.MAX_SAFE_INTEGER; @@ -76,8 +75,6 @@ export class GfTopHoldingsComponent implements OnChanges, OnDestroy { ]; public isLoading = true; - private unsubscribeSubject = new Subject(); - public ngOnChanges() { this.isLoading = true; @@ -101,8 +98,23 @@ export class GfTopHoldingsComponent implements OnChanges, OnDestroy { }); } - public ngOnDestroy() { - this.unsubscribeSubject.next(); - this.unsubscribeSubject.complete(); + public prettifyAssetName(name: string) { + if (!name) { + return ''; + } + + return name + .split(' ') + .filter((token) => { + return !token.startsWith('(') && !token.endsWith(')'); + }) + .map((token) => { + if (token.length <= 2) { + return token.toUpperCase(); + } + + return capitalize(token); + }) + .join(' '); } }