main page

src/components/Navbar.jsx

@@ -0,0 +1,49 @@
+import { Link, useNavigate } from 'react-router-dom'
+import { useAuth } from '../context/AuthContext'
+import { FaUser } from 'react-icons/fa'
+
+export default function Navbar() {
+  const { user, logout } = useAuth()
+  const navigate = useNavigate()
+
+  const handleLogout = async () => {
+    await logout()
+    navigate('/login')
+  }
+
+  return (
+    <nav className="navbar">
+      <div className="navbar-brand">
+        <span>NetWEB</span>
+        <img src="/logo.png" alt="" height="18" width="18" />
+        <span>Systems</span>
+      </div>
+      
+      <ul className="navbar-nav">
+        <li><Link to="/tickets" className="nav-link">Tickets</Link></li>
+        <li><Link to="/assets" className="nav-link">Assets</Link></li>
+        <li><Link to="/dashboard" className="nav-link">Dashboard</Link></li>
+        <li><Link to="/planboard" className="nav-link">Planboard</Link></li>
+        <li><Link to="/projects" className="nav-link">Projects</Link></li>
+        <li><Link to="/reports" className="nav-link">Reports</Link></li>
+        <li><Link to="/docs" className="nav-link">Docs</Link></li>
+      </ul>
+
+      <div className="nav-right">
+        {user ? (
+          <button 
+            onClick={handleLogout} 
+            className="nav-link"
+            style={{ background: 'none', border: 'none', cursor: 'pointer' }}
+          >
+            <FaUser /> Logout, {user.name || user.email}
+          </button>
+        ) : (
+          <Link to="/login" className="nav-link">
+            <FaUser /> Login
+          </Link>
+        )}
+      </div>
+    </nav>
+  )
+}