From acb4728b1df2fca6799f70af1370c8e19e19331d Mon Sep 17 00:00:00 2001
From: darkicewolf50 <brock.tomlinson@ucalgary.ca>
Date: Wed, 13 Mar 2024 14:11:42 -0600
Subject: [PATCH] changed name of OpenPage to be more clear added need for css

---
 src/Header/DropdownMenu.js |  6 +++---
 src/Header/Header.js       | 12 ++++++------
 src/Header/OpenPage.js     | 26 --------------------------
 3 files changed, 9 insertions(+), 35 deletions(-)
 delete mode 100644 src/Header/OpenPage.js

diff --git a/src/Header/DropdownMenu.js b/src/Header/DropdownMenu.js
index 80545d3..dca3cb8 100644
--- a/src/Header/DropdownMenu.js
+++ b/src/Header/DropdownMenu.js
@@ -1,4 +1,4 @@
-import OpenPage from "./OpenPage";
+import OpenPageButton from "./OpenPageButton";
 
 /**
  * @param {null} null -  Takes in nothing
@@ -9,11 +9,11 @@ import OpenPage from "./OpenPage";
 const DropdownMenu = () => {
 	return (
 		<div>
-			<OpenPage
+			<OpenPageButton
 				pageToGoTo={"/JoinTheClub"}
 				textOnButton={"Join the Club"}
 			/>
-			<OpenPage
+			<OpenPageButton
 				pageToGoTo={"/UpcomingEvents"}
 				textOnButton={"Upcoming Events"}
 			/>
diff --git a/src/Header/Header.js b/src/Header/Header.js
index 339f5e6..0501261 100644
--- a/src/Header/Header.js
+++ b/src/Header/Header.js
@@ -1,6 +1,6 @@
 import logo from "./logo.png";
 import DropdownMenu from "./DropdownMenu";
-import OpenPage from "./OpenPage";
+import OpenPageButton from "./OpenPageButton";
 import { useNavigate, Outlet } from "react-router-dom";
 import { useState } from "react";
 import "./Header.css";
@@ -46,19 +46,19 @@ const Header = () => {
 					<h2>Schulich Offroad</h2>
 				</div>
 				<nav>
-					<OpenPage
+					<OpenPageButton
 						pageToGoTo={"/"}
 						textOnButton={"About Us"}
 					/>
-					<OpenPage
+					<OpenPageButton
 						pageToGoTo={"/Teams"}
 						textOnButton={"Teams"}
 					/>
-					<OpenPage
+					<OpenPageButton
 						pageToGoTo={"/OurSponsors"}
 						textOnButton={"Our Sponsors"}
 					/>
-					<OpenPage
+					<OpenPageButton
 						pageToGoTo={"/BecomeASponsor"}
 						textOnButton={"Become a Sponsor"}
 					/>
@@ -69,7 +69,7 @@ const Header = () => {
 						<button type="button">Club Membership & Upcoming Events</button>
 						{isDropdownVisible && <DropdownMenu />}
 					</div>
-					<OpenPage
+					<OpenPageButton
 						pageToGoTo={"/Gallery"}
 						textOnButton={"Gallery"}
 					/>
diff --git a/src/Header/OpenPage.js b/src/Header/OpenPage.js
deleted file mode 100644
index 4bf6914..0000000
--- a/src/Header/OpenPage.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import { useNavigate } from "react-router-dom";
-
-/**
- * @param {String} pageToGoTo -  The page that the button goes to
- * @param {String} textOnButton - The Text tht will be on the button
- * @returns {JSX.Element} JSX - HTML tags and JS functionality
- * @description Button Template that moves you to the
- * @author Brock <darkicewolf50@gmail.com>
- * @todo refactor so that name is OpenPageButton
- */
-const OpenPage = ({ pageToGoTo, textOnButton }) => {
-	const navigate = useNavigate();
-	const navigateTo = (param) => {
-		navigate(param);
-	};
-
-	return (
-		<button
-			id="navigateButton"
-			onClick={() => navigateTo(pageToGoTo)}>
-			{textOnButton}
-		</button>
-	);
-};
-
-export default OpenPage;