From d4dd7bac30a0b941ba1019fbc2d50d3f7c9daad4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Rados=C5=82aw=20Gierwia=C5=82o?= <github@radziel.com>
Date: Fri, 5 Dec 2025 18:36:51 +0100
Subject: [PATCH] feat(navbar): make username clickable link to public profile

- Desktop: username and avatar link to /u/{username}
- Mobile: username section in dropdown links to public profile
- Adds hover effect to indicate clickability
---
 frontend/src/components/layout/Navbar.jsx | 15 +++++++++++----
 1 file changed, 11 insertions(+), 4 deletions(-)

diff --git a/frontend/src/components/layout/Navbar.jsx b/frontend/src/components/layout/Navbar.jsx
index 03d80ff..07dc40f 100644
--- a/frontend/src/components/layout/Navbar.jsx
+++ b/frontend/src/components/layout/Navbar.jsx
@@ -173,10 +173,13 @@ const Navbar = ({ pageTitle = null }) => {
               </div>
             )}
 
-            <div className="flex items-center space-x-3">
+            <Link
+              to={`/u/${user.username}`}
+              className="flex items-center space-x-3 px-3 py-2 rounded-md hover:bg-gray-100"
+            >
               <Avatar src={user?.avatar} username={user.username} size={32} />
               <span className="text-sm font-medium text-gray-700">{user.username}</span>
-            </div>
+            </Link>
 
             <button
               onClick={handleLogout}
@@ -203,12 +206,16 @@ const Navbar = ({ pageTitle = null }) => {
       {/* Mobile dropdown */}
       {menuOpen && (
         <div className="md:hidden border-t bg-white shadow-sm">
-          <div className="px-4 py-3 flex items-center space-x-3">
+          <Link
+            to={`/u/${user.username}`}
+            onClick={() => setMenuOpen(false)}
+            className="px-4 py-3 flex items-center space-x-3 hover:bg-gray-50"
+          >
             <Avatar src={user?.avatar} username={user.username} size={32} />
             <div className="flex-1">
               <p className="text-sm font-medium text-gray-900">{user.username}</p>
             </div>
-          </div>
+          </Link>
           <div className="px-2 pb-2 space-y-1">
             <Link
               to="/dashboard"