components/EventCard.tsx

@@ -10,7 +10,7 @@ import styles from "./EventCard.module.css";
 interface EventCardProps {
   name: string;
   short: string;
-  startDate: Date;
+  date: Date;
   endDate?: Date;
   online: boolean;
   location: string;
@@ -28,7 +28,7 @@ interface EventCardProps {
 export function EventCard({
   permaLink,
   name,
-  startDate,
+  date,
   endDate,
   online,
   location,
@@ -73,7 +73,7 @@ export function EventCard({
         </h1>
         <h2>
           <EventSetting
-            startDate={startDate}
+            date={date}
             endDate={endDate}
             online={online}
             location={location}

components/EventDescriptionCard.tsx

@@ -13,7 +13,7 @@ interface Props {
   short: string;
   online: boolean;
   location: string;
-  startDate: Date;
+  date: Date;
   endDate?: Date;
   poster?: string;
   registerLink?: string;
@@ -23,7 +23,7 @@ interface Props {
 /**
  * @remarks
  * - Child elements will display as the event's description
- * - Assuming startDate prop is in EST
+ * - Assuming date prop is in EST
  * - poster is the event's image name, including file ending (.jpg/.png/etc)
  * - If event is online, location will be the platform, with capital first letter and no trailing spaces
  *    - ie. location="Discord"
@@ -35,7 +35,7 @@ export function EventDescriptionCard({
   poster,
   name,
   short,
-  startDate,
+  date,
   online,
   registerLink,
   permaLink,
@@ -51,7 +51,7 @@ export function EventDescriptionCard({
         <h1 className={styles.name}>{name}</h1>
         <h2 className={styles.setting}>
           <EventSetting
-            startDate={startDate}
+            date={date}
             endDate={endDate}
             online={online}
             location={location}

components/EventSetting.tsx

@@ -3,19 +3,19 @@ import React from "react";
 import styles from "./EventSetting.module.css";
 
 interface Props {
-  startDate: Date;
+  date: Date;
   endDate?: Date;
   online: boolean;
   location: string;
 }
 
 export function EventSetting(props: Props) {
-  const startDate = props.startDate.toLocaleDateString("en-US", {
+  const date = props.date.toLocaleDateString("en-US", {
     day: "numeric",
     month: "long",
     year: "numeric",
   });
-  const time = props.startDate.toLocaleTimeString("en-US", {
+  const time = props.date.toLocaleTimeString("en-US", {
     hour: "numeric",
     minute: "numeric",
     timeZoneName: "short",
@@ -33,19 +33,19 @@ export function EventSetting(props: Props) {
 
   return (
     <div className={styles.container}>
-      {!props.endDate || startDate == endDate ? (
+      {!props.endDate || date == endDate ? (
         // Single day event
         <>
-          <time dateTime={props.startDate.toISOString()}>{startDate}</time>
+          <time dateTime={props.date.toISOString()}>{date}</time>
           {separator}
           <span>{time}</span>
         </>
       ) : (
         // Multi day event
         <span>
-          <time dateTime={props.startDate.toISOString()}>{startDate}</time>
+          <time dateTime={props.date.toISOString()}>{date}</time>
           <span> - </span>
-          <time dateTime={props.startDate.toISOString()}>{endDate}</time>
+          <time dateTime={props.date.toISOString()}>{endDate}</time>
         </span>
       )}
       {separator}

components/MiniEventCard.tsx

@@ -40,7 +40,7 @@ export const MiniEventCard: React.FC<MiniEventCardProps> = ({
           </h2>
           <div className={styles.info}>
             <EventSetting
-              startDate={startDate}
+              date={startDate}
               endDate={endDate}
               location={location}
               online={online}