From 7f88950f78841be31dd56f7e3923c3924b2ba11f Mon Sep 17 00:00:00 2001
From: Aditya Thakral <aditya.thakral@uwaterloo.ca>
Date: Mon, 24 May 2021 04:04:02 -0400
Subject: [PATCH] Make registerLink and poster optional for events

---
 components/EventCard.module.css          |  4 ++++
 components/EventCard.tsx                 | 15 +++++++++------
 components/EventDescriptionCard.tsx      |  4 ++--
 components/playground.tsx                |  2 +-
 content/playground/after-hours.event.mdx |  1 -
 content/playground/alt-tab.event.mdx     |  1 -
 next-env.d.ts                            |  4 ++--
 7 files changed, 18 insertions(+), 13 deletions(-)

diff --git a/components/EventCard.module.css b/components/EventCard.module.css
index 4f4a96f9..8c538d37 100644
--- a/components/EventCard.module.css
+++ b/components/EventCard.module.css
@@ -16,6 +16,10 @@
   margin-bottom: 16px;
 }
 
+.spacer {
+  margin-top: 76px;
+}
+
 .registerButton {
   width: 100%;
 }
diff --git a/components/EventCard.tsx b/components/EventCard.tsx
index 80d7147e..52118a20 100644
--- a/components/EventCard.tsx
+++ b/components/EventCard.tsx
@@ -10,8 +10,8 @@ interface EventCardProps {
   date: Date;
   online: boolean;
   location: string;
-  poster: string;
-  registerLink: string;
+  poster?: string;
+  registerLink?: string;
   children: ReactNode;
 }
 
@@ -27,11 +27,14 @@ export function EventCard({
   return (
     <article className={styles.card}>
       <aside>
-        <Image alt={name} src={poster} />
+        {poster && <Image alt={name} src={poster} />}
+        {!poster && <div className={styles.spacer}></div>}
         {/* TODO: use the <Button /> component */}
-        <button className={styles.registerButton}>
-          <a href={registerLink}>Register</a>
-        </button>
+        {registerLink && (
+          <button className={styles.registerButton}>
+            <a href={registerLink}>Register</a>
+          </button>
+        )}
       </aside>
       <section className={styles.content}>
         <h2>{name}</h2>
diff --git a/components/EventDescriptionCard.tsx b/components/EventDescriptionCard.tsx
index 5a69a2ca..e502054a 100644
--- a/components/EventDescriptionCard.tsx
+++ b/components/EventDescriptionCard.tsx
@@ -9,7 +9,7 @@ interface Props {
   online: boolean;
   location: string;
   date: Date;
-  poster: string;
+  poster?: string;
   registerLink?: string;
   children: ReactNode;
 }
@@ -52,7 +52,7 @@ export function EventDescriptionCard({
 
   return (
     <article className={styles.card}>
-      <Image className={styles.poster} src={poster} alt={name} />
+      {poster && <Image className={styles.poster} src={poster} alt={name} />}
 
       <div className={styles.details}>
         <h3 className={styles.name}>{name}</h3>
diff --git a/components/playground.tsx b/components/playground.tsx
index 75cdc3f6..9f86fc0e 100644
--- a/components/playground.tsx
+++ b/components/playground.tsx
@@ -24,8 +24,8 @@ import { EventDescriptionCard } from "./EventDescriptionCard";
 import { TeamMember } from "./TeamMember";
 
 const events = [
-  { Content: AfterHoursContent, metadata: afterHoursMetadata },
   { Content: OOTBReact, metadata: OOTBReactEventMetadata },
+  { Content: AfterHoursContent, metadata: afterHoursMetadata },
   { Content: AltTab, metadata: altTabEventMetadata },
 ];
 
diff --git a/content/playground/after-hours.event.mdx b/content/playground/after-hours.event.mdx
index a9fbb372..7d227d63 100644
--- a/content/playground/after-hours.event.mdx
+++ b/content/playground/after-hours.event.mdx
@@ -4,7 +4,6 @@ export const metadata = {
   date: new Date("2021-03-02 2:00 PM"),
   online: false,
   location: "MC",
-  poster: "/images/playground/intro-ootb.jpg",
   registerLink: "http://csclub.uwaterloo.ca/",
 };
 
diff --git a/content/playground/alt-tab.event.mdx b/content/playground/alt-tab.event.mdx
index c64e4884..fc3567d6 100644
--- a/content/playground/alt-tab.event.mdx
+++ b/content/playground/alt-tab.event.mdx
@@ -5,7 +5,6 @@ export const metadata = {
   online: true,
   location: "Twitch",
   poster: "/images/playground/alt-tab.jpg",
-  registerLink: "http://google.com/",
 };
 
 CSC is proud to present to you Alt-Tab! Join us in a lightning tech talk series presented to you by our very own students. Alt-Tab consists of 10 to 15-minute talks about anything related to tech. Learn more about exciting topics that range from competitive programming to cryptography!
diff --git a/next-env.d.ts b/next-env.d.ts
index 18bf6b5f..bcee8690 100644
--- a/next-env.d.ts
+++ b/next-env.d.ts
@@ -10,8 +10,8 @@ declare module "*.event.mdx" {
     date: Date;
     online: boolean;
     location: string;
-    poster: string;
-    registerLink: string;
+    poster?: string;
+    registerLink?: string;
   }
 
   const ReactComponent: ComponentType;