diff --git a/src/app/components/summary/summary.component.html b/src/app/components/summary/summary.component.html
index 9b0692b..8c4f5ca 100644
--- a/src/app/components/summary/summary.component.html
+++ b/src/app/components/summary/summary.component.html
@@ -99,11 +99,12 @@
{{ greeting }},
-
-
{{ "firstName" }}
- {{ "lastName" }}
+ @if (currentUser) {
+
+ {{ currentUser["firstName"] }}
+ {{ currentUser["lastName"] }}
+
+ }
} @else {
diff --git a/src/app/components/summary/summary.component.ts b/src/app/components/summary/summary.component.ts
index 03afc56..cf2bcd7 100644
--- a/src/app/components/summary/summary.component.ts
+++ b/src/app/components/summary/summary.component.ts
@@ -7,6 +7,9 @@ import { TaskService } from '../../services/task.service';
import { LoadingSpinnerComponent } from '../../shared/components/loading-spinner/loading-spinner.component';
import { finalize } from 'rxjs';
+import { UserService } from '../../services/user.service';
+import { User } from '../../interfaces/user.interface';
+
@Component({
selector: 'app-summary',
standalone: true,
@@ -18,11 +21,13 @@ export class SummaryComponent {
nextUrgendTask: number[] = [];
allTasks: Task[] = [];
+ currentUser: User | null = null;
isLoading = false;
constructor(
public firebaseService: FirebaseService,
private translateService: TranslateService,
+ private userService: UserService,
private taskService: TaskService
) {}
@@ -31,6 +36,7 @@ export class SummaryComponent {
*/
ngOnInit() {
this.loadAllTasks();
+ this.loadCurrentUser();
}
/**
@@ -52,6 +58,12 @@ export class SummaryComponent {
});
}
+ loadCurrentUser(): void {
+ this.userService.getCurrentUser().subscribe((userData) => {
+ this.currentUser = userData;
+ });
+ }
+
/**
* Gets the total number of tasks.
* @returns The total count of tasks.
diff --git a/src/app/services/user.service.ts b/src/app/services/user.service.ts
new file mode 100644
index 0000000..d8ac7e3
--- /dev/null
+++ b/src/app/services/user.service.ts
@@ -0,0 +1,66 @@
+import { Injectable } from '@angular/core';
+import { BehaviorSubject, Observable, of } from 'rxjs';
+import { catchError, switchMap, tap } from 'rxjs/operators';
+import { ApiService } from './api.service';
+import { AuthService } from './auth.service';
+import { User } from '../interfaces/user.interface';
+
+@Injectable({
+ providedIn: 'root',
+})
+export class UserService {
+ private currentUserCache: User | null = null;
+ private currentUserSubject: BehaviorSubject =
+ new BehaviorSubject(null);
+ private loading = false;
+
+ constructor(
+ private authService: AuthService,
+ private apiService: ApiService
+ ) {}
+
+ /**
+ * Retrieves the current user from the cache if available, or loads it from the API.
+ *
+ * @returns An Observable resolving to the current user, or null if not available.
+ */
+ getCurrentUser(): Observable {
+ if (this.currentUserCache) {
+ this.currentUserSubject.next(this.currentUserCache);
+ return this.currentUserSubject.asObservable();
+ }
+
+ return this.loadCurrentUser();
+ }
+
+ /**
+ * Loads the current user data by fetching the user ID from the AuthService and
+ * retrieving the user details from the ApiService.
+ *
+ * @returns an Observable resolving to the current user, or null if none exists
+ */
+ loadCurrentUser(): Observable {
+ if (this.loading) {
+ return this.currentUserSubject.asObservable();
+ }
+
+ this.loading = true;
+
+ return this.authService.getCurrentUserId().pipe(
+ switchMap((userId) => {
+ if (!userId) return of(null);
+
+ return this.apiService.getUserById(userId).pipe(
+ catchError(() => of(null)),
+ tap((userData) => {
+ if (userData) {
+ this.currentUserCache = userData;
+ this.currentUserSubject.next(userData);
+ }
+ this.loading = false;
+ })
+ );
+ })
+ );
+ }
+}
diff --git a/src/app/shared/components/header/header.component.ts b/src/app/shared/components/header/header.component.ts
index 930f676..484a7ad 100644
--- a/src/app/shared/components/header/header.component.ts
+++ b/src/app/shared/components/header/header.component.ts
@@ -4,9 +4,8 @@ import { NavbarComponent } from './navbar/navbar.component';
import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core';
import { FirebaseService } from '../../../services/firebase.service';
-import { AuthService } from '../../../services/auth.service';
-import { ApiService } from '../../../services/api.service';
-import { catchError, of, switchMap } from 'rxjs';
+import { UserService } from '../../../services/user.service';
+import { User } from '../../../interfaces/user.interface';
@Component({
selector: 'app-header',
@@ -18,12 +17,11 @@ import { catchError, of, switchMap } from 'rxjs';
export class HeaderComponent {
navbarVisible: boolean = false;
navbarLanguageVisible: boolean = false;
- currentUser: any = null;
+ currentUser: User | null = null;
constructor(
public firebaseService: FirebaseService,
- private authService: AuthService,
- private apiService: ApiService
+ private userService: UserService
) {}
/**
@@ -37,19 +35,9 @@ export class HeaderComponent {
* Loads the current user data and sets it to the `currentUser` property.
*/
loadCurrentUser(): void {
- this.authService
- .getCurrentUserId()
- .pipe(
- switchMap((userId) => {
- if (!userId) return of(null);
- return this.apiService
- .getUserById(userId)
- .pipe(catchError(() => of(null)));
- })
- )
- .subscribe((userData) => {
- this.currentUser = userData || {};
- });
+ this.userService.getCurrentUser().subscribe((userData) => {
+ this.currentUser = userData;
+ });
}
/**