import React, { useState, useEffect } from 'react'; import { Link } from 'react-router-dom'; import { createPageUrl } from '@/utils'; import { Menu, X, Globe } from 'lucide-react'; import { Button } from "@/components/ui/button"; import { motion, AnimatePresence } from 'framer-motion'; export default function Navbar() { const [isScrolled, setIsScrolled] = useState(false); const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); useEffect(() => { const handleScroll = () => { setIsScrolled(window.scrollY > 20); }; window.addEventListener('scroll', handleScroll); return () => window.removeEventListener('scroll', handleScroll); }, []); const navLinks = [ { name: 'Home', path: 'Home' }, { name: 'Services', path: 'Services' }, { name: 'About', path: 'Home' }, { name: 'Contact', path: 'Contact' }, ]; return (

{/* Logo */}

HD Carrier {/* Desktop Nav */}

{navLinks.map((link) => ( {link.name} ))}

{/* Mobile Toggle */}

{/* Mobile Menu */} {isMobileMenuOpen && (

{navLinks.map((link) => ( setIsMobileMenuOpen(false)} > {link.name} ))}

)}

); }