Index: frontend/src/Nav.tsx
===================================================================
--- frontend/src/Nav.tsx	(revision 4022db101cfab639a8f41419782d6190042bf0dd)
+++ frontend/src/Nav.tsx	(revision 484dc3f54a72450588e7ece748ea1b64ad9ffdc3)
@@ -1,4 +1,4 @@
 import { Link } from "react-router-dom";
-import axiosInstance from "./api/axiosInstance";
+import axiosInstance, { baseURL } from "./api/axiosInstance";
 import Logo from "./assets/logo-finkwave.png";
 import { useAuth } from "./context/authContext";
@@ -29,9 +29,18 @@
 							<div className="flex items-center space-x-3">
 								<div className="flex items-center space-x-2 bg-slate-700 rounded-lg px-3 py-2">
-									<div className="w-8 h-8 bg-blue-500 rounded-full flex items-center justify-center">
-										<span className="text-white text-sm font-semibold">
-											{user.username.charAt(0).toUpperCase()}
-										</span>
-									</div>
+									{user.profilePhoto ? (
+										<img
+											src={`${baseURL}/${user.profilePhoto}`}
+											alt={`${user.username}'s profile`}
+											className="w-8 h-8 rounded-full object-cover"
+										/>
+									) : (
+										<div className="w-8 h-8 bg-blue-500 rounded-full flex items-center justify-center">
+											<span className="text-white text-sm font-semibold">
+												{user.username.charAt(0).toUpperCase()}
+											</span>
+										</div>
+									)}
+
 									<div className="text-white">
 										<p className="text-sm font-medium">{user.username}</p>
@@ -42,7 +51,5 @@
 								</div>
 								<button
-									onClick={(e: React.MouseEvent<HTMLButtonElement>) =>
-										handleLogout(e)
-									}
+									onClick={handleLogout}
 									className="bg-red-500 hover:bg-red-600 text-white px-4 py-2 rounded-lg text-sm 
                                     font-medium transition-colors duration-200 flex items-center space-x-1 cursor-pointer"