visatas cambiarpass y navheader

src/components/BarNavigationAdmin.tsx

@@ -0,0 +1,57 @@
+"use client";
+
+import { useState } from "react";
+import { useRouter } from "next/navigation";
+import "../app/styles/layout/BarNavigation.scss";
+import Link from "next/link";
+
+function BarNavigation() {
+  const router = useRouter();
+  const [openMenu, setOpenMenu] = useState(false);
+
+  const toggleMenu = () => setOpenMenu(!openMenu);
+
+  const cerrarSesion = () => {
+    if (typeof window !== "undefined") {
+      localStorage.removeItem("loggedIn");
+      router.push("/");
+    }
+    setOpenMenu(false);
+  };
+
+  return (
+    <nav className="barNavigation">
+      <div className="menuToggle" onClick={toggleMenu}>
+        <div></div>
+        <div></div>
+        <div></div>
+      </div>
+
+      <ul className={openMenu ? "active" : ""}>
+        <li className="subMenu" onClick={toggleMenu}>
+          <Link href="/crearCuenta" className="links">
+            <span>Crear Cuenta</span>
+          </Link>
+        </li>
+        <li className="subMenu" onClick={toggleMenu}>
+          <Link href="/CambiarPass" className="links">
+            <span>Cambiar Contraseña</span>
+          </Link>
+        </li>
+        <li className="subMenu" onClick={toggleMenu}>
+          <Link href="/reporte" className="links">
+            <span>Reporte</span>
+          </Link>
+        </li>
+        <li className="subMenu">
+          <button className="logout-button" onClick={cerrarSesion}>
+            Cerrar sesión
+          </button>
+        </li>
+      </ul>
+    </nav>
+  );
+}
+
+export default BarNavigation;
+//IO

src/components/header.tsx

@@ -3,6 +3,7 @@ import Image from "next/image";
 import header from "../app/styles/layout/header.module.scss";
 import Link from "next/link";
 import BarNavigation from "./BarNavigation";
+import BarNavigationAdmin from "./BarNavigationAdmin";
 import { usePathname } from "next/navigation";
 
 function Header() {
@@ -42,7 +43,7 @@ function Header() {
         }}
       >
         {publicNav.includes(pathname) && <BarNavigation />}
-        {privateNav.includes(pathname) && <BarNavigation />}
+        {privateNav.includes(pathname) && <BarNavigationAdmin />}
       </div>
     </header>
   );