From 87ddb9c28715a935b96c78e1fb785d1940194bd9 Mon Sep 17 00:00:00 2001 From: Aidan Traboulay Date: Mon, 3 Jun 2024 17:56:48 -0400 Subject: [PATCH] Refactor formatting and update docs --- src/components/Accordion.tsx | 37 +++++-- src/components/Button/Button.styles.ts | 15 ++- src/components/Button/Button.test.tsx | 7 +- src/components/Button/Button.tsx | 68 +++++++------ src/components/LoadingAnimation.tsx | 8 +- src/components/Navbar/Menu.tsx | 62 +++++++----- src/components/Navbar/NavItems.tsx | 80 +++++++++------ src/components/Navbar/Navbar.tsx | 21 ++-- src/components/ScrollButton.tsx | 7 ++ src/components/SocialIcons.tsx | 97 +++++++++++-------- src/components/index.tsx | 60 +++++++++++- src/components/sections/Contact.section.tsx | 15 ++- src/components/sections/Footer.section.tsx | 11 ++- src/components/sections/HeroStats.section.tsx | 84 +++++++++------- src/components/sections/Sponsor.section.tsx | 19 +++- src/components/sections/TeamFAQ.section.tsx | 34 ++++++- src/components/sections/data/faqData.ts | 2 +- src/components/sections/data/index.ts | 16 ++- src/components/sections/data/sponsorData.ts | 2 +- src/components/sections/data/teamData.ts | 2 +- src/index.css | 28 ++++++ src/main.tsx | 14 ++- src/pages/404.tsx | 8 ++ src/pages/ComingSoon.tsx | 9 +- src/pages/Landing.tsx | 13 ++- src/utils/Analytics.tsx | 7 +- src/utils/Router.tsx | 14 ++- src/utils/SocialLinks.tsx | 7 +- src/utils/index.tsx | 14 +++ 29 files changed, 548 insertions(+), 213 deletions(-) diff --git a/src/components/Accordion.tsx b/src/components/Accordion.tsx index 55141e68..bd015646 100644 --- a/src/components/Accordion.tsx +++ b/src/components/Accordion.tsx @@ -1,21 +1,47 @@ import React, { useState } from 'react'; + import { Button } from '@components'; + import { LuPlus, LuMinus } from 'react-icons/lu'; +/* + * + * @description Item interface + * @props {string} question, {string} answer + * + */ interface Item { question: string; answer: string; } +/* + * + * @description Section interface + * @props {string} section, {Item[]} content + * + */ interface Section { section: string; content: Item[]; } +/* + * + * @description Accordion interface + * @props {Section[]} sections + * + */ interface AccordionProps { sections: Section[]; } +/* + * + * @description Accordion component + * @props {Section[]} sections + * + */ const Accordion: React.FC = ({ sections }) => { const [activeIndex, setActiveIndex] = useState<{ section: number; @@ -75,10 +101,7 @@ const Accordion: React.FC = ({ sections }) => { return (
- {/* !remember to add back the md:grid-cols-2 here */}
- {/* for each section */} - {/* render the title and the content */} {sections.map((section, sectionIndex) => (
= ({ sections }) => { {section.section} - {/* contents of accordion item */} {section.content.map((item, questionIndex) => (
- {/* the accordion question */}
= ({ sections }) => { ? 'rounded-b-none' : '' }`} + onClick={() => toggleAccordion( sectionIndex, questionIndex ) } + role="button" >

@@ -127,7 +150,6 @@ const Accordion: React.FC = ({ sections }) => {

- {/* the accordion answer */}
= ({ sections }) => { person wakes up!

+ - ); + return ( + + ); }; + +export { Button }; \ No newline at end of file diff --git a/src/components/LoadingAnimation.tsx b/src/components/LoadingAnimation.tsx index 1f049049..670c0597 100644 --- a/src/components/LoadingAnimation.tsx +++ b/src/components/LoadingAnimation.tsx @@ -1,5 +1,11 @@ import { HawkHacksLogo } from '@assets'; +/* + * + * @description Loading animation component + * @props {void} + * + */ const LoadingAnimation: React.FC = () => { return (
@@ -12,4 +18,4 @@ const LoadingAnimation: React.FC = () => { ); }; -export { LoadingAnimation }; +export { LoadingAnimation }; \ No newline at end of file diff --git a/src/components/Navbar/Menu.tsx b/src/components/Navbar/Menu.tsx index e286dda2..319637b1 100644 --- a/src/components/Navbar/Menu.tsx +++ b/src/components/Navbar/Menu.tsx @@ -1,36 +1,50 @@ import { NavItems, Button } from '@components'; -import { logEvent, analytics } from '../../utils/Analytics'; +import { logEvent, analytics } from '@utils'; +/* + * + * @description Menu interface + * @props {boolean} showMenu, {void} hideMenu + * + */ interface MenuProp { - showMenu: boolean; - hideMenu: () => void; + showMenu: boolean; + hideMenu: () => void; } +/* + * + * @description Menu component + * @props {boolean} showMenu, {void} hideMenu + * + */ const Menu: React.FC = ({ showMenu, hideMenu }) => { - const openInNewTab = (url: string) => { - const newWindow = window.open(url, '_blank', 'noopener,noreferrer'); - if (newWindow) newWindow.opener = null; - }; + const openInNewTab = (url: string) => { + const newWindow = window.open(url, '_blank', 'noopener,noreferrer'); + if (newWindow) newWindow.opener = null; + }; - const handleSubmit = (e: React.MouseEvent) => { - e.preventDefault(); - openInNewTab('https://portal.hawkhacks.ca'); - logEvent(analytics, "click_application_portal_button"); - }; + const handleSubmit = (e: React.MouseEvent) => { + e.preventDefault(); + openInNewTab('https://portal.hawkhacks.ca'); + logEvent(analytics, "click_application_portal_button"); + }; - if (!showMenu) return null; + if (!showMenu) return null; - return ( -
- - -
- ); + return ( +
+ + +
+ ); }; export { Menu }; \ No newline at end of file diff --git a/src/components/Navbar/NavItems.tsx b/src/components/Navbar/NavItems.tsx index fda4ffb4..e4989e74 100644 --- a/src/components/Navbar/NavItems.tsx +++ b/src/components/Navbar/NavItems.tsx @@ -1,48 +1,66 @@ +import { logEvent, analytics } from '@utils'; + import { Link } from 'react-scroll'; -import { logEvent, analytics } from '../../utils/Analytics'; +/* + * + * @description Navbar items + * @props {boolean} isHorizontal, {void} handleClick + * + */ interface NavItemsProps { - isHorizontal: boolean; - handleClick: () => void; + isHorizontal: boolean; + handleClick: () => void; } +/* + * + * @description Navbar links + * + */ const links = [ - { title: 'About', href: 'about-anchor' }, - { title: 'Sponsors', href: 'sponsors-anchor', offset: 200 }, - { title: 'Partners', href: 'partners-anchor', offset: 20 }, - { title: 'FAQ', href: 'faq-anchor', offset: 120 }, - { title: 'The Team', href: 'team-anchor', offset: 180 }, - { title: 'Contact', href: 'contact-anchor', offset: 100 }, + { title: 'About', href: 'about-anchor' }, + { title: 'Sponsors', href: 'sponsors-anchor', offset: 200 }, + { title: 'Partners', href: 'partners-anchor', offset: 20 }, + { title: 'FAQ', href: 'faq-anchor', offset: 120 }, + { title: 'The Team', href: 'team-anchor', offset: 180 }, + { title: 'Contact', href: 'contact-anchor', offset: 100 }, ]; const rowStyle = 'flex-row items-center'; const colStyle = 'flex-col lg:p-0'; const navbarHeightPx = -88; +/* + * + * @description Navbar items component + * @props {boolean} isHorizontal, {void} handleClick + * + */ const NavItems: React.FC = ({ isHorizontal, handleClick }) => { - const handleLinkClick = (title: string) => { - logEvent(analytics, 'navbar_link_click', { title }); - handleClick(); - }; + const handleLinkClick = (title: string) => { + logEvent(analytics, 'navbar_link_click', { title }); + handleClick(); + }; - return ( -
    - {links.map((link) => ( -
  • - handleLinkClick(link.title)} - > - {link.title} - -
    • - ))} -
- ); + return ( +
    + {links.map((link) => ( +
  • + handleLinkClick(link.title)} + > + {link.title} + +
    • + ))} +
+ ); }; export { NavItems }; \ No newline at end of file diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx index dda41fdc..9ddac5b3 100644 --- a/src/components/Navbar/Navbar.tsx +++ b/src/components/Navbar/Navbar.tsx @@ -1,12 +1,21 @@ -import { useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; + import { NavItems, Menu, Button } from '@components'; + import { HawkHacksLogo, MlhBanner } from '@assets'; -import Hamburger from 'hamburger-react'; -// import { Link } from 'react-router-dom'; -import { logEvent, analytics } from '../../utils/Analytics'; + +import { logEvent, analytics } from '@utils'; + import { Link as ScrollLink } from 'react-scroll'; +import Hamburger from 'hamburger-react'; -const Navbar = () => { +/* + * + * @description Navbar component + * @props {void} + * + */ +const Navbar: React.FC = () => { const [showMenu, setShowMenu] = useState(false); const hideMenu = () => setShowMenu(false); @@ -99,4 +108,4 @@ const Navbar = () => { ); }; -export { Navbar }; +export { Navbar }; \ No newline at end of file diff --git a/src/components/ScrollButton.tsx b/src/components/ScrollButton.tsx index e6718fee..473bb15a 100644 --- a/src/components/ScrollButton.tsx +++ b/src/components/ScrollButton.tsx @@ -1,7 +1,14 @@ import React from 'react'; + import { Link } from 'react-scroll'; import { IoMdArrowUp } from "react-icons/io"; +/* + * + * @description Scroll button + * @props {void} + * + */ const ScrollButton: React.FC = () => { return (
diff --git a/src/components/SocialIcons.tsx b/src/components/SocialIcons.tsx index ab5d003d..566a5272 100644 --- a/src/components/SocialIcons.tsx +++ b/src/components/SocialIcons.tsx @@ -1,61 +1,74 @@ import React, { useState, useEffect } from "react"; + +import { logEvent, analytics, SocialLinks } from '@utils'; + import { RiInstagramLine, RiLinkedinLine, RiDiscordLine, RiTiktokLine } from "react-icons/ri"; import { FaRegEnvelope } from "react-icons/fa"; import { SiLinktree } from "react-icons/si"; -import { logEvent, analytics } from '../utils/Analytics'; -import { SocialLinks } from '@utils'; +/* + * + * @description Social media icons interface + * @props {string} color + * + */ interface SocialIconsProps { - color?: string; + color?: string; } +/* + * + * @description Social media icons + * @props {string} color + * + */ const SocialIcons: React.FC = ({ color = "currentColor" }) => { - const [iconSize, setIconSize] = useState(40); - const hoverColor = '#0FA3B1'; + const [iconSize, setIconSize] = useState(40); + const hoverColor = '#0FA3B1'; - useEffect(() => { - const handleResize = () => { - setIconSize(window.innerWidth < 640 ? 32 : 40); - }; + useEffect(() => { + const handleResize = () => { + setIconSize(window.innerWidth < 640 ? 32 : 40); + }; - window.addEventListener("resize", handleResize); - handleResize(); + window.addEventListener("resize", handleResize); + handleResize(); - return () => window.removeEventListener("resize", handleResize); - }, []); + return () => window.removeEventListener("resize", handleResize); + }, []); - const handleClick = (platform: string) => { - logEvent(analytics, 'social_icon_click', { platform }); - }; + const handleClick = (platform: string) => { + logEvent(analytics, 'social_icon_click', { platform }); + }; + + const SocialIconLink = ({ href, Icon, platform }: { href: string, Icon: React.ElementType, platform: string }) => { + const [iconColor, setIconColor] = useState(color); - const SocialIconLink = ({ href, Icon, platform }: { href: string, Icon: React.ElementType, platform: string }) => { - const [iconColor, setIconColor] = useState(color); + return ( + setIconColor(hoverColor)} + onMouseLeave={() => setIconColor(color)} + onClick={() => handleClick(platform)} + > + + + ); + }; return ( - setIconColor(hoverColor)} - onMouseLeave={() => setIconColor(color)} - onClick={() => handleClick(platform)} - > - - +
+ + + + + + +
); - }; - - return ( -
- - - - - - -
- ); }; -export { SocialIcons }; +export { SocialIcons }; \ No newline at end of file diff --git a/src/components/index.tsx b/src/components/index.tsx index 7ee4c376..1e224b6a 100644 --- a/src/components/index.tsx +++ b/src/components/index.tsx @@ -1,24 +1,78 @@ /* * - * @components + * @component Accordion * */ export { Accordion } from './Accordion'; + +/* + * + * @component Button + * + */ export { Button } from './Button/Button'; + +/* + * + * @component Navbar + * + */ export { NavItems } from './Navbar/NavItems'; export { Navbar } from './Navbar/Navbar'; export { Menu } from './Navbar/Menu'; + +/* + * + * @component Loading Animation + * + */ export { LoadingAnimation } from './LoadingAnimation'; + +/* + * + * @component Scroll Button + * + */ export { ScrollButton } from './ScrollButton'; + +/* + * + * @component Social Icons + * + */ export { SocialIcons } from './SocialIcons'; /* * - * @sections + * @section Hero / Stats Section * */ export { HeroStatSection } from './sections/HeroStats.section'; + +/* + * + * @section Team / FAQ Section + * + */ export { TeamFAQSection } from './sections/TeamFAQ.section'; + +/* + * + * @section Contact Section + * + */ export { ContactSection } from './sections/Contact.section'; + +/* + * + * @section Footer Section + * + */ export { FooterSection } from './sections/Footer.section'; -export { SponsorSection } from './sections/Sponsor.section'; + +/* + * + * @section Sponsor Section + * + */ +export { SponsorSection } from './sections/Sponsor.section'; \ No newline at end of file diff --git a/src/components/sections/Contact.section.tsx b/src/components/sections/Contact.section.tsx index 0d21e2b6..af1f4c8c 100644 --- a/src/components/sections/Contact.section.tsx +++ b/src/components/sections/Contact.section.tsx @@ -1,7 +1,14 @@ import React from 'react'; + import { TopBorder, BottomBorder, MiddleBody, Hawk, BirdParts } from '@assets'; import { Button, SocialIcons } from '@components'; +/* + * + * @description Contact section + * @props {void} + * + */ const ContactSection: React.FC = () => { const openInNewTab = (url: string) => { const newWindow = window.open(url, '_blank', 'noopener,noreferrer'); @@ -9,7 +16,7 @@ const ContactSection: React.FC = () => { }; const handleSubmit = (e: React.MouseEvent) => { - e.preventDefault(); // Prevent default form submission behavior + e.preventDefault(); openInNewTab('http://eepurl.com/hDHf8b'); }; @@ -26,6 +33,7 @@ const ContactSection: React.FC = () => { className="absolute right-0 top-0 z-50 w-full max-w-5xl -translate-y-[42.5%] xl:right-10 2xl:right-52" alt="" /> +

{ HawkHacks Discord community!

+
@@ -54,12 +63,14 @@ const ContactSection: React.FC = () => {
+
+ { ); }; -export { ContactSection }; +export { ContactSection }; \ No newline at end of file diff --git a/src/components/sections/Footer.section.tsx b/src/components/sections/Footer.section.tsx index fec41ff6..ed1d89b6 100644 --- a/src/components/sections/Footer.section.tsx +++ b/src/components/sections/Footer.section.tsx @@ -1,11 +1,18 @@ import { SocialIcons } from "@components"; -const FooterSection = () => { +/* + * + * @description Footer section + * @props {void} + * + */ +const FooterSection: React.FC = () => { return (
+ +

Copyright © 2024 HawkHacks

diff --git a/src/components/sections/HeroStats.section.tsx b/src/components/sections/HeroStats.section.tsx index 71f20c3b..fdef851f 100644 --- a/src/components/sections/HeroStats.section.tsx +++ b/src/components/sections/HeroStats.section.tsx @@ -8,13 +8,18 @@ import { // import { Button } from '@components'; +/* + * + * @description Hero section & Stats for HawkHacks 2024 + * @props {void} + * + */ const HeroStatSection: React.FC = () => { const [translateY, setTranslateY] = useState(0); const heroRef = useRef(null); const aboutRef = useRef(null); const handleScroll = () => { - // Control the speed at which the Balloon travels const newTranslateY = window.scrollY * 0.58; setTranslateY(newTranslateY); }; @@ -41,15 +46,20 @@ const HeroStatSection: React.FC = () => { } }, []); - // const openInNewTab = (url: string) => { - // // const newWindow = window.open(url, '_blank', 'noopener,noreferrer'); - // // if (newWindow) newWindow.opener = null; - // // }; - - // const handleSubmit = (e: React.MouseEvent) => { - // e.preventDefault(); - // openInNewTab('https://hawkhacks.ca/sponsorships.pdf'); - // }; + { + // Utility functions for the sponsorship button - hidden after the hackathon was over + /* + const openInNewTab = (url: string) => { + const newWindow = window.open(url, '_blank', 'noopener,noreferrer'); + if (newWindow) newWindow.opener = null; + }; + + const handleSubmit = (e: React.MouseEvent) => { + e.preventDefault(); + openInNewTab('https://hawkhacks.ca/sponsorships.pdf'); + }; + */ + } return (
@@ -58,7 +68,6 @@ const HeroStatSection: React.FC = () => { className="hero-section stacked bg-gradient-to-b from-peachPuff to-brightUbe sm:place-items-start" id="top" > - {/* preload these two images */} Hawkhacks stats { width="1920" height="8127" /> +
{

HawkHacks 2024

+

Hosted at Wilfrid Laurier University

- HawkHacks 2024 is{' '} - officially over. Check out our{' '} + HawkHacks 2024 is{' '} officially over. Check out our{' '} { rel="noopener noreferrer" > Instagram - {' '} - for highlights, and{' '} + {' '} for highlights, and{' '} { rel="noopener noreferrer" > TaiKai - {' '} - for all project submissions. + {' '} for all project submissions.

- Thank you to - everyone who made HawkHacks possible, until next - time! 💖 + Thank you to everyone who made HawkHacks possible, until next time! 💖

- {/*
-

- Interested in sponsoring us? -

- - -
*/} + { + // Button for sponsorship - hidden after the hackathon was over + /* +
+

+ Interested in sponsoring us? +

+ + +
+ */ + }
@@ -151,6 +162,7 @@ const HeroStatSection: React.FC = () => {

+
{

- {/* Hawk Air Balloon */} + { const openInNewTab = (url: string) => { const newWindow = window.open(url, '_blank', 'noopener,noreferrer'); @@ -31,6 +40,7 @@ const SponsorSection = () => { alt="" className="absolute left-0 top-0 z-50 w-full max-w-5xl -translate-x-2 -translate-y-[42.5%] scale-x-[-1] md:-translate-x-3 xl:left-10 2xl:left-52" /> +
@@ -40,6 +50,7 @@ const SponsorSection = () => { > SPONSORS +

Thanks to our dedicated sponsors, we're able @@ -52,6 +63,7 @@ const SponsorSection = () => { Further sponsor updates coming soon!

+
+
); }; -export { SponsorSection }; +export { SponsorSection }; \ No newline at end of file diff --git a/src/components/sections/TeamFAQ.section.tsx b/src/components/sections/TeamFAQ.section.tsx index 54aec503..add262f2 100644 --- a/src/components/sections/TeamFAQ.section.tsx +++ b/src/components/sections/TeamFAQ.section.tsx @@ -1,7 +1,9 @@ -import { FaqBackground } from '@assets'; import { departments, faqData } from './data'; + import { Accordion } from '@components'; + import { + FaqBackground, Clouds, MeetTheTeamBalloon, MeetTheTeamBanner, @@ -9,6 +11,12 @@ import { MeetTheTeamBuildingRight, } from '@assets'; +/* + * + * @description Member interface + * @props {string} name, {string} title, {string} profile, {string} company (optional) + * + */ interface Member { name: string; title: string; @@ -16,17 +24,30 @@ interface Member { company?: string; } +/* + * + * @description DepartmentProps interface + * @props {string} title, {Member[]} members + * + */ interface DepartmentProps { title: string; members: Member[]; } +/* + * + * @description Department component + * @props {string} title, {Member[]} members + * + */ const Department: React.FC = ({ title, members }) => { return (

{title}

+
    {members.map((member, index) => (
  • @@ -57,9 +78,14 @@ const Department: React.FC = ({ title, members }) => { ); }; -const TeamFAQSection = () => { +/* + * + * @description TeamFAQSection component + * @props {void} + * + */ +const TeamFAQSection: React.FC = () => { return ( - // currently this div is the container of both faq and team section
    @@ -125,4 +151,4 @@ const TeamFAQSection = () => { ); }; -export { TeamFAQSection }; +export { TeamFAQSection }; \ No newline at end of file diff --git a/src/components/sections/data/faqData.ts b/src/components/sections/data/faqData.ts index 8826475d..26fbb989 100644 --- a/src/components/sections/data/faqData.ts +++ b/src/components/sections/data/faqData.ts @@ -76,4 +76,4 @@ const faqData = [ }, ]; -export { faqData }; +export { faqData }; \ No newline at end of file diff --git a/src/components/sections/data/index.ts b/src/components/sections/data/index.ts index f06cca5f..f9d2b46d 100644 --- a/src/components/sections/data/index.ts +++ b/src/components/sections/data/index.ts @@ -1,8 +1,20 @@ /* * - * @data + * @data departments * */ export { departments } from './teamData'; + +/* + * + * @data faqData + * + */ export { faqData } from './faqData'; -export { sponsors } from './sponsorData'; + +/* + * + * @data sponsors + * + */ +export { sponsors } from './sponsorData'; \ No newline at end of file diff --git a/src/components/sections/data/sponsorData.ts b/src/components/sections/data/sponsorData.ts index b3ac380a..2c8b6eda 100644 --- a/src/components/sections/data/sponsorData.ts +++ b/src/components/sections/data/sponsorData.ts @@ -387,4 +387,4 @@ const sponsors = { partners, }; -export { sponsors }; +export { sponsors }; \ No newline at end of file diff --git a/src/components/sections/data/teamData.ts b/src/components/sections/data/teamData.ts index 92e1910d..48c55a65 100644 --- a/src/components/sections/data/teamData.ts +++ b/src/components/sections/data/teamData.ts @@ -295,4 +295,4 @@ const departments = [ } ]; -export { departments }; +export { departments }; \ No newline at end of file diff --git a/src/index.css b/src/index.css index 5ba88f10..8c73597e 100644 --- a/src/index.css +++ b/src/index.css @@ -1,9 +1,20 @@ @import url('https://fonts.googleapis.com/css2?family=Raleway:wght@100;200;300;400;500;600;700;800;900&display=swap'); +/* + * + * @description Tailwind CSS v^3.3.5 + * @see https://tailwindcss.com/docs + * + */ @tailwind base; @tailwind components; @tailwind utilities; +/* + * + * @description Global styles for the entire application + * + */ body { font-variant-numeric: lining-nums; font-feature-settings: 'lnum' 1; @@ -15,6 +26,11 @@ img { aspect-ratio: attr(width) / attr(height); } +/* + * + * @description Default styles for the entire application + * + */ @layer base { h1 { @apply text-8xl font-extrabold 2xl:text-8.5xl; @@ -42,6 +58,11 @@ img { } } +/* + * + * @description Component styles for the entire application + * + */ @layer components { .gradient { background: linear-gradient( @@ -53,6 +74,12 @@ img { } } + +/* + * + * @description Utility styles for the entire application + * + */ @layer utilities { .stacked { display: grid; @@ -89,6 +116,7 @@ header::before { from { transform: rotate(0deg); } + to { transform: rotate(360deg); } diff --git a/src/main.tsx b/src/main.tsx index 27a35419..17ac18fa 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -1,11 +1,17 @@ import React from 'react' import ReactDOM from 'react-dom/client' + import './index.css' import { Router } from '@utils' +/* + * + * @description Render the Router component + * + */ ReactDOM.createRoot(document.getElementById('root')!).render( - - - , -) + + + , +); \ No newline at end of file diff --git a/src/pages/404.tsx b/src/pages/404.tsx index f11d523c..7d733597 100644 --- a/src/pages/404.tsx +++ b/src/pages/404.tsx @@ -1,5 +1,11 @@ import { ExternalBalloon, MeetTheTeamBuildingLeft } from "@assets"; +/* + * + * @description Error page + * @props {void} + * + */ const ErrorPage: React.FC = () => { return (
    { alt="Balloon" className="absolute top-0 right-0 w-1/4 max-w-md" /> + Building +

    diff --git a/src/pages/ComingSoon.tsx b/src/pages/ComingSoon.tsx index a4ae12da..af44a8d8 100644 --- a/src/pages/ComingSoon.tsx +++ b/src/pages/ComingSoon.tsx @@ -2,6 +2,12 @@ import { Link } from 'react-router-dom'; import { ExternalBalloon, MeetTheTeamBuildingLeft } from '@assets'; import { Button } from '@components'; +/* + * + * @description Coming Soon page + * @props {void} + * + */ const ComingSoon: React.FC = () => { const openInNewTab = (url: string) => { const newWindow = window.open(url, '_blank', 'noopener,noreferrer'); @@ -72,5 +78,4 @@ const ComingSoon: React.FC = () => { ); }; -export { ComingSoon }; - +export { ComingSoon }; \ No newline at end of file diff --git a/src/pages/Landing.tsx b/src/pages/Landing.tsx index 96c25210..d11aa5d0 100644 --- a/src/pages/Landing.tsx +++ b/src/pages/Landing.tsx @@ -10,8 +10,14 @@ import { LoadingAnimation, } from '@components'; import { HeroAboutDesktop, HeroAboutMobile } from '@assets'; -import { logEvent, analytics } from '../utils/Analytics'; +import { logEvent, analytics } from '@utils'; +/* + * + * @description Landing page + * @props {void} + * + */ const Landing: React.FC = () => { const [desktopImageLoaded, setDesktopImageLoaded] = useState(false); const [mobileImageLoaded, setMobileImageLoaded] = useState(false); @@ -23,17 +29,14 @@ const Landing: React.FC = () => { ); useEffect(() => { - // Load Desktop SVG const desktopImage = new Image(); desktopImage.src = HeroAboutDesktop; desktopImage.onload = () => setDesktopImageLoaded(true); - // Load Mobile SVG const mobileImage = new Image(); mobileImage.src = HeroAboutMobile; mobileImage.onload = () => setMobileImageLoaded(true); - // Timer setTimeout(() => setTimerFinished(true), 2000); }, []); @@ -91,4 +94,4 @@ const Landing: React.FC = () => { ); }; -export { Landing }; +export { Landing }; \ No newline at end of file diff --git a/src/utils/Analytics.tsx b/src/utils/Analytics.tsx index 84d94a37..1fee1983 100644 --- a/src/utils/Analytics.tsx +++ b/src/utils/Analytics.tsx @@ -1,6 +1,11 @@ import { initializeApp } from 'firebase/app'; import { getAnalytics, logEvent } from 'firebase/analytics'; +/* + * + * @description Firebase configuration object + * + */ const firebaseConfig = { apiKey: import.meta.env.VITE_FIREBASE_API_KEY, authDomain: import.meta.env.VITE_FIREBASE_AUTH_DOMAIN, @@ -12,9 +17,7 @@ const firebaseConfig = { measurementId: import.meta.env.VITE_FIREBASE_MEASUREMENT_ID }; -// Initialize Firebase const app = initializeApp(firebaseConfig); -// Initialize Firebase Analytics and export it for use across the application export const analytics = getAnalytics(app); export { logEvent }; \ No newline at end of file diff --git a/src/utils/Router.tsx b/src/utils/Router.tsx index e023edba..12d08c26 100644 --- a/src/utils/Router.tsx +++ b/src/utils/Router.tsx @@ -1,12 +1,20 @@ import { BrowserRouter, Routes, Route } from 'react-router-dom' import { ComingSoon, ErrorPage, Landing } from '@pages' +/* + * + * @description Router component + * @route "/": Landing page + * @route "/coming-soon": Coming soon page + * @route "*": Error page + * + */ const Router = () => ( - } /> - } /> - } /> + } /> + } /> + } /> ); diff --git a/src/utils/SocialLinks.tsx b/src/utils/SocialLinks.tsx index 77706141..d55410fb 100644 --- a/src/utils/SocialLinks.tsx +++ b/src/utils/SocialLinks.tsx @@ -1,3 +1,8 @@ +/* + * + * @description Social media links for HawkHacks + * + */ const Links = { email: "mailto:hello@hawkhacks.ca", linkedin: "https://linkedin.com/company/hawkhacks/", @@ -7,4 +12,4 @@ const Links = { linktree: "https://linktr.ee/hawkhacks", }; -export { Links }; +export { Links }; \ No newline at end of file diff --git a/src/utils/index.tsx b/src/utils/index.tsx index 6eca7eb4..9622dbc4 100644 --- a/src/utils/index.tsx +++ b/src/utils/index.tsx @@ -11,3 +11,17 @@ export { Router } from './Router'; * */ export { Links as SocialLinks } from './SocialLinks'; + +/* + * + * @utility Analytics + * + */ +export { analytics } from './Analytics'; + +/* + * + * @utility logEvent + * + */ +export { logEvent } from './Analytics'; \ No newline at end of file