From 92585495f99edeb6b200a0e2938610705deaa2f8 Mon Sep 17 00:00:00 2001
From: KenTandrian <kenricktan11@gmail.com>
Date: Sat, 11 Jul 2026 10:37:46 +0700
Subject: [PATCH] fix(client): modernize home holdings component

---
 .../home-holdings/home-holdings.component.ts  | 43 ++++++++++---------
 1 file changed, 22 insertions(+), 21 deletions(-)

diff --git a/apps/client/src/app/components/home-holdings/home-holdings.component.ts b/apps/client/src/app/components/home-holdings/home-holdings.component.ts
index f8488e55d..1bbd64aff 100644
--- a/apps/client/src/app/components/home-holdings/home-holdings.component.ts
+++ b/apps/client/src/app/components/home-holdings/home-holdings.component.ts
@@ -20,6 +20,7 @@ import {
   Component,
   CUSTOM_ELEMENTS_SCHEMA,
   DestroyRef,
+  inject,
   OnInit
 } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
@@ -53,32 +54,32 @@ import { DeviceDetectorService } from 'ngx-device-detector';
 export class GfHomeHoldingsComponent implements OnInit {
   public static DEFAULT_HOLDINGS_VIEW_MODE: HoldingsViewMode = 'TABLE';
 
-  public deviceType: string;
-  public hasImpersonationId: boolean;
-  public hasPermissionToAccessHoldingsChart: boolean;
-  public hasPermissionToCreateActivity: boolean;
-  public holdings: PortfolioPosition[];
-  public holdingType: HoldingType = 'ACTIVE';
-  public holdingTypeOptions: ToggleOption[] = [
+  protected deviceType: string;
+  protected hasImpersonationId: boolean;
+  protected hasPermissionToAccessHoldingsChart: boolean;
+  protected hasPermissionToCreateActivity: boolean;
+  protected holdings: PortfolioPosition[];
+  protected holdingType: HoldingType = 'ACTIVE';
+  protected readonly holdingTypeOptions: ToggleOption[] = [
     { label: $localize`Active`, value: 'ACTIVE' },
     { label: $localize`Closed`, value: 'CLOSED' }
   ];
-  public routerLinkPortfolioActivities =
+  protected readonly routerLinkPortfolioActivities =
     internalRoutes.portfolio.subRoutes.activities.routerLink;
-  public user: User;
-  public viewModeFormControl = new FormControl<HoldingsViewMode>(
+  protected user: User;
+  protected readonly viewModeFormControl = new FormControl<HoldingsViewMode>(
     GfHomeHoldingsComponent.DEFAULT_HOLDINGS_VIEW_MODE
   );
 
-  public constructor(
-    private changeDetectorRef: ChangeDetectorRef,
-    private dataService: DataService,
-    private destroyRef: DestroyRef,
-    private deviceDetectorService: DeviceDetectorService,
-    private impersonationStorageService: ImpersonationStorageService,
-    private router: Router,
-    private userService: UserService
-  ) {
+  private readonly changeDetectorRef = inject(ChangeDetectorRef);
+  private readonly dataService = inject(DataService);
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly deviceDetectorService = inject(DeviceDetectorService);
+  private readonly impersonationStorageService = inject(ImpersonationStorageService);
+  private readonly router = inject(Router);
+  private readonly userService = inject(UserService);
+
+  public constructor() {
     addIcons({ gridOutline, reorderFourOutline });
   }
 
@@ -139,13 +140,13 @@ export class GfHomeHoldingsComponent implements OnInit {
       });
   }
 
-  public onChangeHoldingType(aHoldingType: HoldingType) {
+  protected onChangeHoldingType(aHoldingType: HoldingType) {
     this.holdingType = aHoldingType;
 
     this.initialize();
   }
 
-  public onHoldingClicked({ dataSource, symbol }: AssetProfileIdentifier) {
+  protected onHoldingClicked({ dataSource, symbol }: AssetProfileIdentifier) {
     if (dataSource && symbol) {
       this.router.navigate([], {
         queryParams: { dataSource, symbol, holdingDetailDialog: true }