From e78396b70a6a6cbbec1197c1222bab0e3e419719 Mon Sep 17 00:00:00 2001 From: darkicewolf50 Date: Tue, 12 Mar 2024 10:57:50 -0600 Subject: [PATCH] code base cleaned up --- src/BecomeASponsor/BecomeASponsor.js | 12 ++- src/Header/Header.js | 107 ++++++++++++++++----------- src/Header/OpenPage.js | 26 +++++-- src/OurSponsors/OurSponsors.css | 2 +- src/OurSponsors/OurSponsors.js | 47 +++++------- 5 files changed, 115 insertions(+), 79 deletions(-) diff --git a/src/BecomeASponsor/BecomeASponsor.js b/src/BecomeASponsor/BecomeASponsor.js index cbdac36..df6953b 100644 --- a/src/BecomeASponsor/BecomeASponsor.js +++ b/src/BecomeASponsor/BecomeASponsor.js @@ -9,7 +9,7 @@ import "./BecomeASponsor.css"; */ const BecomeASponsor = () => { return ( -
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent sed @@ -25,12 +25,16 @@ const BecomeASponsor = () => { diam metus sit amet odio. Sed aliquam nulla eu dolor commodo efficitur.

- + Student Driving the Green (2019 Car)
Sponsorship Package with Benefits + src="https://res.cloudinary.com/dpgrgsh7g/image/upload/v1708797415/Screenshot_from_2024-02-24_10-52-24_nsn9uv.png" + alt="Sponsorship Package with Benefits" + />

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus laoreet nulla eget posuere suscipit. Curabitur vitae porta velit. Nunc diff --git a/src/Header/Header.js b/src/Header/Header.js index 9d53f58..28daf4d 100644 --- a/src/Header/Header.js +++ b/src/Header/Header.js @@ -1,52 +1,75 @@ -import logo from './logo.png'; +import logo from "./logo.png"; import DropdownMenu from "./DropdownMenu"; // import OpenPage from "./OpenPage"; -import { useNavigate } from "react-router-dom"; +import { useNavigate, Outlet } from "react-router-dom"; import { useState } from "react"; -import { Outlet } from "react-router-dom"; import "./Header.css"; export default function Header() { - const [isDropdownVisible, setDropdownVisible] = useState(false); - const navigate = useNavigate(); + const [isDropdownVisible, setDropdownVisible] = useState(false); + const navigate = useNavigate(); - const OpenPage = (arg) => { - navigate(arg); - console.log(arg); - }; + const OpenPage = (arg) => { + navigate(arg); + console.log(arg); + }; - const handleMouseEnter = () => { - setDropdownVisible(true); - }; + const handleMouseEnter = () => { + setDropdownVisible(true); + }; - const handleMouseLeave = () => { - setDropdownVisible(false); - }; + const handleMouseLeave = () => { + setDropdownVisible(false); + }; - return ( - <> -

-
- OpenPage('/')} src={logo} alt="logo" /> -

Schulich Offroad

-
-
- - - - -
- - {isDropdownVisible && } -
- -
-
- - - ); -}; \ No newline at end of file + return ( + <> +
+
+ OpenPage("/")} + src={logo} + alt="logo" + /> +

Schulich Offroad

+
+
+ + + + +
+ + {isDropdownVisible && } +
+ +
+
+ + + ); +} diff --git a/src/Header/OpenPage.js b/src/Header/OpenPage.js index dcd4ae1..e37c982 100644 --- a/src/Header/OpenPage.js +++ b/src/Header/OpenPage.js @@ -1,9 +1,25 @@ import { useNavigate } from "react-router-dom"; -const OpenPage = (arg) => { - const navigate = useNavigate(); - navigate(arg); - console.log(arg); +/** + * @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 + */ +const OpenPage = ({ pageToGoTo, textOnButton }) => { + const navigate = useNavigate(); + const navigateTo = (param) => { + navigate(param); + }; + + return ( + + ); }; -export default OpenPage; \ No newline at end of file +export default OpenPage; diff --git a/src/OurSponsors/OurSponsors.css b/src/OurSponsors/OurSponsors.css index 3f6e24f..7938902 100644 --- a/src/OurSponsors/OurSponsors.css +++ b/src/OurSponsors/OurSponsors.css @@ -34,7 +34,7 @@ #OurSponsors div div div div { display: flex; flex-direction: row; - justify-content: end; + justify-content: flex-end; padding: 0%; width: 100%; } diff --git a/src/OurSponsors/OurSponsors.js b/src/OurSponsors/OurSponsors.js index 54419b0..0fce47b 100644 --- a/src/OurSponsors/OurSponsors.js +++ b/src/OurSponsors/OurSponsors.js @@ -1,11 +1,8 @@ -import { useEffect } from "react"; -import { useState } from "react"; import "./OurSponsors.css"; +import { useEffect, useState } from "react"; import sponsorData from "../MockDB/sponsorship.yml"; -//can be removed later -import fakeDelay from "../TestingTools/fakeDelay"; -import { useNavigate } from "react-router-dom"; import yaml from "js-yaml"; +import OpenPage from "../Header/OpenPage"; /** * @param {null} null - requires onthing @@ -18,35 +15,26 @@ const OurSponsors = () => { const [sponsorsDict, setSponsorsDict] = useState(); //variable states for the dictionary of sponsors useEffect(() => { - //get sponsors on startup of page not optimized getSponsors(); }, []); - const OpenPage = (arg) => { - const navigate = useNavigate(); - navigate(arg); - console.log(arg); - }; - /** * @param {null} null - requires nothing (link) * @returns {Object} sponsorsDict - gets a Dictionary of our sponsors from synology drive * @description Gets the list of sponsors from the synology drive (not implemented), converts the json file into a dictionary * @author Brock - * @todo add gPRC to backend and front end + * @todo add gPRC to backend and front end add connect to synology drive */ const getSponsors = async () => { const res = await fetch(sponsorData); const rawText = await res.text(); const yamlDict = yaml.load(rawText); try { - await fakeDelay(1000); - console.log("It ran"); let res = yamlDict; setSponsorsDict(res); } catch (error) { //error checking - console.error("Error sending data to server:", error); + console.error("Error recieving data from server:"); } }; @@ -59,11 +47,12 @@ const OurSponsors = () => { return (
- +
-
+

Current Sponsors

{Object.keys(sponsorsDict).map((sponsorTier) => (
{ {sponsor.LogoUrl && ( Sponsor Logo )}
{sponsor.DescriptionAboutSponsor !== undefined && sponsor.DecriptionOnHelp !== undefined && - (sponsorTier != "Bronze Tier" || - sponsorTier != "Silver Tier") && ( + (sponsorTier !== "Bronze Tier" || + sponsorTier !== "Silver Tier") && (

Another Element

)}
{sponsor.DescriptionAboutSponsor !== undefined && - (sponsorTier != "Bronze Tier" || - sponsorTier != "Silver Tier") && ( + (sponsorTier !== "Bronze Tier" || + sponsorTier !== "Silver Tier") && (

{sponsor.DescriptionAboutSponsor}

)} {sponsor.DecriptionOnHelp !== undefined && - (sponsorTier != "Bronze Tier" || - sponsorTier != "Silver Tier") && ( + (sponsorTier !== "Bronze Tier" || + sponsorTier !== "Silver Tier") && (

{sponsor.DecriptionOnHelp}

)}