Skip to content

Commit

Permalink
formularios, inicio, navbar
Browse files Browse the repository at this point in the history
  • Loading branch information
luzmagurzua committed Nov 6, 2024
1 parent 70059c7 commit 7903b95
Show file tree
Hide file tree
Showing 32 changed files with 2,914 additions and 2,139 deletions.
3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@
"browser-image-compression": "^2.0.2",
"compress.js": "1.1.2",
"date-fns": "2.29.3",
"framer-motion": "^11.11.11",
"lucide-react": "^0.454.0",
"react": "^18.3.1",
"react-dom": "^18.3.1",
Expand All @@ -42,6 +43,6 @@
"eslint-plugin-react-hooks": "^5.1.0-rc.0",
"eslint-plugin-react-refresh": "^0.4.12",
"globals": "^15.9.0",
"vite": "^5.4.8"
"vite": "^5.4.10"
}
}
Binary file modified src/.DS_Store
Binary file not shown.
Binary file added src/assets/boton1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/boton2 2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/boton2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/boton3.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/assets/logo_oficial.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/boton1.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/boton2.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added src/boton3.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
181 changes: 118 additions & 63 deletions src/components/Navbar.jsx
Original file line number Diff line number Diff line change
@@ -1,73 +1,128 @@
import React, { useState } from 'react';
import { useAuth0 } from '@auth0/auth0-react';
import '../styles/navbar.css'; // Asegúrate de que la ruta del CSS es correcta
import { Link } from 'react-router-dom';
import logo from '../assets/logoo.png';
import whatsapp from '../assets/whatsapp.png';
import { FaBars } from 'react-icons/fa'; // Importar el icono de hamburguesa
// import React, { useState } from 'react';
// import { useAuth0 } from '@auth0/auth0-react';
// import '../styles/navbar.css'; // Asegúrate de que la ruta del CSS es correcta
// import { Link } from 'react-router-dom';
// import logo from '../assets/logoo.png';
// import whatsapp from '../assets/whatsapp.png';
// import { FaBars } from 'react-icons/fa'; // Importar el icono de hamburguesa

// function NavBar() {
// const { loginWithRedirect, isAuthenticated } = useAuth0();
// const [menuOpen, setMenuOpen] = useState(false); // Estado para manejar el menú

// const toggleMenu = () => {
// setMenuOpen(!menuOpen); // Alternar estado del menú
// };

// return (
// <div className="navbar">
// <div className="navbar-content">
// <Link to="/">
// <img src={logo} className="navbar-logo" alt="Logo" />
// </Link>
// <div className="navbar-links">
// <Link to="/inicio" className="footer-link">Inicio</Link>
// <Link to="/mapa-navegacion" className="footer-link">Mapa</Link>
// <Link to="/servicios" className="footer-link">Servicios</Link>
// <Link to="/cerca" className="footer-link">A mi alrededor</Link>

