add ProfilePicture into header when user login

src/components/Header/Header.tsx

@@ -12,6 +12,7 @@ import { AuthContext } from "../../contexts/Auth/AuthContext.js";
 import { PendingMembersContext } from "../../contexts/PendingMembers/PendingMembersContext";
 import Notification from "../../interfaces/notification.interface";
 
+
 function Header() {
 
     const { update, user } = useContext(AuthContext)!;
@@ -130,15 +131,21 @@ function Header() {
                     <div className={styles.headerRightContent}>
                         <button
                             className={`${styles.bellBtn} ${notificationMenu ? styles.activeBellBtn : ""}`}
-                            onClick={() => {toggleNotificationMenu();}}
+                            onClick={() => { toggleNotificationMenu(); }}
                         >
-                            <img className={styles.notificationsImg} src="/bell.svg" alt="notifications"/>
+                            <img className={styles.notificationsImg} src="/bell.svg" alt="notifications" />
                             {unreadNotification && <span className={styles.notificationBadge}></span>}
                         </button>
 
                         <Link to="/profile" className={styles.profileLink}>
-                            <img className={styles.profileImg} src="/person.svg" alt="profile"/>
+                            <img
+                                className={styles.profileImg}
+                                src={user?.profile_photo_path || "/person.svg"}
+                                alt="profile"
+                            />
                         </Link>
+
+
                     </div>
                 </nav>