From 83e2b000bb732ca4bc2ed577f4684d19e04790d7 Mon Sep 17 00:00:00 2001
From: Thomas Kaul <4159106+dtslvr@users.noreply.github.com>
Date: Sat, 6 Apr 2024 13:01:49 +0200
Subject: [PATCH] Refactor symbol icon module to asset profile icon component

---
 .../accounts-table/accounts-table.component.html    |  4 ++--
 .../accounts-table/accounts-table.module.ts         |  4 ++--
 .../asset-profile-dialog/asset-profile-dialog.html  |  2 +-
 .../asset-profile-dialog.module.ts                  |  4 ++--
 .../admin-platform/admin-platform.component.html    |  2 +-
 .../admin-platform/admin-platform.module.ts         |  4 ++--
 .../create-or-update-platform-dialog.html           |  6 +++++-
 .../create-or-update-platform-dialog.module.ts      |  4 ++--
 .../asset-profile-icon.component.html               |  8 ++++++++
 .../asset-profile-icon.component.scss}              |  0
 .../asset-profile-icon.component.ts}                | 13 +++++++++----
 .../symbol-icon/symbol-icon.component.html          |  7 -------
 .../components/symbol-icon/symbol-icon.module.ts    | 12 ------------
 .../create-or-update-account-dialog.html            |  2 +-
 .../create-or-update-account-dialog.module.ts       |  4 ++--
 .../transfer-balance/transfer-balance-dialog.html   |  4 ++--
 .../transfer-balance-dialog.module.ts               |  4 ++--
 .../create-or-update-activity-dialog.html           |  2 +-
 .../create-or-update-activity-dialog.module.ts      |  4 ++--
 .../activities-table.component.html                 |  4 ++--
 .../lib/activities-table/activities-table.module.ts |  4 ++--
 libs/ui/src/lib/assistant/assistant.html            |  2 +-
 libs/ui/src/lib/assistant/assistant.module.ts       |  4 ++--
 .../holdings-table/holdings-table.component.html    |  2 +-
 .../src/lib/holdings-table/holdings-table.module.ts |  4 ++--
 25 files changed, 54 insertions(+), 56 deletions(-)
 create mode 100644 apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.html
 rename apps/client/src/app/components/{symbol-icon/symbol-icon.component.scss => asset-profile-icon/asset-profile-icon.component.scss} (100%)
 rename apps/client/src/app/components/{symbol-icon/symbol-icon.component.ts => asset-profile-icon/asset-profile-icon.component.ts} (63%)
 delete mode 100644 apps/client/src/app/components/symbol-icon/symbol-icon.component.html
 delete mode 100644 apps/client/src/app/components/symbol-icon/symbol-icon.module.ts

diff --git a/apps/client/src/app/components/accounts-table/accounts-table.component.html b/apps/client/src/app/components/accounts-table/accounts-table.component.html
index cd4f139c4..241b5d90a 100644
--- a/apps/client/src/app/components/accounts-table/accounts-table.component.html
+++ b/apps/client/src/app/components/accounts-table/accounts-table.component.html
@@ -34,7 +34,7 @@
       <ng-container i18n>Name</ng-container>
     </th>
     <td *matCellDef="let element" class="px-1" mat-cell>
-      <gf-symbol-icon
+      <gf-asset-profile-icon
         *ngIf="element.Platform?.url"
         class="d-inline d-sm-none mr-1"
         [tooltip]="element.Platform?.name"
@@ -73,7 +73,7 @@
     </th>
     <td *matCellDef="let element" class="d-none d-lg-table-cell px-1" mat-cell>
       <div class="d-flex">
-        <gf-symbol-icon
+        <gf-asset-profile-icon
           *ngIf="element.Platform?.url"
           class="mr-1"
           [tooltip]="element.Platform?.name"
diff --git a/apps/client/src/app/components/accounts-table/accounts-table.module.ts b/apps/client/src/app/components/accounts-table/accounts-table.module.ts
index 259e839a4..bae24fda3 100644
--- a/apps/client/src/app/components/accounts-table/accounts-table.module.ts
+++ b/apps/client/src/app/components/accounts-table/accounts-table.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 import { GfValueModule } from '@ghostfolio/ui/value';
 
 import { CommonModule } from '@angular/common';