function NavBar() {
const { loginWithRedirect, isAuthenticated } = useAuth0();
const [menuOpen, setMenuOpen] = useState(false); // Estado para manejar el menú
// {isAuthenticated && (
// <>
// <Link to="/mi-perfil" className="footer-link">Mi Perfil</Link>
// <Link to="/publicaciones" className="footer-link">Mis Publicaciones</Link>
// <Link to="/favoritos" className="footer-link">Mis Favoritos</Link>
// <Link to="/notificaciones" className="footer-link">Enviar notificaciones a usuarios</Link>
// <Link to="/gestion-solicitudes" className="footer-link">Gestión de Solicitudes</Link>

const toggleMenu = () => {
setMenuOpen(!menuOpen); // Alternar estado del menú
};
// </>
// )}

return (
<div className="navbar">
<div className="navbar-content">
<Link to="/">
<img src={logo} className="navbar-logo" alt="Logo" />
</Link>
<div className="navbar-links">
<Link to="/inicio" className="footer-link">Inicio</Link>
<Link to="/mapa-navegacion" className="footer-link">Mapa</Link>
<Link to="/servicios" className="footer-link">Servicios</Link>
<Link to="/cerca" className="footer-link">A mi alrededor</Link>
// {!isAuthenticated && (
// <a className="footer-link" onClick={loginWithRedirect}>Iniciar sesión</a>
// )}
// </div>
// <FaBars className="navbar-hamburger" onClick={toggleMenu} /> {/* Icono de hamburguesa */}
// </div>
// <div className="whatsapp-container" onClick={() => alert('Connecting to WhatsApp')}>
// <img src={whatsapp} className="whatsapp-icon" alt="WhatsApp" />
// </div>
// {menuOpen && ( // Mostrar el menú si está abierto
// <div className="navbar-dropdown">
// <Link to="/inicio" className="footer-link" onClick={toggleMenu}>Inicio</Link>
// <Link to="/mapa-navegacion" className="footer-link" onClick={toggleMenu}>Mapa</Link>
// <Link to="/servicios" className="footer-link" onClick={toggleMenu}>Servicios</Link>
// <Link to="/cerca" className="footer-link" onClick={toggleMenu}>A mi alrededor</Link>

{isAuthenticated && (
<>
<Link to="/mi-perfil" className="footer-link">Mi Perfil</Link>
<Link to="/publicaciones" className="footer-link">Mis Publicaciones</Link>
<Link to="/favoritos" className="footer-link">Mis Favoritos</Link>
<Link to="/notificaciones" className="footer-link">Enviar notificaciones a usuarios</Link>
<Link to="/gestion-solicitudes" className="footer-link">Gestión de Solicitudes</Link>
// {isAuthenticated && (
// <>
// <Link to="/mi-perfil" className="footer-link" onClick={toggleMenu}>Mi Perfil</Link>
// <Link to="/publicaciones" className="footer-link" onClick={toggleMenu}>Mis Publicaciones</Link>
// <Link to="/favoritos" className="footer-link" onClick={toggleMenu}>Mis Favoritos</Link>
// <Link to="/notificaciones" className="footer-link" onClick={toggleMenu}>Enviar notificaciones a usuarios</Link>
// </>
// )}

</>
)}
// {!isAuthenticated && (
// <a className="footer-link" onClick={() => { loginWithRedirect(); toggleMenu(); }}>Iniciar sesión</a>
// )}
// </div>
// )}
// </div>
// );
// }
// export default NavBar;

{!isAuthenticated && (
<a className="footer-link" onClick={loginWithRedirect}>Iniciar sesión</a>
)}
</div>
<FaBars className="navbar-hamburger" onClick={toggleMenu} /> {/* Icono de hamburguesa */}
</div>
<div className="whatsapp-container" onClick={() => alert('Connecting to WhatsApp')}>
<img src={whatsapp} className="whatsapp-icon" alt="WhatsApp" />
</div>
{menuOpen && ( // Mostrar el menú si está abierto
<div className="navbar-dropdown">
<Link to="/inicio" className="footer-link" onClick={toggleMenu}>Inicio</Link>
<Link to="/mapa-navegacion" className="footer-link" onClick={toggleMenu}>Mapa</Link>
<Link to="/servicios" className="footer-link" onClick={toggleMenu}>Servicios</Link>
<Link to="/cerca" className="footer-link" onClick={toggleMenu}>A mi alrededor</Link>
import React from 'react';
import { Link } from 'react-router-dom';
import '../styles/navbar.css';
import { useAuth0 } from '@auth0/auth0-react';
import logo from '../assets/logo_oficial.png';

export default function NavBar() {
const { user, isLoading, loginWithRedirect, logout, isAuthenticated } = useAuth0();
console.log(user)
const getUserRoles = () => {
// Adjust this based on your Auth0 configuration
return user?.['https://your-namespace/roles'] || user?.roles || [];
};
const userRoles = getUserRoles();

return (
<div className="navbar">
<div className="navbar-content">
<img className="logo-image" src={logo}></img>
<Link to="/" className="navbar-logo">GEOMAPP</Link>

<div className="navbar-links">
<Link to="/inicio" className="nav-link">Inicio</Link>
<Link to="/mapa-navegacion" className="nav-link">Mapa</Link>
<Link to="/servicios" className="nav-link">Servicios</Link>
{/* <Link to="/hire-designers" className="nav-link">Hire Designers</Link> */}
{isAuthenticated && (<Link to="/publicaciones" className="nav-link">Publicaciones</Link>)}
{isAuthenticated && userRoles.includes('administrador') && (<Link to="/notificaciones" className="nav-link">Notificaciones</Link>)}
</div>


</div>
<div className="navbar-actions">

{isAuthenticated && (
<>
<Link to="/mi-perfil" className="footer-link" onClick={toggleMenu}>Mi Perfil</Link>
<Link to="/publicaciones" className="footer-link" onClick={toggleMenu}>Mis Publicaciones</Link>
<Link to="/favoritos" className="footer-link" onClick={toggleMenu}>Mis Favoritos</Link>
<Link to="/notificaciones" className="footer-link" onClick={toggleMenu}>Enviar notificaciones a usuarios</Link>
</>
)}
{!isAuthenticated ? (
<a className="sign-up" onClick={loginWithRedirect}>Iniciar sesión</a>
) : (
<div className="profile-container">
<Link to="/mi-perfil">
<img
src={user.picture}
className="profile-avatar"
/>
</Link>

</div>
)}

{!isAuthenticated && (
<a className="footer-link" onClick={() => { loginWithRedirect(); toggleMenu(); }}>Iniciar sesión</a>
)}
</div>
)}

</div>
);

</div>
);
}
export default NavBar;
8 changes: 7 additions & 1 deletion src/index.css
Original file line number Diff line number Diff line change
Expand Up @@ -72,4 +72,10 @@ button:focus-visible {
--principal-color: #fa7e02;
--principal-color-tr: #fa7e0250;
--secondary-color-gray-white: #f9f9f9;
}
font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Helvetica Neue", Arial, sans-serif;
}

/* Aplica San Francisco en todo el sitio */
html, body, #hello-world-container, .navbar, .footer, .content, .image-container, .info-section, .membership-section, .georent-footer, .contact-info {
font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Helvetica Neue", Arial, sans-serif;
}
2 changes: 1 addition & 1 deletion src/main.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ root.render(
authorizationParams={{
redirect_uri: window.location.origin,
audience: import.meta.env.VITE_AUTH0_AUDIENCE,
scope: 'openid read:users read:roles read:role_members read:profile'
scope: 'openid profile email read:users read:roles read:role_members read:profile'
}}
cacheLocation="localstorage"
>
Expand Down
Loading

0 comments on commit 7903b95

Please sign in to comment.