more

src/Components/Navigation/Navbar.js

@@ -47,9 +47,15 @@ const NavbarElement = (props) => {
     setMenuOpen(!menuOpen);
   }
 
-  function handleClick(item) {
-    const link = item.toLowerCase();
-    navigate(`/${link}`);
+  function handleClick(link) {
+    const _link = link.toLowerCase();
+    navigate(`/${_link}`);
+  }
+
+  function packUpAndLeave(link) {
+    console.log("packUpAndLeave!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!", link);
+    navToggle();
+    handleClick(link);
   }
 
   async function handleLogout() {
@@ -100,7 +106,11 @@ const NavbarElement = (props) => {
         </div>
         <div className="navbar-mobile-hamburg">
           <List size="36px" onClick={() => navToggle()} />
-          <Navpanel menuOpen={menuOpen} />
+          <Navpanel
+            menuOpen={menuOpen}
+            navToggle={navToggle}
+            packUpAndLeave={packUpAndLeave}
+          />
         </div>
       </Navbar>
       <div className="navbar-main-spacer"></div>

src/Components/Navigation/Navpanel.js

@@ -4,7 +4,7 @@ import "../../styles/contact.scss";
 import { Link } from "react-router-dom";
 
 export default function Navpanel(props) {
-  const { menuOpen, setMenuOpen, navToggle } = props;
+  const { menuOpen, setMenuOpen, navToggle, packUpAndLeave } = props;
   console.log("+++++++++menuOpen", menuOpen);
   const mobileMainHeadingClass = menuOpen
     ? "mobileMainHeadingShow"
@@ -27,7 +27,10 @@ export default function Navpanel(props) {
         <div className="mobileHeadingLinkWrap">
           <div className="mobile-info-box">
             <div className="contact-detail-one">
-              <a className="contact-link" href="/login" onClick={navToggle}>
+              <a
+                className="contact-link"
+                onClick={() => packUpAndLeave("login")}
+              >
                 Login
               </a>
             </div>