import React, { useState, useEffect } from 'react'; import { Phone, Menu, X, ChevronDown } from 'lucide-react'; import { Link, useLocation } from 'react-router-dom'; import { NAV_LINKS } from '../constants'; interface NavbarProps { transparent?: boolean; } const Navbar: React.FC = ({ transparent = false }) => { const [isScrolled, setIsScrolled] = useState(false); const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); const [isMobileServicesMenuOpen, setIsMobileServicesMenuOpen] = useState(false); const [isMobileLabMenuOpen, setIsMobileLabMenuOpen] = useState(false); const [imgError, setImgError] = useState(false); const location = useLocation(); useEffect(() => { const handleScroll = () => { setIsScrolled(window.scrollY > 50); }; window.addEventListener('scroll', handleScroll); return () => window.removeEventListener('scroll', handleScroll); }, []); const isHome = location.pathname === '/'; // Use transparent background only on Home and when not scrolled, if requested const isTransparent = transparent && isHome && !isScrolled; return ( ); }; export default Navbar;