fixed header & nav

Green-Cycle · Jun 3, 2024 · 7303dd6 · 7303dd6
1 parent 37c839f
commit 7303dd6
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 12 deletions.
diff --git a/Frontend/src/components/Header.jsx b/Frontend/src/components/Header.jsx
@@ -164,7 +164,7 @@ function Header() {
           </button>
         </div>
       </div>
-      <Nav />
+      <Nav setMenuOpen={setMenuOpen} />
       <div className={menuOpen ? 'header__menu_open' : 'header__menu'}>
         <Search menuOpen={menuOpen} setMenuOpen={setMenuOpen} />
         <Nav menuOpen={menuOpen} setMenuOpen={setMenuOpen} />

diff --git a/Frontend/src/components/Nav.jsx b/Frontend/src/components/Nav.jsx
@@ -1,15 +1,24 @@
 import './Nav.css';
-import { Link } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom';
 
 function Nav({ menuOpen, setMenuOpen }) {
+  const navigate = useNavigate();
+
+  const handleLinkClick = (path) => {
+    setMenuOpen(false); // Fecha o menu
+    navigate(path); // Navega para a nova rota
+  };
+
   const handleScrollToFooter = () => {
-    () => setMenuOpen(false);
-    const footer = document.getElementById('footer');
-    if (footer) {
-      footer.scrollIntoView({ behavior: 'smooth' });
-    } else {
-      console.error('Footer not found');
-    }
+    setMenuOpen(false); // Fecha o menu
+    setTimeout(() => {
+      const footer = document.getElementById('footer');
+      if (footer) {
+        footer.scrollIntoView({ behavior: 'smooth' });
+      } else {
+        console.error('Footer not found');
+      }
+    }, 0);
   };
 
   return (
@@ -19,7 +28,10 @@ function Nav({ menuOpen, setMenuOpen }) {
           <Link
             className='nav__link'
             to='/store'
-            onClick={() => setMenuOpen(false)}
+            onClick={(e) => {
+              e.preventDefault();
+              handleLinkClick('/store');
+            }}
           >
             LOJA
           </Link>
@@ -28,7 +40,10 @@ function Nav({ menuOpen, setMenuOpen }) {
           <Link
             className='nav__link'
             to='/sobre'
-            onClick={() => setMenuOpen(false)}
+            onClick={(e) => {
+              e.preventDefault();
+              handleLinkClick('/sobre');
+            }}
           >
             SOBRE
           </Link>
@@ -37,7 +52,10 @@ function Nav({ menuOpen, setMenuOpen }) {
           <Link
             className='nav__link'
             to='/maps'
-            onClick={() => setMenuOpen(false)}
+            onClick={(e) => {
+              e.preventDefault();
+              handleLinkClick('/maps');
+            }}
           >
             PONTOS DE COLETA
           </Link>