import { useState, useRef, useEffect } from "react" import { useNavigate } from "react-router-dom" import { Logo1, search, row, IconPersonal, IconCorporate, IconStartup, ProdukDoku, ProdukHr, ProdukLlm, ProdukVeri } from "../../assets" const Header = () => { const navigate = useNavigate(); const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false); const [isSolusiOpen, setIsSolusiOpen] = useState(false); const [isProdukOpen, setIsProdukOpen] = useState(false); const [searchQuery, setSearchQuery] = useState("") const handleSearch = (e) => { setSearchQuery(e.target.value) } const handleSearchSubmit = (e) => { e.preventDefault() const query = searchQuery.toLowerCase() // Solutions mapping if (query.includes("solusi personal") || query.includes("personal")) { navigate("/SolusiPersonal") } else if (query.includes("solusi startup") || query.includes("startup")) { navigate("/SolusiStartup") } else if (query.includes("solusi corporate") || query.includes("corporate") || query.includes("business")) { navigate("/SolusiCorporate") } window.scrollTo({ top: 0, behavior: "smooth" }) setSearchQuery("") // Clear search after submission } // Referensi untuk mendeteksi klik di luar dropdown const solusiRef = useRef(null); const produkRef = useRef(null); // Fungsi untuk menutup dropdown jika klik di luar elemen useEffect(() => { function handleClickOutside(event) { if (solusiRef.current && !solusiRef.current.contains(event.target)) { setIsSolusiOpen(false); } if (produkRef.current && !produkRef.current.contains(event.target)) { setIsProdukOpen(false); } } // Tambahkan event listener saat dropdown terbuka document.addEventListener("mousedown", handleClickOutside); return () => { document.removeEventListener("mousedown", handleClickOutside); }; }, []); return (
) } export default Header