From a229c4879da4b9e717e887b273c0a9a86c886987 Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Sat, 23 Nov 2024 09:59:14 +0100
Subject: [PATCH] Clean up

---
 .../top-holdings/top-holdings.component.html  | 19 +++++++++++++++----
 .../top-holdings/top-holdings.component.ts    |  2 ++
 2 files changed, 17 insertions(+), 4 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 f5a7d3cb8..d42d742b2 100644
--- a/libs/ui/src/lib/top-holdings/top-holdings.component.html
+++ b/libs/ui/src/lib/top-holdings/top-holdings.component.html
@@ -60,7 +60,11 @@
       >
         <div [@detailExpand]="element.expand ? 'expanded' : 'collapsed'">
           <div class="holding-parents-table">
-            <table class="gf-table" mat-table [dataSource]="element.parents">
+            <table
+              class="gf-table w-100"
+              mat-table
+              [dataSource]="element.parents"
+            >
               <colgroup>
                 <col class="w-100" />
                 <col />
@@ -69,8 +73,15 @@
 
               <ng-container matColumnDef="name">
                 <td *matCellDef="let parentHolding" class="px-2" mat-cell>
-                  <div class="text-truncate">
-                    {{ parentHolding?.name }}
+                  <div
+                    class="align-items-center d-flex line-height-1 text-nowrap"
+                  >
+                    <div>{{ parentHolding?.name }}</div>
+                  </div>
+                  <div>
+                    <small class="text-muted">{{
+                      parentHolding?.symbol | gfSymbol
+                    }}</small>
                   </div>
                 </td>
                 <td *matFooterCellDef class="px-2" mat-footer-cell>
@@ -91,7 +102,7 @@
                   <ng-container i18n>Value</ng-container>
                 </td>
               </ng-container>
-              <ng-container matColumnDef="allocationInPercentage">
+              <ng-container matColumnDef="allocationInPercentage" stickyEnd>
                 <td *matCellDef="let parentHolding" mat-cell>
                   <div class="d-flex justify-content-end">
                     <gf-value
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 400c68da5..3d3712bcc 100644
--- a/libs/ui/src/lib/top-holdings/top-holdings.component.ts
+++ b/libs/ui/src/lib/top-holdings/top-holdings.component.ts
@@ -1,3 +1,4 @@
+import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
 import { getLocale } from '@ghostfolio/common/helper';
 import {
   AssetProfileIdentifier,
@@ -46,6 +47,7 @@ import { Subject } from 'rxjs';
   changeDetection: ChangeDetectionStrategy.OnPush,
   imports: [
     CommonModule,
+    GfSymbolModule,
     GfValueComponent,
     MatButtonModule,
     MatPaginatorModule,