feat: update event card to handle multi date event

Author: seangaaab

app/(home)/components/EventCard.tsx

@@ -3,15 +3,28 @@ import { cn } from '@/lib/utils';
 import CountdownTimer from './CountdownTimer';
 import Link from 'next/link';
 
-interface Event {
+export interface Event {
   title: string;
-  date: string;
+  date: string | string[];
   location: string;
   variant: 'main' | 'regular'; // "main" for the featured event, "regular" for other events
   link: string;
 }
 
 export default function EventCard({ event }: { event: Event }) {
+  const getDisplayDate = (date: string | string[]) => {
+    if (Array.isArray(date)) {
+      if (date.length === 0) return '';
+      if (date.length === 1) return date[0];
+      return `${date[0]} - ${date[date.length - 1]}`;
+    }
+    return date;
+  };
+
+  const getFirstDateString = (date: string | string[]) => {
+    return Array.isArray(date) ? (date[0] ?? '') : date;
+  };
+
   return (
     <div
       className={cn(
@@ -39,7 +52,7 @@ export default function EventCard({ event }: { event: Event }) {
               'text-xs lg:text-xl md:text-[17px] md:leading-tight'
           )}
         >
-          {event.date} <br /> {event.location}
+          {getDisplayDate(event.date)} <br /> {event.location}
         </p>
         {event.variant === 'main' && (
           <Button
@@ -61,7 +74,7 @@ export default function EventCard({ event }: { event: Event }) {
 
       {event.variant === 'main' && (
         <div className="hidden xl:block mr-8">
-          <CountdownTimer eventDate={new Date(event.date).toISOString()} />
+          <CountdownTimer eventDate={getFirstDateString(event.date)} />
         </div>
       )}
     </div>

app/(home)/components/UpcomingEvents.tsx

@@ -2,31 +2,17 @@ import { Container } from '@/components/ui/container';
 import React from 'react';
 import EventCard from './EventCard';
 import CountdownTimer from './CountdownTimer';
+import { type Event } from './EventCard';
 // import { Button } from '@/components/ui/button';
 // import Link from 'next/link';
 
-interface Event {
-  title: string;
-  date: string;
-  location: string;
-  variant: 'main' | 'regular';
-  link: string;
-}
-
 const EVENTS: Event[] = [
   {
     title: 'PyCon Davao 2025',
-    date: 'October 25, 2025',
+    date: ['October 25, 2025', 'October 26, 2025'],
     location: 'Ateneo de Davao University',
     variant: 'main',
-    link: 'https://techtix.durianpy.org/pycon-davao-2025', // TODO: Update Link
-  },
-  {
-    title: 'PyCon Davao Sprint Day',
-    date: 'October 26, 2025',
-    location: 'TBA',
-    variant: 'regular',
-    link: '', // TODO: Update Link
+    link: 'https://techtix.durianpy.org/pycon-davao-2025',
   },
 ];
 
@@ -43,7 +29,13 @@ const UpcomingEvents = () => {
 
       {/* Countdown Timer */}
       <div className="block lg:block xl:hidden">
-        <CountdownTimer eventDate={new Date(EVENTS[0].date).toISOString()} />
+        <CountdownTimer
+          eventDate={
+            Array.isArray(EVENTS[0].date)
+              ? (EVENTS[0].date[0] ?? '')
+              : EVENTS[0].date
+          }
+        />
       </div>
 
       {/* Other events */}