5 files changed, 15 insertions, 4 deletions
diff --git a/frontend/src/app/Shared.ts b/frontend/src/app/Shared.ts
index 0adcd4d6..31afb1a6 100644
--- a/frontend/src/app/Shared.ts
+++ b/frontend/src/app/Shared.ts
@@ -1,7 +1,8 @@
 class Shared {
     constructor(
         public loggedIn: boolean,
-        public username: string = ''
+        public username: string = '',
+        public photoId: string = '1'
     ) { }
 }
 
diff --git a/frontend/src/app/_elements/navbar/navbar.component.html b/frontend/src/app/_elements/navbar/navbar.component.html
index 52e26e6b..82a1ea07 100644
--- a/frontend/src/app/_elements/navbar/navbar.component.html
+++ b/frontend/src/app/_elements/navbar/navbar.component.html
@@ -18,7 +18,7 @@
             <div *ngIf="shared.loggedIn" class="dropdown text-end">
                 <a href="#" class="d-block link-light text-decoration-none dropdown-toggle" id="dropdownUser1"
                     data-bs-toggle="dropdown" aria-expanded="false">
-                    <img src="https://github.com/mdo.png" alt="mdo" width="32" height="32" class="rounded-circle">
+                    <img [src]="'/assets/profilePictures/'+ shared.photoId +'.png'" alt="mdo" width="32" height="32" class="rounded-circle">
                 </a>
                 <ul class="dropdown-menu text-small" aria-labelledby="dropdownUser1"
                     style="position: absolute; inset: 0px 0px auto auto; margin: 0px; transform: translate(0px, 34px);"
diff --git a/frontend/src/app/_elements/navbar/navbar.component.ts b/frontend/src/app/_elements/navbar/navbar.component.ts
index c16e3e9d..5fd98c8f 100644
--- a/frontend/src/app/_elements/navbar/navbar.component.ts
+++ b/frontend/src/app/_elements/navbar/navbar.component.ts
@@ -2,6 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { Location } from '@angular/common';
 import { AuthService } from '../../_services/auth.service';
 import shared from 'src/app/Shared';
+import { UserInfoService } from 'src/app/_services/user-info.service';
 
 @Component({
   selector: 'app-navbar',
@@ -13,7 +14,7 @@ export class NavbarComponent implements OnInit {
   currentUrl: string;
   shared = shared;
 
-  constructor(public location: Location, private auth: AuthService) {
+  constructor(public location: Location, private auth: AuthService, private userInfoService: UserInfoService) {
     this.currentUrl = this.location.path();
     this.location.onUrlChange(() => {
       this.currentUrl = this.location.path();
@@ -22,6 +23,9 @@ export class NavbarComponent implements OnInit {
 
   ngOnInit(): void {
     this.auth.updateUser();
+    this.userInfoService.getUserInfo().subscribe((response) => {
+      shared.photoId = response.photoId;
+    });
   }
 
   logOut() {
diff --git a/frontend/src/app/_pages/profile/profile.component.ts b/frontend/src/app/_pages/profile/profile.component.ts
index cb4b095e..3e9a0d11 100644
--- a/frontend/src/app/_pages/profile/profile.component.ts
+++ b/frontend/src/app/_pages/profile/profile.component.ts
@@ -5,6 +5,8 @@ import { AuthService } from 'src/app/_services/auth.service';
 import { Router } from '@angular/router';
 import { PICTURES } from 'src/app/_data/ProfilePictures';
 import { Picture } from 'src/app/_data/ProfilePictures';
+import shared from '../../Shared';
+
 
 @Component({
   selector: 'app-profile',
@@ -50,6 +52,7 @@ export class ProfileComponent implements OnInit {
     this.userInfoService.getUserInfo().subscribe((response) => {
 
       this.user = response;
+      shared.photoId = this.user.photoId;
 
       this.username = this.user.username;
       this.email = this.user.email;
@@ -155,6 +158,7 @@ export class ProfileComponent implements OnInit {
         break;
       }
     }
+    shared.photoId = this.photoId;
   }
   
 
diff --git a/frontend/src/app/_services/auth.service.ts b/frontend/src/app/_services/auth.service.ts
index 20ff45f3..449b8802 100644
--- a/frontend/src/app/_services/auth.service.ts
+++ b/frontend/src/app/_services/auth.service.ts
@@ -61,8 +61,10 @@ export class AuthService {
   updateUser() {
     if (this.cookie.check('token')) {
       const token = this.cookie.get('token');
+      const decodedToken = jwtHelper.decodeToken(token);
+      console.log("decoded:", decodedToken);
       this.shared.loggedIn = this.isAuthenticated();
-      this.shared.username = jwtHelper.decodeToken(token).name;
+      this.shared.username = decodedToken.name;
       this.enableAutoRefresh();
     }
   }