Merge branch 'main' of https://git.csclub.uwaterloo.ca/www/www-new into dark-theme

components/EventCard.module.css

@@ -31,6 +31,10 @@
   margin-bottom: 0;
 }
 
+.content > h1 a {
+  color: var(--primary-heading);
+}
+
 .content,
 .content > h2 {
   font-weight: 400;

components/EventCard.tsx

@@ -18,6 +18,10 @@ interface EventCardProps {
   permaLink: string;
   showDescription?: boolean;
   children: ReactNode;
+  year: string;
+  term: string;
+  slug: string;
+  titleLinked: boolean;
 }
 
 export function EventCard({
@@ -30,6 +34,10 @@ export function EventCard({
   registerLink,
   children,
   showDescription = false,
+  year,
+  term,
+  slug,
+  titleLinked,
 }: EventCardProps) {
   return (
     <article className={styles.card}>
@@ -54,7 +62,13 @@ export function EventCard({
           showDescription ? styles.mobileShowDescriptionContent : "",
         ].join(" ")}
       >
-        <h1>{name}</h1>
+        <h1>
+          {titleLinked ? (
+            <Link href={`/events/${year}/${term}/${slug}`}>{name}</Link>
+          ) : (
+            name
+          )}
+        </h1>
         <h2>
           <EventSetting date={date} online={online} location={location} />
         </h2>

components/MiniEventCard.module.css

@@ -23,6 +23,10 @@
   margin: 0;
 }
 
+.name a {
+  color: var(--primary-heading);
+}
+
 .nameSpacer {
   width: calc(140rem / 16);
 }

components/MiniEventCard.tsx

@@ -1,10 +1,11 @@
 import React, { ReactNode } from "react";
 
 import { EventSetting } from "./EventSetting";
+import { Link } from "./Link";
 
 import styles from "./MiniEventCard.module.css";
 
-interface Props {
+interface MiniEventCardProps {
   name: string;
   description: ReactNode;
   short: string;
@@ -12,9 +13,12 @@ interface Props {
   location: string;
   date: Date;
   background: "dark-bg" | "normal-bg";
+  year: string;
+  term: string;
+  slug: string;
 }
 
-export const MiniEventCard: React.FC<Props> = ({
+export const MiniEventCard: React.FC<MiniEventCardProps> = ({
   name,
   short,
   description,
@@ -22,6 +26,9 @@ export const MiniEventCard: React.FC<Props> = ({
   date,
   online,
   background,
+  year,
+  term,
+  slug,
 }) => {
   const cardBackground = background === "dark-bg" ? styles.darkBg : styles.card;
   return (
@@ -29,7 +36,7 @@ export const MiniEventCard: React.FC<Props> = ({
       <summary>
         <div onClick={(event) => event.preventDefault()}>
           <h2 className={styles.name}>
-            <div>{name}</div>
+            <Link href={`/events/${year}/${term}/${slug}`}>{name}</Link>
             <div className={styles.nameSpacer}></div>
           </h2>
           <div className={styles.info}>

content/events/2022/spring/BOT.md

@@ -0,0 +1,19 @@
+---
+name: 'BOT: In-person Speed-Friending + CSC Circles Intro'
+short: 'Kick off the spring term with CSC’s BOT event and meet others in the CS community!'
+date: 'May 12 2022 19:00'
+online: false
+location: 'DC 1350'
+poster: 'images/events/2022/spring/BOT.png'
+registerLink: https://bit.ly/s22-bot-signup
+---
+
+📢 Kick off the spring term with CSC’s BOT event! Are you interested in attending upcoming CSC events? Want to meet others in the CS community now that school is finally in-person? Come to our FIRST event of this term: In-person Speed-Friending event and the CSC circles kickoff!
+
+📌 You will be able to meet others in groups of 3 or 4, with around 10 minutes to talk. 🎤  An optional prompt will act as an icebreaker, but feel free to discuss anything you want! Before the speed-friending event, the details of CSC Circles will be discussed along with our quick intro, so if you’re interested in participating or learning more about CSC, be sure to attend! Even if you don’t want to be part of CSC Circles, you should join us for the speed-friending event 🥰
+
+👀 Just like last term, CSC Circles will consist of groups of 4-6 participants who will be matched to create recurring social circles based on your interests. CSC Circles will help you build meaningful connections over the course of a semester and beyond 🚀
+
+📆 When? May 12th 2022 at 7-9pm EST, in DC 1350
+
+👉 Register at  https://bit.ly/s22-bot-signup. Alternatively, you can also email us at exec@csclub.uwaterloo.ca to sign up.

content/events/2022/spring/Bootcamp-Mock-Interviews.md

@@ -0,0 +1,21 @@
+---
+name: 'Bootcamp: Mock Interviews'
+short: 'Come to practice your interview skills with experienced mentors!'
+date: 'May 21 2022 18:00'
+online: true
+location: 'Discord'
+poster: 'images/events/2022/spring/Bootcamp-Mentee-Applications.png'
+registerLink: https://bit.ly/s22-bootcamp-mentee-signup!
+---
+
+📢 Applications for Bootcamp are now OPEN! 📢 CSC is bringing back Bootcamp to gear you up for your next recruiting season, partnered with @uwaterloodsc, @uwblueprint, @uwaterloowics, @uwaterloopm, @uw_ux, and @techplusuw! 💻 Mock interviews take place May 21st 6:00 - 10:00 PM EST.
+
+💁‍♀️ Sign up as a mentee, and join our experienced mentors in Resume Reviews and Mock Interviews (virtual 1:1 sessions) to receive feedback from various tech backgrounds 📃 You will be paired with a mentor who is knowledgeable in the same or a similar career path to yours to ensure relevant feedback! 👌
+
+A mentor will be paired with you based on your career interests to provide insightful feedback and advice to rock your job search - don’t miss out! If you’re interested, please sign up! We would love to help you feel ready and confident for the upcoming job hunt. After signing up, you’ll soon receive a link to the Discord server in which this event takes place. Our collaborating clubs are excited to bring you this opportunity to sharpen your job hunting skills 🧠 If you’re interested, please apply!
+
+👉  Apply using this link https://bit.ly/s22-bootcamp-mentee-signup!
+
+Alternatively, you can email us at exec@csclub.uwaterloo.ca with the year and program you’re in, along with interested job paths.
+
+📅 Deadline to Apply: May 12th 2022, 11:59 PM EST

content/events/2022/spring/Bootcamp-Resume-Reviews.md

@@ -0,0 +1,21 @@
+---
+name: 'Bootcamp: Resume Reviews'
+short: 'Come to receive insightful feedback and advice on your resume to rock your job search!'
+date: 'May 14 2022 18:00'
+online: true
+location: 'Discord'
+poster: 'images/events/2022/spring/Bootcamp-Mentee-Applications.png'
+registerLink: https://bit.ly/s22-bootcamp-mentee-signup
+---
+
+📢 Applications for Bootcamp are now OPEN! 📢 CSC is bringing back Bootcamp to gear you up for your next recruiting season, partnered with @uwaterloodsc, @uwblueprint, @uwaterloowics, @uwaterloopm, @uw_ux, and @techplusuw! 💻 The drop-in resume review event takes place May 14th 6:00 - 10:00 PM EST.
+
+💁‍♀️ Sign up as a mentee, and join our experienced mentors in Resume Reviews and Mock Interviews (virtual 1:1 sessions) to receive feedback from various tech backgrounds 📃 You will be paired with a mentor who is knowledgeable in the same or a similar career path to yours to ensure relevant feedback! 👌
+
+A mentor will be paired with you based on your career interests to provide insightful feedback and advice to rock your job search - don’t miss out! If you’re interested, please sign up! We would love to help you feel ready and confident for the upcoming job hunt. After signing up, you’ll soon receive a link to the Discord server in which this event takes place. Our collaborating clubs are excited to bring you this opportunity to sharpen your job hunting skills 🧠 If you’re interested, please apply!
+
+👉  Apply using this link https://bit.ly/s22-bootcamp-mentee-signup!
+
+Alternatively, you can email us at exec@csclub.uwaterloo.ca with the year and program you’re in, along with interested job paths.
+
+📅 Deadline to Apply: May 12th 2022, 11:59 PM EST

content/events/2022/spring/Spring-2022-Elections.md

@@ -0,0 +1,14 @@
+---
+name: 'Spring 2022 Elections'
+short: 'CS Club will be holding elections for the Spring 2022 term on Thursday, May 5th at 5:30 pm in DC 1351.'
+date: 'May 5 2022 17:30'
+online: false
+location: 'DC 1351'
+poster: 'images/events/2022/spring/Spring-2022-Elections.png'
+---
+
+CS Club will be holding elections for the Spring 2022 term on Thursday, May 5th at 5:30 pm in DC 1351.
+Come to learn more about CSC, sign up for membership, and vote on our new execs!
+The president, vice-president, treasurer, and assistant vice-president will be elected, and the sysadmin will be appointed.
+
+If you have any questions about elections, please email cro@csclub.uwaterloo.ca.

content/events/2022/winter/CSC-Circles-Kick-Off-Vday-Speed-Friending.md

@@ -0,0 +1,19 @@
+---
+name: "CSC Circles Kick-Off & Valentine's Day Speed-Friending"
+short: "Attend to get details about CSC Circles, a new initiative to match participants in groups of 4-6 to create recurring social circles. There will also be a Valentine's Day themed Speed-Friending event after the info session."
+date: 'February 12 2022 16:00'
+online: true
+location: 'Zoom'
+poster: 'images/events/2022/winter/CSC-Circles-Kick-Off.png'
+registerLink: https://bit.ly/csc-circles-kickoff-signup
+---
+
+📢 This term, CSC will be kickstarting a NEW event called CSC Circles! We’ll be matching participants in groups of 4-6 to create recurring social circles based on your interests 🎮, availability ⏰, location 📍, and more!
+
+👀 Members of CSC Circles will be a part of a vibrant community within CSC, in which you have the chance to build meaningful connections over the course of a semester and hopefully beyond 🚀 !
+
+📌 The details of the program will be discussed during our kickoff event, so if you’re interested in participating, be sure to attend! You’ll have the chance to ask questions, meet the coordinators, and participate in a Valentine’s Day themed Speed-Friending event after the info session is done 💗.
+
+📅 Event Date: February 12th, 2022 at 4:00 PM EST online. Sign up for the kickoff event at https://bit.ly/csc-circles-kickoff-signup.
+
+👉 Sign up for CSC Circles at https://bit.ly/csc-circles-signup by February 17th, 2022 at 11:59 PM EST. Alternatively, you can also email us at exec@csclub.uwaterloo.ca to sign up as well.

content/events/2022/winter/Code-Party.md

@@ -0,0 +1,17 @@
+---
+name: "Code Party"
+short: "CS Club is hosting our first Code Party since the pandemic started. Come code and chill (in-person!) with us!"
+date: "March 25 2022 18:00"
+online: false
+location: "STC 0060"
+poster: "images/events/2022/winter/Code-Party.png"
+registerLink: "https://forms.gle/M4YzJeHpt2RiY1HHA"
+---
+
+CS Club is hosting our first Code Party since the pandemic started, from 6 pm until 9 pm in STC 0060, on Friday, March 25. Come code and chill (in-person!) with us!
+
+Personal projects you want to work on? Homework assignments you need to finish? Or want some time to explore new technology and meet new people in a casual, minimal-stress environment? You can do all this and more at our Code Party! All experience levels are welcome.
+
+Come any time after 6 pm. Food will be provided.
+
+Registration is not required, but it is highly recommended. Register at https://forms.gle/M4YzJeHpt2RiY1HHA. Alternatively, you can also email us at exec@csclub.uwaterloo.ca to let us know you're interested.

content/events/2022/winter/EOT.md

@@ -0,0 +1,25 @@
+---
+name: 'CSC EOT Social Night'
+short: 'CSC is hosting a fun night of activities to celebrate the end of the term, with scavenger hunts, trivia, paint night sessions, board games, charades and more! '
+date: 'April 03 2022 18:00'
+online: false
+location: 'DC 1351'
+poster: 'images/events/2022/winter/EOT.png'
+registerLink: https://bit.ly/w22-eot-signup
+---
+
+ 📢 Phew, what a term! CSC is hosting a fun night of activities to celebrate the end of the term, with scavenger hunts, trivia, paint night sessions, board games, charades and more! 
+
+🎉 Come join us on Sunday April 3rd, from 6-7PM for the Scavenger Hunt, and 7-9PM for our night of activities!
+
+✨Some reminders before attending our event:
+1. Registration is required to attend our in-person event - register at https://bit.ly/w22-eot-signup!
+2. Please remember to keep face coverings on at all times when you’re indoors.
+3. There are limited quantities for paint supplies! First come, first serve 🎨
+4. Make sure to bring your WATcard in order to win prizes! Only those that have paid MathSoc fees in their tuition will be able to receive the prizes for activities.
+
+🥳 This event is limited to those with a CSC membership. If you’d like to sign up for one, visit https://csclub.uwaterloo.ca/get-involved/ or come with your watcard on the day of to sign up for FREE!
+
+📆 Event Date: April 3rd at 6-9PM ET at DC 1351
+
+👉 Register at https://bit.ly/w22-eot-signup. Alternatively, you can email us at exec@csclub.uwaterloo.ca to sign up.

content/events/2022/winter/Project-Program-Kick-Off.md

@@ -0,0 +1,22 @@
+---
+name: 'Project Program Kick-Off'
+short: 'Attend to get details about Project Program, a month-long event that will have mentors support your team in creating a side-project.'
+date: 'January 28 2022 19:00'
+online: true
+location: 'Zoom'
+poster: 'images/events/2022/winter/Project-Program-Kick-Off.png'
+registerLink: https://forms.gle/b6e2vda7Y8wDfBLdA
+---
+
+📢 Project Program is back for Winter 2022, and we’re excited to see mentors support you to create a month-long project!
+
+DSC and CSC are collaborating again to help you create your side project by guiding your group of mentees through brainstorming project ideas, creating roadmaps with milestones and achievements, and finally presenting your project for the chance to win prizes! 🏆
+
+📌 The details of the program will be discussed during this event, so if you’re interested in participating, be sure to attend!
+
+📅 Event Date: Friday, January 28th from 7:00-8:00pm EDT on Zoom. 💻
+https://us06web.zoom.us/j/89144349767?pwd=Z3BZREI0MGNRWXdFWmZMM1JRVU5CQT09
+
+👉  No need to register, but we'll send you an email alert if you do! Sign up at https://forms.gle/b6e2vda7Y8wDfBLdA. Alternatively, you can also email us at exec@csclub.uwaterloo.ca to sign up as well.
+
+See you then! 👋

content/events/2022/winter/Switching-Fields-Panel.md

@@ -0,0 +1,19 @@
+---
+name: 'Switching Fields Panel'
+short: 'Listen in as our amazing panelists discuss their experiences with shifting career fields when searching for co-op.'
+date: 'March 11 2022 18:00'
+online: true
+location: 'Zoom'
+poster: 'images/events/2022/winter/Switching-Fields-Panel.png'
+registerLink: https://bit.ly/3HazgpU
+---
+
+Want to move away from web development for your next co-op? Need advice on a general career switch? CSC is proud to be hosting our Switching Fields Panel! Listen in as our amazing panelists discuss their experiences with shifting career fields when searching for co-op.
+
+Registration is not required to attend but we’ll be sending you an email reminder if you register and inviting you to the calendar event!
+
+📅 Event Date: Firday March 11th, 6-7pm EST on Zoom
+
+👉 Register using this link: https://bit.ly/3HazgpU
+
+Hope to see you at the event! 🤗

content/events/2022/winter/Tesla-Autopilot-Coffee-Chat.md

@@ -0,0 +1,21 @@
+---
+name: "Tesla Autopilot and Tesla Bot Coffee Chat"
+short: "Join 3 special events with Tesla engineers and learn more about internships and new grad roles in AI, Autopilot, and Vehicle software!"
+date: 'March 9 2022 19:00'
+online: true
+location: 'Online'
+poster: 'images/events/2022/winter/Tesla-Autopilot-Coffee-Chat.png'
+registerLink: https://forms.office.com/Pages/ResponsePage.aspx?id=9MUmkNCGn0u9ObfU0PtGdG9a0mm6j6BFvW5CeQngudlUOUczS1ZWQkJTRTVTQzA5MlA1N005UjVaTy4u
+---
+
+🎉 It's that time of year again! CSC is bringing back our partnership with Tesla for multiple coffee chat events!
+
+🚘 Join 3 special events with Tesla engineers and learn more about internships and new grad roles in AI, Autopilot, and Vehicle software!
+
+The **Autopilot and Tesla Bot** coffee chat will be on March 9th from 7-8PM EST. All students interested in autonomy, robotics, embedded systems and AI/ML are welcome to join!
+
+✨ A private application link will be added for each coffee chat per team to sign up for internships for Fall 2022!
+
+🍴 All attendees will also have a chance to win a $25 Uber Eats gift card!
+
+👉 Sign up at: https://forms.office.com/Pages/ResponsePage.aspx?id=9MUmkNCGn0u9ObfU0PtGdG9a0mm6j6BFvW5CeQngudlUOUczS1ZWQkJTRTVTQzA5MlA1N005UjVaTy4u

content/events/2022/winter/Tesla-Vehicle-Software-Development-Coffee-Chat.md

@@ -0,0 +1,21 @@
+---
+name: "Tesla Vehicle Software Development Coffee Chat"
+short: "Join 3 special events with Tesla engineers and learn more about internships and new grad roles in AI, Autopilot, and Vehicle software!"
+date: 'March 23 2022 19:00'
+online: true
+location: 'Online'
+poster: 'images/events/2022/winter/Tesla-Autopilot-Coffee-Chat.png'
+registerLink: https://forms.office.com/Pages/ResponsePage.aspx?id=9MUmkNCGn0u9ObfU0PtGdG9a0mm6j6BFvW5CeQngudlUOUczS1ZWQkJTRTVTQzA5MlA1N005UjVaTy4u
+---
+
+🎉 It's that time of year again! CSC is bringing back our partnership with Tesla for multiple coffee chat events!
+
+🚘 Join 3 special events with Tesla engineers and learn more about internships and new grad roles in AI, Autopilot, and Vehicle software!
+
+The **Vehicle Software Development** coffee chat will be on March 23rd from 7-8PM EST. All students interested in full stack development, infotainment, and creating fun applications are welcome to join!
+
+✨ A private application link will be added for each coffee chat per team to sign up for internships for Fall 2022!
+
+🍴 All attendees will also have a chance to win a $25 Uber Eats gift card!
+
+👉 Sign up at: https://forms.office.com/Pages/ResponsePage.aspx?id=9MUmkNCGn0u9ObfU0PtGdG9a0mm6j6BFvW5CeQngudlUOUczS1ZWQkJTRTVTQzA5MlA1N005UjVaTy4u

content/events/2022/winter/Tesla-Vehicle-Software-Systems-Coffee-Chat.md

@@ -0,0 +1,21 @@
+---
+name: "Tesla Vehicle Software Systems Coffee Chat"
+short: "Join 3 special events with Tesla engineers and learn more about internships and new grad roles in AI, Autopilot, and Vehicle software!"
+date: 'March 16 2022 19:00'
+online: true
+location: 'Online'
+poster: 'images/events/2022/winter/Tesla-Autopilot-Coffee-Chat.png'
+registerLink: https://forms.office.com/Pages/ResponsePage.aspx?id=9MUmkNCGn0u9ObfU0PtGdG9a0mm6j6BFvW5CeQngudlUOUczS1ZWQkJTRTVTQzA5MlA1N005UjVaTy4u
+---
+
+🎉 It's that time of year again! CSC is bringing back our partnership with Tesla for multiple coffee chat events!
+
+🚘 Join 3 special events with Tesla engineers and learn more about internships and new grad roles in AI, Autopilot, and Vehicle software!
+
+The **Vehicle Software Systems** coffee chat will be on March 16th from 7-8PM EST. All students interested in firmware, hardware, and Integration are welcome to join!
+
+✨ A private application link will be added for each coffee chat per team to sign up for internships for Fall 2022!
+
+🍴 All attendees will also have a chance to win a $25 Uber Eats gift card!
+
+👉 Sign up at: https://forms.office.com/Pages/ResponsePage.aspx?id=9MUmkNCGn0u9ObfU0PtGdG9a0mm6j6BFvW5CeQngudlUOUczS1ZWQkJTRTVTQzA5MlA1N005UjVaTy4u

content/events/2022/winter/Unix-101-1.md

@@ -0,0 +1,19 @@
+---
+name: "Unix 101: SSH, Bash & CLI Commands"
+short: "Join CSC's Systems Committee (syscom) for the first session of an introductory series on GNU/Linux!"
+date: "March 19 2022 14:00"
+online: true
+location: "Twitch"
+poster: 'images/events/2022/winter/Unix-101-1.png'
+---
+
+Want to learn about Bash, SSH and other terminal commands? 👨‍💻 Want to prepare for, or extend your skills from CS246? 📚 Join CSC’s Systems Committee (syscom) for our first introductory session on GNU/Linux 💻! 
+
+🙆‍♂️ Unix 101 will be a 4-part, beginner-friendly series on the Unix operating system. Attendance in previous sessions is not required to understand the proceeding ones, but is strongly encouraged to make sure you get the most out of our workshops! ✨
+
+👆 We additionally recommend joining CSC to access our machines for more hands-on activity. Learn more about how you can do so at https://csclub.uwaterloo.ca/get-involved/! 
+
+🧠 Head over to our Twitch on March 19th from 2-3PM EST for our first session of Unix 101!
+
+📅 Event Date: Saturday March 19th @ 2-3PM EST on Twitch
+🔗 Twitch: https://www.twitch.tv/uwcsclub 

content/events/2022/winter/Unix-101-2.md

@@ -0,0 +1,19 @@
+---
+name: "Unix 101: FS/Perms & vim"
+short: "Join CSC's Systems Committee (syscom) for the second session of an introductory series on GNU/Linux!"
+date: "March 26 2022 14:00"
+online: true
+location: "Twitch"
+poster: 'images/events/2022/winter/Unix-101-2.png'
+---
+
+Do you want to start editing with vim? Looking to learn about the Unix file system? You’ve come to the right place! ✍ CSC’s Systems Committee (syscom) is back with a workshop on File Systems, Permissions, and a tutorial on vim for our 2nd session of Unix 101! 💻
+
+🙆‍♂️ Unix 101 is a 4-part, beginner-friendly series on the Unix operating system. Attendance in previous sessions is not required to understand the proceeding ones, but is strongly encouraged to make sure you get the most out of our workshops! ✨
+
+👆 We additionally recommend joining CSC to access our machines for more hands-on activity. Learn more about how you can do so at https://csclub.uwaterloo.ca/get-involved/! 
+
+🧠 Head over to our Twitch on March 26th from 2-3PM ET for our second session of Unix 101!
+
+📅 Event Date: Saturday March 26th @ 2-3PM ET on Twitch
+🔗 Twitch: https://www.twitch.tv/uwcsclub

content/get-involved.mdx

@@ -8,12 +8,12 @@ a bunch of ways you can join and help out.
 
 ### General Membership
 
-<details>
-  <summary>In-person Term</summary>
+<details open>
+  <summary>In-person</summary>
 
 1. Drop by our office in **MC 3036/3037** with
-    - your WatCard, and
-    - $2 membership fee for the term that you would like to pay for
+   - your WatCard, and
+   - $2 membership fee for the term that you would like to pay for
 2. Sign our [Machine Usage Agreement](/resources/machine-usage-agreement)
 
 That's all! After your account has been created, you'll have access to all the
@@ -22,12 +22,13 @@ That's all! After your account has been created, you'll have access to all the
 #### Membership Renewal
 
 Just drop by the office with $2 for each term which you wish to renew.
-You do not need to bring your WatCard or sign the usage agreement again.
+You do not need to bring your WatCard or sign the machine usage agreement
+again.
 
 </details>
 
-<details open>
-  <summary>Online Term</summary>
+<details>
+  <summary>Online</summary>
 
 Email the CSC Systems Committee at
 [syscom@csclub.uwaterloo.ca](mailto:syscom@csclub.uwaterloo.ca) from your
@@ -36,28 +37,17 @@ University of Waterloo email address with the following:
 1. a scan or photograph copy of your **WatCard**,
 2. your **WatIAM userid**, and
 3. your acknowledgement of having read, understood, and agreeing with our
-[Machine Usage Agreement](/resources/machine-usage-agreement).
+   [Machine Usage Agreement](/resources/machine-usage-agreement).
 
-<!--~~You will need to pay the membership fee of $2 through WUSA store.~~-->
-
-MathSoc has waived membership fees for the Winter 2022 term, so just send syscom
-an email and we'll be happy to register your CSC account for free this term.
+**Note: we no longer use Paypal to process memberships.**
+We are currently working on an alternative solution for processing membership
+fees online. Please check back later!
 
 #### Membership Renewal
 
-**Membership renewals for the Winter 2022 term are free.**
-
 **Note: we no longer use Paypal to process memberships.**
-
-For all other terms...
-
-<!--<p>
-  <form action="https://www.paypal.com/cgi-bin/webscr" method="post">
-    <input type="hidden" name="cmd" value="_s-xclick"/>
-    <input type="hidden" name="hosted_button_id" value="9065852"/>
-    <button size="small" name="submit">Renew by PayPal</button>
-  </form>
-</p>-->
+We are currently working on an alternative solution for processing membership
+fees online. Please check back later!
 
 Contact syscom to renew your membership for as many terms
 as you wish. You do not need to send us your WatCard or sign the usage
@@ -65,11 +55,11 @@ agreement again.
 
 </details>
 
-### Executive Committees
+### Organizing Committees
 
-Are you interested in using your skills to get involved with CSC? We have
-committees covering everything from design to development, so no matter your
-interests, we’ve got a place for you.
+Are you interested in using your skills to get involved with CSC and help make
+an impact on our community? We have committees covering everything from design
+to development, so no matter your interests, we’ve got a place for you.
 
 **CSC hires at the end of every term\***, so make sure to stay connected through
 social media to keep up to date on when applications open!
@@ -89,13 +79,16 @@ social media to keep up to date on when applications open!
 #### Systems Committee
 
 - Maintaining all services that CSC provides which includes file share, DNS,
-mail, configuration for IRC, Mattermost, Git hosting.
+  mail, configuration for IRC, Mattermost, Git hosting.
 - Managing mirrors used by large public organizations and thousands of people
-internationally.
+  internationally.
 
-Syscom is always looking for new members! If you'd like to join, just send an email to syscom@csclub.uwaterloo.ca containing a brief introduction about yourself and any experience you have with GNU/Linux.
+Syscom is always looking for new members! If you'd like to join, just send an
+email to syscom@csclub.uwaterloo.ca containing a brief introduction about
+yourself and any experience you have with GNU/Linux.
 
 ### Elected Roles
+
 Each term, the CSC holds elections to determine the executive council:
 
 - President

content/news/2022/spring/2022-04-28-a258wang.md

@@ -0,0 +1,19 @@
+---
+author: 'a258wang'
+date: 'April 28 2022 00:00'
+---
+📣 The Spring 2022 Bootcamp Event is looking for mentors to take on resume critiques, host mock interviews, and help prepare students for their co-op search! This is an awesome opportunity for anyone to give back to the Waterloo community and make an impact on a student’s co-op search.
+
+📅 There is a resume review event happening on May 14th from 6:00pm-10:00 PM EST and a mock interview event on May 21st from 6:00pm-10:00 PM EST.
+
+ℹ️ You can choose to participate at either event for a select number of hours!
+
+❗️All sessions will take place virtually on our Bootcamp Discord Server! Students will have a chance to meet with you 1 on 1 to discuss their resumes/conduct their interviews.
+
+👉 Sign up at https://bit.ly/s22-bootcamp-mentor-signup
+
+Alternatively, you can email us at exec@csclub.uwaterloo.ca with the year and program you’re in, along with interested job paths.
+
+📅 Deadline to Apply for Resume Reviews: May 11th, 2022, 11:59PM EST
+
+📅 Deadline to Apply for Mock Interviews: May 18th, 2022, 11:59PM EST

content/news/2022/spring/2022-05-02-a258wang.md

@@ -0,0 +1,19 @@
+---
+author: 'a258wang'
+date: 'May 02 2022 00:00'
+---
+CSC Cloud has been released!
+
+Ever wanted a virtual private server (VPS) like GCP or AWS, but balked at the price?
+Now you can get FREE cloud computing, included with your CSC membership!
+
+Specs:
+- 8 CPU cores
+- 8 GB RAM
+- 40 GB disk space
+
+Split between up to 8 different VMs, all yours!
+
+Read the documentation at https://docs.cloud.csclub.uwaterloo.ca/ to get started today!
+
+Note: If you need additional resources, email syscom@csclub.uwaterloo.ca with your reasoning and we will do our best to accommodate you.

content/news/2022/spring/2022-05-05-a258wang.md

@@ -0,0 +1,26 @@
+---
+author: 'a258wang'
+date: 'May 5 2022 00:00'
+---
+
+Spring 2022 elections have concluded. Here are your executives for the term:
+
+- President: Eden Chan (e223chan)
+- Vice President: Bonnie Peng (b38peng)
+- Assistant Vice President: Haley Song (h79song)
+- Treasurer: Sat Arora (s97arora)
+- Sysadmin: Raymond Li (r389li)
+
+<!-- -->
+
+Additionally, the following postions were appointed:
+
+- Head Community Coordinator: Sat Arora (s97arora)
+- Heads of Discord: Mark Chen (m375chen) and Alex Zhang (xc22zhan)
+- Head of Design: Aaryan Shroff (a2shroff)
+- Heads of Events: Bonnie Peng (b39peng) and Catherine Wan (c29wan)
+- Head of External Affairs: Eric Liu (e59liu)
+- Head of Marketing: Haley Song (h79song)
+- Office Manager: Sat Arora (s97arora)
+
+<!-- -->

content/news/2022/winter/2022-03-27-b72zhou.md

@@ -0,0 +1,15 @@
+---
+author: 'b72zhou'
+date: 'March 27 2022 00:00'
+---
+📣 CS Club’s Internal Committee is hiring for Spring 2022! 📣
+
+Are you interested in organizing program-wide events, reaching out to industry professionals, or being a member of an impactful community? Are you passionate about making a difference in the UW CS and surrounding communities?
+
+Apply for a role on CS Club's Internal Committee for Spring 2022! We are looking for people like you to join our Programme Committee and/or Systems Committee! 🙌
+
+👀 Role descriptions can be found at https://bit.ly/uwcsclub-s22-roles.
+
+⏲️ The form will close on Monday April 11, at 11:59PM EST, so apply ASAP! We'll reach out through email after this date for interview slots/questions.
+
+👉  Apply at https://bit.ly/csc-s22-apply! Alternatively, you can email us at exec@csclub.uwaterloo.ca from your UW email with an introduction of yourself, which positions you're interested in and any questions you might have! 

content/news/2022/winter/2022-03-30-a258wang.md

@@ -0,0 +1,20 @@
+---
+author: 'a258wang'
+date: 'March 30 2022 00:00'
+---
+Are you graduating this year and looking back on your time at UW? 💭  Do you want to share your experiences, learn about others’ experiences and create something you’ll be able to look back on years from now? Well CSC is launching its first ever Class Profile for the CS Class of 2022! 🎉
+
+🤔 What is a Class Profile?
+👉 It’s a voluntary and confidential survey that asks questions about YOUR experience as a CS/CFM/CS-BBA student at the University of Waterloo. After the data collection, we will release a summary of the responses in the form of a website so you can learn more about your graduating class.
+
+📌 Why should I fill it out?
+👉 To share your experience as a CS Student at UW.
+👉 To create a web page that will not only be entertaining for you to view with your friends but also serve as a guide for current and future CS students to get a glimpse into being a CS student.
+👉 To be entered in a draw to win 1 of 3 gift cards valued at $25, $25, $50!
+
+👀 How do I fill it out?
+👉 Fill the form out at https://bit.ly/uw-cs22-class-profile!
+
+📅 The form must be submitted by April 29, 2022 at 11:59pm EST for your response to be recorded and to be eligible for the giveaway. Make sure to get your fellow CS ‘22 friends to fill it out as well!
+
+Please note that while this survey is confidential, in order to fulfill the giveaway we need to collect your email; however this will be stored separately from the form. If you have any questions or concerns, feel free to contact us through our Discord or email us at exec@csclub.uwaterloo.ca! 💙

content/resources/tech-talks/Unix-101-Winter-2022-Session-1.md

@@ -0,0 +1,11 @@
+---
+index: 63
+title: 'Unix 101 Winter 2022 Session 1'
+presentors:
+  - CSC Systems Committee 
+thumbnails:
+  small: 'https://mirror.csclub.uwaterloo.ca/csclub/Unix-101-Winter-2022-Session-1.jpg'
+links:
+  - file: 'https://mirror.csclub.uwaterloo.ca/csclub/Unix-101-Winter-2022-Session-1.mp4'
+    type: 'Talk (mp4)'
+---

content/team/design-team.json

@@ -0,0 +1,18 @@
+[
+  {
+    "name": "Jenny Zhang",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Vivian Guo",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Rachel Ma",
+    "role": "Design"
+  },
+  {
+    "name": "Aaryan Shroff",
+    "role": "Design"
+  }
+]

content/team/discord-team.json

@@ -0,0 +1,39 @@
+[
+  {
+    "name": "Andy Wang",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Alex Zhang",
+    "role": "Developer"
+  },
+  {
+    "name": "Allen Qin Lu",
+    "role": "Developer",
+    "image": "/images/team/AllenLu.png"
+  },
+  {
+    "name": "Chris Xie",
+    "role": "Developer"
+  },
+  {
+    "name": "Edwin Yang",
+    "role": "Developer"
+  },
+  {
+    "name": "Laura Nguyen",
+    "role": "Developer"
+  },
+  {
+    "name": "Marcus Chan",
+    "role": "Developer"
+  },
+  {
+    "name": "Mark Chen",
+    "role": "Developer"
+  },
+  {
+    "name": "Victor Zheng",
+    "role": "Developer"
+  }
+]

content/team/events-team.json

@@ -0,0 +1,75 @@
+[
+  {
+    "name": "Eden Chan",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Eric Huang",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Adele Chen",
+    "role": "Events"
+  },
+  {
+    "name": "Amya Singhal",
+    "role": "Events"
+  },
+  {
+    "name": "Anna Wang",
+    "role": "Events"
+  },
+  {
+    "name": "Catherine Wan",
+    "role": "Events"
+  },
+  {
+    "name": "Diana Brebeanu",
+    "role": "Events"
+  },
+  {
+    "name": "Elaine Han",
+    "role": "Events"
+  },
+  {
+    "name": "Jonathan Cui",
+    "role": "Events"
+  },
+  {
+    "name": "Kenson Hui",
+    "role": "Events"
+  },
+  {
+    "name": "Mabel Kwok",
+    "role": "Events"
+  },
+  {
+    "name": "Mashrur Chowdhury",
+    "role": "Events"
+  },
+  {
+    "name": "Matthew Wang",
+    "role": "Events"
+  },
+  {
+    "name": "Naman Chhawchharia",
+    "role": "Events"
+  },
+  {
+    "name": "Riddhi Bajaj",
+    "role": "Events"
+  },
+  {
+    "name": "Santiago Montemayor Gomez",
+    "role": "Events",
+    "image": "/images/team/SantiagoMontemayor.jpg"
+  },
+  {
+    "name": "Tommy Jiang",
+    "role": "Events"
+  },
+  {
+    "name": "William Tran",
+    "role": "Events"
+  }
+]

content/team/external-affairs-team.json

@@ -0,0 +1,22 @@
+[
+  {
+    "name": "David Chen",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Daniel Kim",
+    "role": "External Affairs"
+  },
+  {
+    "name": "Eric Liu",
+    "role": "External Affairs"
+  },
+  {
+    "name": "Victor Wu",
+    "role": "External Affairs"
+  },
+  {
+    "name": "Wanda Song",
+    "role": "External Affairs"
+  }
+]

content/team/marketing-team.json

@@ -0,0 +1,31 @@
+[
+  {
+    "name": "Dina Orucevic",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Arjun Amit Athalye",
+    "role": "Marketing",
+    "image": "/images/team/ArjunAthalye.jpeg"
+  },
+  {
+    "name": "Catherine Tao",
+    "role": "Marketing"
+  },
+  {
+    "name": "Ethan Hong",
+    "role": "Marketing"
+  },
+  {
+    "name": "Gurnika Kaur",
+    "role": "Marketing"
+  },
+  {
+    "name": "Haley Song",
+    "role": "Marketing"
+  },
+  {
+    "name": "Kshama Patel",
+    "role": "Marketing"
+  }
+]

content/team/photography-team.json

@@ -0,0 +1,18 @@
+[
+  {
+    "name": "Bonnie Peng",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Annie Zhang",
+    "role": "Photographer"
+  },
+  {
+    "name": "Calvin Zhong",
+    "role": "Photographer"
+  },
+  {
+    "name": "Jesse Liu",
+    "role": "Photographer"
+  }
+]

content/team/programme-committee.json

@@ -1,233 +0,0 @@
-[
-  {
-    "name": "Jenny Zhang",
-    "role": "Head of Design"
-  },
-  {
-    "name": "Vivian Guo",
-    "role": "Head of Design"
-  },
-  {
-    "name": "Rachel Ma",
-    "role": "Design"
-  },
-  {
-    "name": "Aaryan Shroff",
-    "role": "Design"
-  },
-  {
-    "name": "Andy Wang",
-    "role": "Head of Discord"
-  },
-  {
-    "name": "Alex Zhang",
-    "role": "Discord"
-  },
-  {
-    "name": "Allen Qin Lu",
-    "role": "Discord",
-    "image": "/images/team/AllenLu.png"
-  },
-  {
-    "name": "Chris Xie",
-    "role": "Discord"
-  },
-  {
-    "name": "Edwin Yang",
-    "role": "Discord"
-  },
-  {
-    "name": "Laura Nguyen",
-    "role": "Discord"
-  },
-  {
-    "name": "Marcus Chan",
-    "role": "Discord"
-  },
-  {
-    "name": "Mark Chen",
-    "role": "Discord"
-  },
-  {
-    "name": "Victor Zheng",
-    "role": "Discord"
-  },
-  {
-    "name": "Eden Chan",
-    "role": "Head of Events"
-  },
-  {
-    "name": "Eric Huang",
-    "role": "Head of Events"
-  },
-  {
-    "name": "Adele Chen",
-    "role": "Events"
-  },
-  {
-    "name": "Amya Singhal",
-    "role": "Events"
-  },
-  {
-    "name": "Anna Wang",
-    "role": "Events"
-  },
-  {
-    "name": "Catherine Wan",
-    "role": "Events"
-  },
-  {
-    "name": "Diana Brebeanu",
-    "role": "Events"
-  },
-  {
-    "name": "Elaine Han",
-    "role": "Events"
-  },
-  {
-    "name": "Jonathan Cui",
-    "role": "Events"
-  },
-  {
-    "name": "Kenson Hui",
-    "role": "Events"
-  },
-  {
-    "name": "Mabel Kwok",
-    "role": "Events"
-  },
-  {
-    "name": "Mashrur Chowdhury",
-    "role": "Events"
-  },
-  {
-    "name": "Matthew Wang",
-    "role": "Events"
-  },
-  {
-    "name": "Naman Chhawchharia",
-    "role": "Events"
-  },
-  {
-    "name": "Riddhi Bajaj",
-    "role": "Events"
-  },
-  {
-    "name": "Santiago Montemayor Gomez",
-    "role": "Events",
-    "image": "/images/team/SantiagoMontemayor.jpg"
-  },
-  {
-    "name": "Tommy Jiang",
-    "role": "Events"
-  },
-  {
-    "name": "William Tran",
-    "role": "Events"
-  },
-  {
-    "name": "David Chen",
-    "role": "Head of External Affairs"
-  },
-  {
-    "name": "Daniel Kim",
-    "role": "External Affairs"
-  },
-  {
-    "name": "Eric Liu",
-    "role": "External Affairs"
-  },
-  {
-    "name": "Victor Wu",
-    "role": "External Affairs"
-  },
-  {
-    "name": "Wanda Song",
-    "role": "External Affairs"
-  },
-  {
-    "name": "Dina Orucevic",
-    "role": "Head of Marketing"
-  },
-  {
-    "name": "Arjun Amit Athalye",
-    "role": "Marketing",
-    "image": "/images/team/ArjunAthalye.jpeg"
-  },
-  {
-    "name": "Catherine Tao",
-    "role": "Marketing"
-  },
-  {
-    "name": "Ethan Hong",
-    "role": "Marketing"
-  },
-  {
-    "name": "Gurnika Kaur",
-    "role": "Marketing"
-  },
-  {
-    "name": "Haley Song",
-    "role": "Marketing"
-  },
-  {
-    "name": "Kshama Patel",
-    "role": "Marketing"
-  },
-  {
-    "name": "Bonnie Peng",
-    "role": "Head of Photography"
-  },
-  {
-    "name": "Annie Zhang",
-    "role": "Photographer"
-  },
-  {
-    "name": "Calvin Zhong",
-    "role": "Photographer"
-  },
-  {
-    "name": "Jesse Liu",
-    "role": "Photographer"
-  },
-  {
-    "name": "Amy Luo",
-    "role": "Head of Reps"
-  },
-  {
-    "name": "Govind Varma",
-    "role": "Representative"
-  },
-  {
-    "name": "Guneet Bola",
-    "role": "Representative"
-  },
-  {
-    "name": "Ivy Lei",
-    "role": "Representative"
-  },
-  {
-    "name": "Jasmine Bal",
-    "role": "Representative"
-  },
-  {
-    "name": "Mayank Mehra",
-    "role": "Representative"
-  },
-  {
-    "name": "Olivia Liu",
-    "role": "Representative"
-  },
-  {
-    "name": "Sat Arora",
-    "role": "Representative"
-  },
-  {
-    "name": "Star Xie",
-    "role": "Representative"
-  },
-  {
-    "name": "Tracy Dong",
-    "role": "Representative"
-  }
-]

content/team/representative-team.json

@@ -0,0 +1,42 @@
+[
+  {
+    "name": "Amy Luo",
+    "role": "Team Lead"
+  },
+  {
+    "name": "Govind Varma",
+    "role": "Representative"
+  },
+  {
+    "name": "Guneet Bola",
+    "role": "Representative"
+  },
+  {
+    "name": "Ivy Lei",
+    "role": "Representative"
+  },
+  {
+    "name": "Jasmine Bal",
+    "role": "Representative"
+  },
+  {
+    "name": "Mayank Mehra",
+    "role": "Representative"
+  },
+  {
+    "name": "Olivia Liu",
+    "role": "Representative"
+  },
+  {
+    "name": "Sat Arora",
+    "role": "Representative"
+  },
+  {
+    "name": "Star Xie",
+    "role": "Representative"
+  },
+  {
+    "name": "Tracy Dong",
+    "role": "Representative"
+  }
+]

docs/pages.md

@@ -0,0 +1,160 @@
+# Pages
+
+All pages are a separate React component in our repository, under the [pages](../pages) folder. This is a [special directory](https://nextjs.org/docs/tag/v11.0.0/basic-features/pages) used by Next.js which maps a React component exported from this directory to a page on a url.
+
+The React components exported by these files are wrapped by the [`App` component](../pages/_app.tsx). This lets us reuse code in between pages which makes it a good place to render the [navbar](../components/Navbar.tsx), [footer](../components/Footer.tsx), [background shapes](../components/ShapesBackground.tsx), and the general CSS layout of a page.
+
+## Title
+
+We use a custom [`Title` component](../components/Title.tsx) to set the title on our pages. This is a very simple component and is just a wrapper around the Next.js [`Head` component](https://nextjs.org/docs/tag/v11.0.0/api-reference/next/head). It also automatically prefixes each title with "CSC - University of Waterloo". Look at the [code](../components/Title.tsx) for more details.
+
+### Example 1
+
+```tsx
+import { Title } from "@/components/Title"
+
+function FooPage() {
+  return (
+    <>
+      <Title>Title in the tab</Title>
+      <div>Content of the page</div>
+    </>
+  )
+}
+
+// The page's content will be "Content of the page"
+// The title of the page (as shown at the top of the browser in the tab) is "CSC - University of Waterloo - Title in the tab"
+```
+
+### Example 2
+
+You can also pass in an array of strings, and the [`Title` component](../components/Title.tsx) will automatically join them with " - ".
+
+```tsx
+import { Title } from "@/components/Title"
+
+function FooPage() {
+  return (
+    <>
+      <Title>{["Foo", "Bar", "Baz"]}</Title>
+      <div>Content of the page</div>
+    </>
+  )
+}
+
+// The page's content will be "Content of the page"
+// The title of the page (as shown at the top of the browser in the tab) is "CSC - University of Waterloo - Foo - Bar - Baz"
+```
+
+## Layout
+
+Most pages are wrapped with the [`DefaultLayout`](../components/DefaultLayout.tsx) component which limits the page width and adds the necessary margins and paddings. However, some pages need to override these default styles to accomodate for their specific design. For example:
+
+- The [home page](../pages/index.tsx) is wider than all the other pages.
+- The [about us](../pages/about/index.tsx) needs the entire screen width to properly render the [bubbles](../components/Bubble.tsx).
+
+<figure>
+  <img src="static/bubbles-example.png" alt="bubble on about page" />
+  <figcaption>
+    The bubble component on the About us page
+  </figcaption>
+</figure>
+
+We have an opt-in model for using a custom layout for pages. This is enabled by the static `Layout` function on a React component for a page.
+
+### Example
+
+```tsx
+function PageXYZ() {
+  return <p>I am a page</p>
+}
+
+// If we want this page to use a custom layout, we can add a static `Layout` function to it.
+PageXYZ.Layout = function PageXYZLayout(props: { children: React.ReactNode }) {
+  return <div className={styles.customLayoutStyles}>{props.children}</div>;
+}
+```
+
+It is extremely important to return `props.children` as part of the JSX because this contains the entire page. If you fail to return it, the page will **not** show up.
+
+Note that this functionality is **not** a part of Next.js. We take advantage of static properties in the [_app.tsx](../pages/_app.tsx#L30) file to implement this.
+
+## Shapes Background
+
+Just like the static `Layout` function, we use another static function on React pages called `getShapesConfig`. Most pages use the [default config](../components/ShapesBackground.tsx#L188) which positions shapes randomly on the page. Some pages require a little artistic nudge or even hardcoding the shapes to appear in certain locations.
+
+Pages like the [home page](../pages/index.tsx) can use the `getShapesConfig` function to customize what shapes they want the page to render. 
+
+### Example 1
+
+```tsx
+import { GetShapesConfig } from "@/components/ShapesBackground";
+
+PageXYZ.getShapesConfig = (() => {
+  // I ONLY LIKE DOTS AND WAVES!!!!
+  return {
+    dots: [
+      {
+        // These map to CSS properties. You don't have to use all of them. Use the ones that you want.
+        top: "calc(0.06 * (580rem / 0.65) / 16)",
+        right: "90vw",
+        width: "calc(168rem / 16)",
+        height: "calc(204rem / 16)",
+        filter: "var(--teal)",
+        opacity: "25%",
+      }
+    ],
+    waves: [
+      {
+        top: "calc(0.5 * (580rem / 0.65) / 16)",
+        left: "24vw",
+        width: "calc(116rem / 16)",
+        height: "calc(58rem / 16)",
+        filter: "var(--teal)",
+      },
+    ]
+  }
+}) as GetShapesConfig
+```
+
+Note that background shapes are not rendered into html files during build time because it is impossible to know the window dimensions. This means that you can safely use `window.innerWidth` and `window.innerHeight` as well use the width and height of the shapes container inside the `getShapesConfig` function to change the shapes based on size of the screen.
+
+### Example 2
+```tsx
+import { GetShapesConfig } from "@/components/ShapesBackground";
+
+PageXYZ.getShapesConfig = ((containerWidth, containerHeight) => {
+  // I like dots on desktops
+  if (window.innerWidth >= 768) {
+    return {
+      dots: [
+        {
+          // These map to CSS properties. You don't have to use all of them. Use the ones that you want.
+          top: "calc(0.06 * (580rem / 0.65) / 16)",
+          right: "90vw",
+          width: "calc(168rem / 16)",
+          height: "calc(204rem / 16)",
+          filter: "var(--teal)",
+          opacity: "25%",
+        }
+      ],
+    }
+  }
+  // but waves on phones and tables
+  else {
+    return {
+      waves: [
+        {
+          top: "calc(0.5 * (580rem / 0.65) / 16)",
+          left: "24vw",
+          width: "calc(116rem / 16)",
+          height: "calc(58rem / 16)",
+          filter: "var(--teal)",
+        },
+      ]
+    }
+  }
+}) as GetShapesConfig
+```
+
+As with the `Layout` function, this is **not** a part of Next.js. We take advantage of static properties in the [_app.tsx](../pages/_app.tsx#L51) file to implement this.

lib/events.ts

@@ -53,6 +53,9 @@ interface Metadata {
   location: string;
   permaLink: string;
   registerLink?: string;
+  year: string;
+  term: string;
+  slug: string;
 }
 
 export interface Event {
@@ -82,6 +85,9 @@ export async function getEventBySlug(
       ).toString(),
       // permaLink is based on the directory structure in /pages
       permaLink: `/events/${year}/${term}/${slug}`,
+      year: year,
+      term: term,
+      slug: slug,
     } as Metadata,
   };
 }

lib/team.ts

@@ -1,11 +1,32 @@
-import { readFile, readdir, access } from "fs/promises";
+import { readFile, access } from "fs/promises";
 import path from "path";
 
 import matter from "gray-matter";
+import { Client } from "ldapts";
 import { serialize } from "next-mdx-remote/serialize";
 
+import { getCurrentTerm } from "@/lib/events";
+import { capitalize } from "@/utils";
+
 const EXECS_PATH = path.join("content", "team", "execs");
-const fileType = ".md";
+const FILETYPE = ".md";
+const { year, term } = getCurrentTerm();
+
+const execPositions: { [position: string]: string } = {
+  president: "President",
+  "vice-president": "Vice President",
+  secretary: "Assistant Vice President",
+  treasurer: "Treasurer",
+  sysadmin: "System Administrator",
+};
+
+const orderedExecPositions: string[] = [
+  "president",
+  "vice-president",
+  "secretary",
+  "treasurer",
+  "sysadmin",
+];
 
 export interface Metadata {
   name: string;
@@ -13,23 +34,93 @@ export interface Metadata {
   image: string;
 }
 
-export async function getExecNames() {
-  return (await readdir(EXECS_PATH))
-    .filter((name) => name.endsWith(fileType))
-    .map((name) => name.slice(0, -1 * fileType.length));
+export async function getExecNamePosPairs() {
+  if (process.env.USE_LDAP?.toLowerCase() !== "true") {
+    return [["codey", "mascot"]];
+  }
+
+  const url = "ldap://ldap1.csclub.uwaterloo.ca";
+  const searchDN = "ou=People,dc=csclub,dc=uwaterloo,dc=ca";
+  const client = new Client({ url });
+
+  // position: name
+  const execMembers: { [position: string]: string } = {};
+  let formattedExec: [string, string][] = [];
+
+  try {
+    await client.bind("", "");
+    const { searchEntries } = await client.search(searchDN, {
+      scope: "sub",
+      filter: `(&(objectClass=member)(term=${(term as string).slice(
+        0,
+        1
+      )}${year}))`,
+    });
+
+    // item.position might be an array if the member has more than one position
+    searchEntries.forEach((item) => {
+      if (typeof item.position === "string" && item.position in execPositions) {
+        execMembers[item.position] = item.cn as string;
+      } else if (item.position instanceof Array) {
+        item.position.forEach((p) => {
+          if ((p as string) in execPositions) {
+            execMembers[p as string] = item.cn as string;
+          }
+        });
+      }
+    });
+
+    formattedExec = orderedExecPositions.map((position) => {
+      return [
+        `${execMembers[position].split(" ")[0].toLowerCase()}-${execMembers[
+          position
+        ]
+          .split(" ")[1]
+          .toLowerCase()}`,
+        position,
+      ];
+    });
+
+    formattedExec = [...formattedExec, ["codey", "mascot"]];
+  } finally {
+    await client.unbind();
+  }
+
+  return formattedExec;
 }
 
-export async function getExec(fileName: string, convert = true) {
-  const raw = await readFile(path.join(EXECS_PATH, `${fileName}${fileType}`));
-  const { content, data: metadata } = matter(raw);
-  const image =
-    (metadata.image as string | undefined) ??
-    (await getMemberImagePath(metadata.name));
+export async function getExec(name: string, pos: string, convert = true) {
+  let content, metadata;
 
-  return {
-    content: convert ? await serialize(content) : content,
-    metadata: { ...metadata, image } as Metadata,
-  };
+  try {
+    const raw = await readFile(path.join(EXECS_PATH, `${name}${FILETYPE}`));
+    ({ content, data: metadata } = matter(raw));
+
+    const image = await getMemberImagePath(metadata.name);
+
+    return {
+      content: convert ? await serialize(content) : content,
+      metadata: { ...metadata, image } as Metadata,
+    };
+  } catch (err) {
+    // Capitalize the first letter of the first name and last name
+    const firstName = capitalize(name.split("-")[0]);
+    const lastName = capitalize(name.split("-")[1]);
+
+    const posName = execPositions[pos];
+    content = "Coming Soon!";
+    metadata = {
+      name: `${firstName} ${lastName}`,
+      role: `${posName}`,
+    };
+
+    const image = await getMemberImagePath(metadata.name);
+
+    return {
+      content: convert ? await serialize(content) : content,
+      metadata: { ...metadata, image } as Metadata,
+    };
+  }
 }
 
 async function getImage(imgPath: string) {
@@ -53,6 +144,10 @@ export async function getMemberImagePath(name: string) {
     (await getImage(imgPath + ".png")) ??
     (await getImage(imgPath + ".gif")) ??
     (await getImage(imgPath + ".jpeg")) ??
+    (await getImage(imgPath + ".JPG")) ??
+    (await getImage(imgPath + ".PNG")) ??
+    (await getImage(imgPath + ".GIF")) ??
+    (await getImage(imgPath + ".JPEG")) ??
     placeholder;
   return img;
 }

pages/404.module.css

@@ -0,0 +1,27 @@
+.container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-bottom: calc(60rem / 16);
+}
+
+.codey {
+  width: calc(380rem / 16);
+  padding: calc(20rem / 16);
+  padding-right: 0;
+}
+
+.heading {
+  margin-top: 0;
+}
+
+@media only screen and (max-width: calc(768rem / 16)) {
+  .container {
+    flex-direction: column;
+    padding-bottom: calc(30rem / 16);
+  }
+
+  .codey {
+    padding: calc(20rem / 16) 0;
+  }
+}

pages/404.tsx

@@ -0,0 +1,26 @@
+import React from "react";
+
+import { Image } from "@/components/Image";
+import { Link } from "@/components/Link";
+import { Title } from "@/components/Title";
+
+import styles from "./404.module.css";
+
+export default function Custom404() {
+  return (
+    <div className={styles.container}>
+      <div className={styles.text}>
+        <Title>404: Page Not Found</Title>
+        <h2>Error 404</h2>
+        <h1 className={styles.heading}>
+          We couldn’t find the page you’re looking for!
+        </h1>
+        <p>
+          <Link href="/">Click here to go back to the main page.</Link>
+        </p>
+      </div>
+
+      <Image src="images/codey-404.svg" className={styles.codey} />
+    </div>
+  );
+}

pages/about/team.tsx

@@ -11,12 +11,18 @@ import { TeamMemberCard } from "@/components/TeamMemberCard";
 import { Title } from "@/components/Title";
 import {
   getExec,
-  getExecNames,
+  getExecNamePosPairs,
   Metadata,
   getMemberImagePath,
 } from "@/lib/team";
 
-import programmeData from "../../content/team/programme-committee.json";
+import designData from "../../content/team/design-team.json";
+import discordData from "../../content/team/discord-team.json";
+import eventsData from "../../content/team/events-team.json";
+import externalData from "../../content/team/external-affairs-team.json";
+import marketingData from "../../content/team/marketing-team.json";
+import photographyData from "../../content/team/photography-team.json";
+import repsData from "../../content/team/representative-team.json";
 import systemsData from "../../content/team/systems-committee.json";
 import terminalData from "../../content/team/terminal-committee.json";
 import webData from "../../content/team/web-committee.json";
@@ -30,7 +36,13 @@ interface SerializedExec {
 
 interface Props {
   execs: SerializedExec[];
-  programme: Metadata[];
+  design: Metadata[];
+  discord: Metadata[];
+  events: Metadata[];
+  external: Metadata[];
+  marketing: Metadata[];
+  photography: Metadata[];
+  reps: Metadata[];
   website: Metadata[];
   systems: Metadata[];
   terminal: Metadata[];
@@ -38,11 +50,69 @@ interface Props {
 
 export default function Team({
   execs,
-  programme,
+  design,
+  discord,
+  events,
+  external,
+  marketing,
+  photography,
+  reps,
   website,
   systems,
   terminal,
 }: Props) {
+  const teams = [
+    {
+      id: "design",
+      name: "Design Team",
+      members: design,
+    },
+    {
+      id: "discord",
+      name: "Discord Team",
+      members: discord,
+    },
+    {
+      id: "events",
+      name: "Events Team",
+      members: events,
+    },
+    {
+      id: "external",
+      name: "External Affairs Team",
+      members: external,
+    },
+    {
+      id: "marketing",
+      name: "Marketing Team",
+      members: marketing,
+    },
+    {
+      id: "photography",
+      name: "Photography Team",
+      members: photography,
+    },
+    {
+      id: "reps",
+      name: "Class Representatives",
+      members: reps,
+    },
+    {
+      id: "website",
+      name: "Website Committee",
+      members: website,
+    },
+    {
+      id: "system",
+      name: "Systems Committee",
+      members: systems,
+    },
+    {
+      id: "terminal",
+      name: "Terminal Committee",
+      members: terminal,
+    },
+  ];
   return (
     <>
       <Title>Team</Title>
@@ -52,7 +122,13 @@ export default function Team({
             <h1 className={styles.header}>Meet the Team!</h1>
             <div className={styles.nav}>
               <Link href="#execs">The Executives</Link>
-              <Link href="#programme">Programme Committee</Link>
+              <Link href="#design">Design</Link>
+              <Link href="#discord">Discord</Link>
+              <Link href="#events">Events</Link>
+              <Link href="#external">External Affairs</Link>
+              <Link href="#marketing">Marketing</Link>
+              <Link href="#photography">Photography</Link>
+              <Link href="#reps">Class Representatives</Link>
               <Link href="#website">Website Committee</Link>
               <Link href="#system">Systems Committee</Link>
               <Link href="#terminal">Terminal Committee</Link>
@@ -77,22 +153,14 @@ export default function Team({
             );
           })}
         </div>
-        <div id="programme">
-          <h2 className={styles.subheading}>Programme Committee</h2>
-          <MembersList team={programme} />
-        </div>
-        <div id="website">
-          <h2 className={styles.subheading}>Website Committee</h2>
-          <MembersList team={website} />
-        </div>
-        <div id="system">
-          <h2 className={styles.subheading}>Systems Committee</h2>
-          <MembersList team={systems} />
-        </div>
-        <div id="terminal">
-          <h2 className={styles.subheading}>Terminal Committee</h2>
-          <MembersList team={terminal} />
-        </div>
+        {teams.map((team) => {
+          return (
+            <div id={team.id} key={team.id}>
+              <h2 className={styles.subheading}>{team.name}</h2>
+              <MembersList team={team.members} />
+            </div>
+          );
+        })}
       </DefaultLayout>
       <div className={styles.elections}>
         <Bubble>
@@ -140,18 +208,51 @@ async function getTeamWithImages(team: TeamMember[]) {
 }
 
 export const getStaticProps: GetStaticProps<Props> = async () => {
-  const execNames = await getExecNames();
+  const execNamePosPairs = await getExecNamePosPairs();
+
   const execs = (await Promise.all(
-    execNames.map((name) => getExec(name))
+    execNamePosPairs.map((namePosPair) =>
+      getExec(namePosPair[0], namePosPair[1])
+    )
   )) as SerializedExec[];
-  const [programme, website, systems, terminal] = await Promise.all([
-    getTeamWithImages(programmeData),
+
+  const [
+    design,
+    discord,
+    events,
+    external,
+    marketing,
+    photography,
+    reps,
+    website,
+    systems,
+    terminal,
+  ] = await Promise.all([
+    getTeamWithImages(designData),
+    getTeamWithImages(discordData),
+    getTeamWithImages(eventsData),
+    getTeamWithImages(externalData),
+    getTeamWithImages(marketingData),
+    getTeamWithImages(photographyData),
+    getTeamWithImages(repsData),
     getTeamWithImages(webData),
     getTeamWithImages(systemsData),
     getTeamWithImages(terminalData),
   ]);
 
   return {
-    props: { execs, programme, website, systems, terminal },
+    props: {
+      execs,
+      design,
+      discord,
+      events,
+      external,
+      marketing,
+      photography,
+      reps,
+      website,
+      systems,
+      terminal,
+    },
   };
 };

pages/events/[year]/[term]/[event].tsx

@@ -28,6 +28,7 @@ export default function EventInfoPage({ year, term, event }: Props) {
         {...event.metadata}
         date={new Date(event.metadata.date)}
         showDescription
+        titleLinked={false}
       >
         <MDXRemote {...event.content} />
       </EventCard>

pages/events/[year]/[term]/index.tsx

@@ -75,6 +75,7 @@ export default function TermPage(props: Props) {
                 {...metadata}
                 date={new Date(metadata.date)}
                 key={metadata.name + metadata.date.toString()}
+                titleLinked={true}
               >
                 <MDXRemote {...content} />
               </EventCard>

pages/get-involved.tsx

@@ -17,8 +17,8 @@ export default function GetInvolved() {
         <div className={styles.headerText}>
           <h1>Get Involved!</h1>
           <p>
-            If you’re interested in helping out with CS Club, don’t hesitate to
-            get in touch with us!
+            If you’re interested in getting involved with CS Club, don’t
+            hesitate to get in touch with us!
           </p>
         </div>
         <Image src="images/get-involved/codey.svg" className={styles.codey} />