import React, { useState } from "react"; import { Link } from "react-router-dom"; import Search from "./Search"; import LogoutButton from "./session/LogoutButton"; const Header = ({login, setLogin}) => { const [show, setShow] = useState(false); return ( <nav className="navbar navbar-expand-lg navbar-dark bg-dark"> <div className="container-fluid"> <Link className="navbar-brand" to="/"> Ascend Inventory </Link> <button className="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation" onClick={() => setShow((prev) => !prev)} > <span className="navbar-toggler-icon"></span> </button> <div className={`collapse navbar-collapse ${show ? "show" : ""}`} id="navbarSupportedContent" > <ul className="navbar-nav me-auto mb-2 mb-lg-0"> <li className="nav-item"> <Link className="nav-link" to="/products"> Products </Link> </li> <li className="nav-item"> <Link className="nav-link" to="/promos"> Promotions </Link> </li> </ul> <Search /> <LogoutButton/> </div> </div> </nav> ); }; export default Header;