feat(client): convert user and hasPermissionToUpdateUserSettings to signals

apps/client/src/app/components/home-summary/home-summary.component.ts

@@ -6,7 +6,6 @@ import { hasPermission, permissions } from '@ghostfolio/common/permissions';
 import { DataService } from '@ghostfolio/ui/services';
 
 import {
-  ChangeDetectorRef,
   Component,
   computed,
   CUSTOM_ELEMENTS_SCHEMA,
@@ -27,16 +26,22 @@ import { DeviceDetectorService } from 'ngx-device-detector';
   templateUrl: './home-summary.html'
 })
 export class GfHomeSummaryComponent implements OnInit {
-  protected readonly deviceType = computed(
-    () => this.deviceDetectorService.deviceInfo().deviceType
-  );
   protected readonly hasImpersonationId = signal<boolean>(false);
-  protected hasPermissionToUpdateUserSettings: boolean;
   protected readonly isLoading = signal(true);
   protected readonly summary = signal<PortfolioSummary | undefined>(undefined);
-  protected user: User;
+  protected readonly user = signal<User | undefined>(undefined);
+
+  protected readonly deviceType = computed(
+    () => this.deviceDetectorService.deviceInfo().deviceType
+  );
+
+  protected readonly hasPermissionToUpdateUserSettings = computed(() => {
+    const user = this.user();
+    return user
+      ? hasPermission(user.permissions, permissions.updateUserSettings)
+      : false;
+  });
 
-  private readonly changeDetectorRef = inject(ChangeDetectorRef);
   private readonly dataService = inject(DataService);
   private readonly destroyRef = inject(DestroyRef);
   private readonly deviceDetectorService = inject(DeviceDetectorService);
@@ -50,13 +55,7 @@ export class GfHomeSummaryComponent implements OnInit {
       .pipe(takeUntilDestroyed(this.destroyRef))
       .subscribe((state) => {
         if (state?.user) {
-          this.user = state.user;
+          this.user.set(state.user);
-
-          this.hasPermissionToUpdateUserSettings = hasPermission(
-            this.user.permissions,
-            permissions.updateUserSettings
-          );
-
           this.update();
         }
       });
@@ -80,9 +79,7 @@ export class GfHomeSummaryComponent implements OnInit {
           .get(true)
           .pipe(takeUntilDestroyed(this.destroyRef))
           .subscribe((user) => {
-            this.user = user;
+            this.user.set(user);
-
-            this.changeDetectorRef.markForCheck();
           });
       });
   }

apps/client/src/app/components/home-summary/home-summary.html

@@ -5,17 +5,17 @@
       <mat-card appearance="outlined">
         <mat-card-content>
           <gf-portfolio-summary
-            [baseCurrency]="user?.settings?.baseCurrency"
+            [baseCurrency]="user()?.settings?.baseCurrency"
             [deviceType]="deviceType()"
             [hasImpersonationId]="hasImpersonationId()"
             [hasPermissionToUpdateUserSettings]="
-              !hasImpersonationId() && hasPermissionToUpdateUserSettings
+              !hasImpersonationId() && hasPermissionToUpdateUserSettings()
             "
             [isLoading]="isLoading()"
-            [language]="user?.settings?.language"
+            [language]="user()?.settings?.language"
-            [locale]="user?.settings?.locale"
+            [locale]="user()?.settings?.locale"
             [summary]="summary()"
-            [user]="user"
+            [user]="user()"
             (emergencyFundChanged)="onChangeEmergencyFund($event)"
           />
         </mat-card-content>