Simplified code

This commit is contained in:
Sarim-Sheikh-2003 2023-11-04 15:06:48 -06:00
parent 095e9aa1a6
commit 31282d5407
3 changed files with 8 additions and 30 deletions

View File

@ -1,18 +1,12 @@
// import OpenPage from "./OpenPage";
import { useNavigate } from "react-router-dom";
const DropdownMenu = () => {
const navigate = useNavigate();
const OpenPage = (arg) => {
navigate(arg);
console.log(arg);
};
return (
<div>
<button type = "button" onClick = {() => OpenPage('/JoinTheClub')}>Join the Club</button>
<button type = "button" onClick = {() => OpenPage('/UpcomingEvents')}>Upcoming Events</button>
<button type = "button" onClick = {() => navigate('/JoinTheClub')}>Join the Club</button>
<button type = "button" onClick = {() => navigate('/UpcomingEvents')}>Upcoming Events</button>
</div>
);
};

View File

@ -1,6 +1,5 @@
import logo from './logo.png';
import DropdownMenu from "./DropdownMenu";
// import OpenPage from "./OpenPage";
import { useNavigate } from "react-router-dom";
import { useState } from "react";
import { Outlet } from "react-router-dom";
@ -10,11 +9,6 @@ export default function Header() {
const [isDropdownVisible, setDropdownVisible] = useState(false);
const navigate = useNavigate();
const OpenPage = (arg) => {
navigate(arg);
console.log(arg);
};
const handleMouseEnter = () => {
setDropdownVisible(true);
};
@ -27,23 +21,22 @@ export default function Header() {
<>
<header>
<div>
<img style={{background: "gray"}} onClick = {() => OpenPage('/')} src={logo} alt="logo" />
<img onClick = {() => navigate('/')} src={logo} alt="logo" />
<p>Schulich Offroad</p>
</div>
<div>
<button type = "button" onClick = {() => OpenPage('/')}>About Us</button>
<button type = "button" onClick = {() => OpenPage('/Teams')}>Teams</button>
<button type = "button" onClick = {() => OpenPage('/OurSponsors')}>Our Sponsors</button>
<button type = "button" onClick = {() => OpenPage('/BecomeASponsor')}>Become a Sponsor</button>
<button type = "button" onClick = {() => navigate('/')}>About Us</button>
<button type = "button" onClick = {() => navigate('/Teams')}>Teams</button>
<button type = "button" onClick = {() => navigate('/OurSponsors')}>Our Sponsors</button>
<button type = "button" onClick = {() => navigate('/BecomeASponsor')}>Become a Sponsor</button>
<div
onMouseEnter={handleMouseEnter}
onMouseLeave={handleMouseLeave}
style={{background: "red"}}
>
<button type = "button">Club Membership & Upcoming Events</button>
{isDropdownVisible && <DropdownMenu />}
</div>
<button type = "button" onClick = {() => OpenPage('/Gallery')}>Gallery</button>
<button type = "button" onClick = {() => navigate('/Gallery')}>Gallery</button>
</div>
</header>
<Outlet />

View File

@ -1,9 +0,0 @@
import { useNavigate } from "react-router-dom";
const OpenPage = (arg) => {
const navigate = useNavigate();
navigate(arg);
console.log(arg);
};
export default OpenPage;