diff --git a/components/CareerResourceCard.tsx b/components/CareerResourceCard.tsx new file mode 100644 index 0000000..93ba085 --- /dev/null +++ b/components/CareerResourceCard.tsx @@ -0,0 +1,42 @@ +// @ts-nocheck comment +import React from 'react'; +import styles from '../styles/CareersHub.module.css'; + +export default function CareerResourceCard({ resource, index }: any) { + const { title, category, description, link, image } = resource.fields; + const imgUrl = image ? 'https:' + image.fields.file.url : null; + + return ( + +
+ {imgUrl ? ( + // eslint-disable-next-line @next/next/no-img-element + {title} + ) : ( +
+ No image +
+ )} +
+
+ {category &&

{category}

} +

{title}

+ {description && ( +

{description}

+ )} +
+
+ ); +} diff --git a/components/JoinUsGrid.tsx b/components/JoinUsGrid.tsx index fb63e87..74255c6 100644 --- a/components/JoinUsGrid.tsx +++ b/components/JoinUsGrid.tsx @@ -24,7 +24,7 @@ const portfolios = [ { key: 'publications', label: 'Publications', desc: publicationsDescription, styleId: styles.publications }, { key: 'socials', label: 'Socials', desc: socialsDescription, styleId: styles.socials }, { key: 'spons', label: 'Sponsorships', desc: sponsDescription, styleId: styles.spons }, - { key: 'education', label: 'Education', desc: eduDescription, styleId: styles.education }, + { key: 'education', label: 'Workshops', desc: eduDescription, styleId: styles.education }, ]; const PortfolioGrid = () => { diff --git a/data/navbar.ts b/data/navbar.ts index a2d6516..4c758ae 100644 --- a/data/navbar.ts +++ b/data/navbar.ts @@ -64,6 +64,11 @@ const sponsorsDropdownContent = [ link: '/sponsors/jobs-board', icon: WorkOutlineOutlinedIcon, }, + { + pageName: 'Careers Hub', + link: '/careers-hub', + icon: LocalLibraryOutlinedIcon, + }, ]; const eventsDropdownContent = [ diff --git a/lib/api.tsx b/lib/api.tsx index 6dec1b6..fee9b98 100644 --- a/lib/api.tsx +++ b/lib/api.tsx @@ -245,6 +245,21 @@ export async function loadLatestEvent() { return res.items; } +export async function loadCareerResources() { + const res = await client + .getEntries({ + content_type: 'careerResource', + select: 'fields', + order: 'fields.index', + limit: 1000, + }) + .catch((error) => { + console.error(error); + return null; + }); + return res ? res.items : []; +} + export async function loadLatestPodcast() { const res = await client .getEntries({ diff --git a/pages/careers-hub.tsx b/pages/careers-hub.tsx new file mode 100644 index 0000000..eb5afbd --- /dev/null +++ b/pages/careers-hub.tsx @@ -0,0 +1,155 @@ +// @ts-nocheck comment +import React, { useEffect, useState } from 'react'; +import styles from '../styles/CareersHub.module.css'; +import PageHeader from '../components/Header'; +import LoadingScreen from '../components/LoadingScreen'; +import ScrollUpBtn from '../components/ScrollUpBtn'; +import UpcomingEvent from '../components/UpcomingEvent'; +import { loadCareerResources, loadSponsors, loadUpcomingEvents } from '../lib/api'; +import Head from 'next/head'; +import { revalidate } from '../lib/helpers/constants'; +import Image from 'next/image'; +import useDarkMode from '../components/useDarkMode'; + +const PLATINUM_SPONSOR_ORDER = ['Jane Street (2026)', 'Atlassian (2026)', 'Audinate (2026)', 'Macquarie Group (2026)', 'PricewaterhouseCoopers (2026)']; + +const CareersHub = ({ careerResources, sponsors, upcomingEvents }: any) => { + const [headerLoading, setHeaderLoading] = useState(true); + const [sourceLoading] = useState(false); + const isDark = useDarkMode(); + + useEffect(() => { + window.scrollTo(0, 0); + }, []); + + const platinumSponsors = PLATINUM_SPONSOR_ORDER + .map((name) => sponsors.find((s: any) => s.fields.name === name)) + .filter(Boolean); + + const displayedEvents = upcomingEvents.slice(0, 3); + + return ( +
+ + Careers Hub | UNSW WIT + + {sourceLoading && headerLoading ? ( + + ) : ( + <> + +
+

+ Your one-stop destination for career resources, job opportunities, and professional + development. Explore internships, graduate roles, and curated resources to help you + kickstart your career in tech. +

+ + {/* Resources */} +

RESOURCES

+

+ Check out our career guides and resources from past years. +

+
+ {careerResources.length ? ( + careerResources.map((resource: any, index: number) => { + const { title, category, description, link } = resource.fields; + return ( + + {category && {category}} + {title} + {description && ( + {description} + )} + + + ); + }) + ) : ( +

+ Check back soon for career resources and guides! +

+ )} +
+ + {/* Platinum Sponsors */} +

SPONSORS

+
+ {platinumSponsors.map((sponsor: any, index: number) => { + const logoUrl = isDark + ? 'https:' + sponsor.fields.darkModeLogo.fields.file.url + : 'https:' + sponsor.fields.lightModeLogo.fields.file.url; + const descText = + sponsor.fields.description?.content?.[0]?.content?.[0]?.value || ''; + return ( +
+
+ {sponsor.fields.name} +
+ {descText &&

{descText}

} + + Visit website → + +
+ ); + })} +
+ + {/* Upcoming Events */} +

UPCOMING EVENTS

+

Check out what's coming up!

+ {!displayedEvents.length ? ( +

Keep a lookout here for upcoming events!

+ ) : ( +
+ {displayedEvents.map((event: any, index: number) => ( + + ))} +
+ )} + + +
+ + )} +
+ ); +}; + +export async function getStaticProps() { + const careerResources = await loadCareerResources(); + const sponsors = await loadSponsors(); + const upcomingEvents = await loadUpcomingEvents(); + return { + props: { + careerResources, + sponsors: sponsors || [], + upcomingEvents: upcomingEvents || [], + }, + revalidate: revalidate, + }; +} + +export default CareersHub; diff --git a/pages/join-us.tsx b/pages/join-us.tsx index 101e5e9..a1b2187 100644 --- a/pages/join-us.tsx +++ b/pages/join-us.tsx @@ -45,84 +45,20 @@ const JoinUs = () => { title="Join Us" imageLoading={setHeaderLoading} /> - {/* Start of connect with us */} -

Connect with us

-
-
-
- {Object.keys(socials).map((social, index) => { - return ( - -
{social}
- - } - > - - {social} - -
- ); - })} -
-
-
- {!hideSpinner ? ( - - ) : null} -