@@ -17,7 +17,7 @@ import { AccountsTableComponent } from './accounts-table.component';
   exports: [AccountsTableComponent],
   imports: [
     CommonModule,
-    GfSymbolIconModule,
+    GfAssetProfileIconComponent,
     GfValueModule,
     MatButtonModule,
     MatMenuModule,
diff --git a/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html b/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html
index 0cfb42785..b0b57df09 100644
--- a/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html
+++ b/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.html
@@ -339,7 +339,7 @@
         <mat-label i18n>Url</mat-label>
         <input formControlName="url" matInput type="text" />
         @if (assetProfileForm.controls['url'].value) {
-          <gf-symbol-icon
+          <gf-asset-profile-icon
             class="mr-3"
             matSuffix
             [url]="assetProfileForm.controls['url'].value"
diff --git a/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.module.ts b/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.module.ts
index 76266205f..ffde6c0ae 100644
--- a/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.module.ts
+++ b/apps/client/src/app/components/admin-market-data/asset-profile-dialog/asset-profile-dialog.module.ts
@@ -1,6 +1,6 @@
 import { GfAdminMarketDataDetailModule } from '@ghostfolio/client/components/admin-market-data-detail/admin-market-data-detail.module';
 import { AdminMarketDataService } from '@ghostfolio/client/components/admin-market-data/admin-market-data.service';
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 import { GfCurrencySelectorModule } from '@ghostfolio/ui/currency-selector/currency-selector.module';
 import { GfPortfolioProportionChartModule } from '@ghostfolio/ui/portfolio-proportion-chart/portfolio-proportion-chart.module';
 import { GfValueModule } from '@ghostfolio/ui/value';
@@ -25,9 +25,9 @@ import { AssetProfileDialog } from './asset-profile-dialog.component';
     CommonModule,
     FormsModule,
     GfAdminMarketDataDetailModule,
+    GfAssetProfileIconComponent,
     GfCurrencySelectorModule,
     GfPortfolioProportionChartModule,
-    GfSymbolIconModule,
     GfValueModule,
     MatButtonModule,
     MatCheckboxModule,
diff --git a/apps/client/src/app/components/admin-platform/admin-platform.component.html b/apps/client/src/app/components/admin-platform/admin-platform.component.html
index ecf3304cf..dc51f86cc 100644
--- a/apps/client/src/app/components/admin-platform/admin-platform.component.html
+++ b/apps/client/src/app/components/admin-platform/admin-platform.component.html
@@ -30,7 +30,7 @@
             <ng-container i18n>Name</ng-container>
           </th>
           <td *matCellDef="let element" class="px-1" mat-cell>
-            <gf-symbol-icon
+            <gf-asset-profile-icon
               *ngIf="element.url"
               class="d-inline mr-1"
               [tooltip]="element.name"
diff --git a/apps/client/src/app/components/admin-platform/admin-platform.module.ts b/apps/client/src/app/components/admin-platform/admin-platform.module.ts
index fe7b5985b..e98d53988 100644
--- a/apps/client/src/app/components/admin-platform/admin-platform.module.ts
+++ b/apps/client/src/app/components/admin-platform/admin-platform.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@@ -16,8 +16,8 @@ import { GfCreateOrUpdatePlatformDialogModule } from './create-or-update-platfor
   exports: [AdminPlatformComponent],
   imports: [
     CommonModule,
+    GfAssetProfileIconComponent,
     GfCreateOrUpdatePlatformDialogModule,
-    GfSymbolIconModule,
     MatButtonModule,
     MatMenuModule,
     MatSortModule,
diff --git a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
index 780308130..bcd3d0340 100644
--- a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
+++ b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.html
@@ -13,7 +13,11 @@
         <mat-label i18n>Url</mat-label>
         <input matInput name="url" required [(ngModel)]="data.platform.url" />
         @if (data.platform.url) {
-          <gf-symbol-icon class="mr-3" matSuffix [url]="data.platform.url" />
+          <gf-asset-profile-icon
+            class="mr-3"
+            matSuffix
+            [url]="data.platform.url"
+          />
         }
       </mat-form-field>
     </div>
diff --git a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.module.ts b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.module.ts
index 1b7c0bd8f..ac97e57cf 100644
--- a/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.module.ts
+++ b/apps/client/src/app/components/admin-platform/create-or-update-platform-dialog/create-or-update-platform-dialog.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
@@ -14,7 +14,7 @@ import { CreateOrUpdatePlatformDialog } from './create-or-update-platform-dialog
   declarations: [CreateOrUpdatePlatformDialog],
   imports: [
     CommonModule,
-    GfSymbolIconModule,
+    GfAssetProfileIconComponent,
     FormsModule,
     MatButtonModule,
     MatDialogModule,
diff --git a/apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.html b/apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.html
new file mode 100644
index 000000000..f0abad285
--- /dev/null
+++ b/apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.html
@@ -0,0 +1,8 @@
+@if (src) {
+  <img
+    onerror="this.style.display='none'"
+    [ngClass]="{ large: size === 'large' }"
+    [src]="src"
+    [title]="tooltip ? tooltip : ''"
+  />
+}
diff --git a/apps/client/src/app/components/symbol-icon/symbol-icon.component.scss b/apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.scss
similarity index 100%
rename from apps/client/src/app/components/symbol-icon/symbol-icon.component.scss
rename to apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.scss
diff --git a/apps/client/src/app/components/symbol-icon/symbol-icon.component.ts b/apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.ts
similarity index 63%
rename from apps/client/src/app/components/symbol-icon/symbol-icon.component.ts
rename to apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.ts
index a6fa0901a..4d96ef83f 100644
--- a/apps/client/src/app/components/symbol-icon/symbol-icon.component.ts
+++ b/apps/client/src/app/components/asset-profile-icon/asset-profile-icon.component.ts
@@ -1,4 +1,6 @@
+import { CommonModule } from '@angular/common';
 import {
+  CUSTOM_ELEMENTS_SCHEMA,
   ChangeDetectionStrategy,
   Component,
   Input,
@@ -7,12 +9,15 @@ import {
 import { DataSource } from '@prisma/client';
 
 @Component({
-  selector: 'gf-symbol-icon',
   changeDetection: ChangeDetectionStrategy.OnPush,
-  templateUrl: './symbol-icon.component.html',
-  styleUrls: ['./symbol-icon.component.scss']
+  imports: [CommonModule],
+  schemas: [CUSTOM_ELEMENTS_SCHEMA],
+  selector: 'gf-asset-profile-icon',
+  standalone: true,
+  styleUrls: ['./asset-profile-icon.component.scss'],
+  templateUrl: './asset-profile-icon.component.html'
 })
-export class SymbolIconComponent implements OnChanges {
+export class GfAssetProfileIconComponent implements OnChanges {
   @Input() dataSource: DataSource;
   @Input() size: 'large';
   @Input() symbol: string;
diff --git a/apps/client/src/app/components/symbol-icon/symbol-icon.component.html b/apps/client/src/app/components/symbol-icon/symbol-icon.component.html
deleted file mode 100644
index 0aebd0e5b..000000000
--- a/apps/client/src/app/components/symbol-icon/symbol-icon.component.html
+++ /dev/null
@@ -1,7 +0,0 @@
-<img
-  *ngIf="src"
-  onerror="this.style.display='none'"
-  [ngClass]="{ large: size === 'large' }"
-  [src]="src"
-  [title]="tooltip ? tooltip : ''"
-/>
diff --git a/apps/client/src/app/components/symbol-icon/symbol-icon.module.ts b/apps/client/src/app/components/symbol-icon/symbol-icon.module.ts
deleted file mode 100644
index 8eee9ef0c..000000000
--- a/apps/client/src/app/components/symbol-icon/symbol-icon.module.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { CommonModule } from '@angular/common';
-import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
-
-import { SymbolIconComponent } from './symbol-icon.component';
-
-@NgModule({
-  declarations: [SymbolIconComponent],
-  exports: [SymbolIconComponent],
-  imports: [CommonModule],
-  schemas: [CUSTOM_ELEMENTS_SCHEMA]
-})
-export class GfSymbolIconModule {}
diff --git a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html
index 9ff61d0c2..e2981462f 100644
--- a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html
+++ b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.html
@@ -61,7 +61,7 @@
           ) {
             <mat-option [value]="platformEntry">
               <span class="d-flex">
-                <gf-symbol-icon
+                <gf-asset-profile-icon
                   class="mr-1"
                   [tooltip]="platformEntry.name"
                   [url]="platformEntry.url"
diff --git a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts
index 44d3b6847..e2ea5d091 100644
--- a/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts
+++ b/apps/client/src/app/pages/accounts/create-or-update-account-dialog/create-or-update-account-dialog.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 import { GfCurrencySelectorModule } from '@ghostfolio/ui/currency-selector/currency-selector.module';
 
 import { CommonModule } from '@angular/common';
@@ -18,8 +18,8 @@ import { CreateOrUpdateAccountDialog } from './create-or-update-account-dialog.c
   imports: [
     CommonModule,
     FormsModule,
+    GfAssetProfileIconComponent,
     GfCurrencySelectorModule,
-    GfSymbolIconModule,
     MatAutocompleteModule,
     MatButtonModule,
     MatCheckboxModule,
diff --git a/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.html b/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.html
index d2e9a03c2..9ff69fdb7 100644
--- a/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.html
+++ b/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.html
@@ -12,7 +12,7 @@
         <mat-select formControlName="fromAccount">
           <mat-option *ngFor="let account of accounts" [value]="account.id">
             <div class="d-flex">
-              <gf-symbol-icon
+              <gf-asset-profile-icon
                 *ngIf="account.Platform?.url"
                 class="mr-1"
                 [tooltip]="account.Platform?.name"
@@ -29,7 +29,7 @@
         <mat-select formControlName="toAccount">
           <mat-option *ngFor="let account of accounts" [value]="account.id">
             <div class="d-flex">
-              <gf-symbol-icon
+              <gf-asset-profile-icon
                 *ngIf="account.Platform?.url"
                 class="mr-1"
                 [tooltip]="account.Platform?.name"
diff --git a/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.module.ts b/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.module.ts
index e0f1f574d..b83ccbb9d 100644
--- a/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.module.ts
+++ b/apps/client/src/app/pages/accounts/transfer-balance/transfer-balance-dialog.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 
 import { CommonModule } from '@angular/common';
 import { NgModule } from '@angular/core';
@@ -15,7 +15,7 @@ import { TransferBalanceDialog } from './transfer-balance-dialog.component';
   declarations: [TransferBalanceDialog],
   imports: [
     CommonModule,
-    GfSymbolIconModule,
+    GfAssetProfileIconComponent,
     MatButtonModule,
     MatDialogModule,
     MatFormFieldModule,
diff --git a/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.html b/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.html
index 81c41a316..9491a440e 100644
--- a/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.html
+++ b/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.html
@@ -94,7 +94,7 @@
             [value]="account.id"
           >
             <div class="d-flex">
-              <gf-symbol-icon
+              <gf-asset-profile-icon
                 *ngIf="account.Platform?.url"
                 class="mr-1"
                 [tooltip]="account.Platform?.name"
diff --git a/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.module.ts b/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.module.ts
index da834fda6..0d258f1ca 100644
--- a/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.module.ts
+++ b/apps/client/src/app/pages/portfolio/activities/create-or-update-activity-dialog/create-or-update-activity-dialog.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 import { GfSymbolAutocompleteModule } from '@ghostfolio/ui/symbol-autocomplete/symbol-autocomplete.module';
 import { GfValueModule } from '@ghostfolio/ui/value';
 
@@ -22,8 +22,8 @@ import { CreateOrUpdateActivityDialog } from './create-or-update-activity-dialog
   imports: [
     CommonModule,
     FormsModule,
+    GfAssetProfileIconComponent,
     GfSymbolAutocompleteModule,
-    GfSymbolIconModule,
     GfValueModule,
     MatAutocompleteModule,
     MatButtonModule,
diff --git a/libs/ui/src/lib/activities-table/activities-table.component.html b/libs/ui/src/lib/activities-table/activities-table.component.html
index 626af4519..4a1b1004d 100644
--- a/libs/ui/src/lib/activities-table/activities-table.component.html
+++ b/libs/ui/src/lib/activities-table/activities-table.component.html
@@ -122,7 +122,7 @@
     <ng-container matColumnDef="icon">
       <th *matHeaderCellDef class="px-1" mat-header-cell></th>
       <td *matCellDef="let element" class="px-1 text-center" mat-cell>
-        <gf-symbol-icon
+        <gf-asset-profile-icon
           [dataSource]="element.SymbolProfile?.dataSource"
           [symbol]="element.SymbolProfile?.symbol"
           [tooltip]="element.SymbolProfile?.name"
@@ -308,7 +308,7 @@
       <td *matCellDef="let element" class="px-1" mat-cell>
         <div class="d-flex">
           @if (element.Account?.Platform?.url) {
-            <gf-symbol-icon
+            <gf-asset-profile-icon
               class="mr-1"
               [tooltip]="element.Account?.Platform?.name"
               [url]="element.Account?.Platform?.url"
diff --git a/libs/ui/src/lib/activities-table/activities-table.module.ts b/libs/ui/src/lib/activities-table/activities-table.module.ts
index 589761cdf..1d80c9fb0 100644
--- a/libs/ui/src/lib/activities-table/activities-table.module.ts
+++ b/libs/ui/src/lib/activities-table/activities-table.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
 import { GfActivityTypeModule } from '@ghostfolio/ui/activity-type';
 import { GfNoTransactionsInfoModule } from '@ghostfolio/ui/no-transactions-info';
@@ -24,8 +24,8 @@ import { ActivitiesTableComponent } from './activities-table.component';
   imports: [
     CommonModule,
     GfActivityTypeModule,
+    GfAssetProfileIconComponent,
     GfNoTransactionsInfoModule,
-    GfSymbolIconModule,
     GfSymbolModule,
     GfValueModule,
     MatButtonModule,
diff --git a/libs/ui/src/lib/assistant/assistant.html b/libs/ui/src/lib/assistant/assistant.html
index 77ca9627b..76808cf37 100644
--- a/libs/ui/src/lib/assistant/assistant.html
+++ b/libs/ui/src/lib/assistant/assistant.html
@@ -110,7 +110,7 @@
               @for (account of accounts; track account.id) {
                 <mat-option [value]="account.id">
                   <div class="d-flex">
-                    <gf-symbol-icon
+                    <gf-asset-profile-icon
                       *ngIf="account.Platform?.url"
                       class="mr-1"
                       [tooltip]="account.Platform?.name"
diff --git a/libs/ui/src/lib/assistant/assistant.module.ts b/libs/ui/src/lib/assistant/assistant.module.ts
index 6177531b8..031f57f46 100644
--- a/libs/ui/src/lib/assistant/assistant.module.ts
+++ b/libs/ui/src/lib/assistant/assistant.module.ts
@@ -1,4 +1,4 @@
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 
 import { CommonModule } from '@angular/common';
 import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@@ -18,8 +18,8 @@ import { AssistantComponent } from './assistant.component';
   imports: [
     CommonModule,
     FormsModule,
+    GfAssetProfileIconComponent,
     GfAssistantListItemModule,
-    GfSymbolIconModule,
     MatButtonModule,
     MatFormFieldModule,
     MatSelectModule,
diff --git a/libs/ui/src/lib/holdings-table/holdings-table.component.html b/libs/ui/src/lib/holdings-table/holdings-table.component.html
index 17e7c9f36..8c0bca20f 100644
--- a/libs/ui/src/lib/holdings-table/holdings-table.component.html
+++ b/libs/ui/src/lib/holdings-table/holdings-table.component.html
@@ -10,7 +10,7 @@
     <ng-container matColumnDef="icon">
       <th *matHeaderCellDef class="px-1" mat-header-cell></th>
       <td *matCellDef="let element" class="px-1 text-center" mat-cell>
-        <gf-symbol-icon
+        <gf-asset-profile-icon
           [dataSource]="element.dataSource"
           [symbol]="element.symbol"
           [tooltip]="element.name"
diff --git a/libs/ui/src/lib/holdings-table/holdings-table.module.ts b/libs/ui/src/lib/holdings-table/holdings-table.module.ts
index 916489573..a944bc1c1 100644
--- a/libs/ui/src/lib/holdings-table/holdings-table.module.ts
+++ b/libs/ui/src/lib/holdings-table/holdings-table.module.ts
@@ -1,5 +1,5 @@
+import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
 import { GfPositionDetailDialogModule } from '@ghostfolio/client/components/position/position-detail-dialog/position-detail-dialog.module';
-import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
 import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
 import { GfNoTransactionsInfoModule } from '@ghostfolio/ui/no-transactions-info';
 import { GfValueModule } from '@ghostfolio/ui/value';
@@ -21,9 +21,9 @@ import { HoldingsTableComponent } from './holdings-table.component';
   exports: [HoldingsTableComponent],
   imports: [
     CommonModule,
+    GfAssetProfileIconComponent,
     GfNoTransactionsInfoModule,
     GfPositionDetailDialogModule,
-    GfSymbolIconModule,
     GfSymbolModule,
     GfValueModule,
     MatButtonModule,