import { useState } from 'react'; import { Link } from 'react-router-dom'; import { useTheme } from '../hooks/useTheme'; import { useAuth } from '../hooks/useAuth.tsx'; import logo from '../assets/logo.png'; const SunIcon = () => ( ); const MoonIcon = () => ( ); const Navbar = () => { const [menuOpen, setMenuOpen] = useState(false); const { theme, toggleTheme } = useTheme(); const { isAuthenticated } = useAuth(); return ( {/* Desktop Nav Links */} Forensic Labs Threat Radar Features Enterprise {/* Right side: Theme toggle + CTA Buttons */} {/* Theme Toggle */} toggleTheme(e)} title={theme === 'dark' ? 'Switch to light mode' : 'Switch to dark mode'} > {theme === 'dark' ? : } Log in Get Started {/* Mobile Hamburger */} setMenuOpen(!menuOpen)} className="md:hidden p-2 text-[var(--text-secondary)]" > {/* Mobile Menu */} {menuOpen && ( {[ { label: 'Forensic Labs', href: '/#features' }, { label: 'Threat Radar', href: '/#threat-radar' }, { label: 'Features', href: '/#how-it-works' }, { label: 'Enterprise', href: '/#enterprise' }, { label: 'Log in', href: '/login' } ].map(item => ( setMenuOpen(false)} className="text-sm font-medium text-[var(--text-secondary)] hover:text-[var(--text-heading)] transition-colors py-2" > {item.label} ))} )} ); }; export default Navbar;