Initial Implementation of Profile Pictures

src/app/header/header-slider/nav-slider/nav-slider.component.ts

@@ -1,14 +1,18 @@
-import { Component, EventEmitter, OnInit, Output } from '@angular/core';
+import {Component, EventEmitter, OnDestroy, OnInit, Output} from '@angular/core';
 import { faUser } from '@fortawesome/free-solid-svg-icons';
 import { SliderItemComponent } from 'src/app/shared/components/slider-item/slider-item.component';
+import UserChecker from "../../../shared/model/user/user.checker";
+import {User} from "../../../shared/model/user/user.model";
+import {AuthService} from "../../../shared/auth/auth.service";
+import {Subscription} from "rxjs";
 
 @Component({
     selector: 'app-nav-slider',
     templateUrl: './nav-slider.component.html',
     styleUrls: ['./nav-slider.component.css']
 })
-export class NavSliderComponent extends SliderItemComponent {
-    
+export class NavSliderComponent extends SliderItemComponent implements OnInit, OnDestroy {
+
     userIcon = faUser;
 
     navLink = [
@@ -18,13 +22,34 @@ export class NavSliderComponent extends SliderItemComponent {
         { page: "About", link: "/home" }
     ]
 
+    loggedUser!: User | null;
+
+    private userSubscription!: Subscription;
+
     @Output()
         profileButtonClicked = new EventEmitter();
 
-    constructor() {
+    constructor(private authService: AuthService) {
         super();
     }
 
+    ngOnInit(): void {
+        this.userSubscription = this.authService.authSubject.subscribe(
+            res => {
+                console.log(UserChecker.test(res));
+                if (res && UserChecker.test(res)) {
+                    this.loggedUser = <User>res;
+                } else {
+                    this.loggedUser = null;
+                }
+            }
+        )
+    }
+
+    ngOnDestroy(): void {
+        this.userSubscription.unsubscribe();
+    }
+
     onProfileButtonClicked() {
         this.profileButtonClicked.emit();
     }