feat: fetch event dates from schedule data (#594)

components/Schedule/index.jsx

@@ -4,6 +4,8 @@ import Day from "./Day";
 import { useState, useEffect } from "react";
 import { useRouter } from "next/router";
 
+import scheduleData from "/data/schedule.json";
+
 function leapYear(year) {
   return (year % 4 == 0 && year % 100 != 0) || year % 400 == 0;
 }
@@ -87,8 +89,11 @@ function addDate(date, days) {
 }
 
 export default function Schedule(props) {
-  const min_date = "2023/2/14";
-  const max_date = "2023/2/17";
+  /* Fetch first and last day of the event from schedule data */
+  const eventDates = scheduleData.map((day) => day.date).sort();
+  const min_date = eventDates[0];
+  const max_date = eventDates[eventDates.length - 1];
+
   const defaultFilter = props.filters === undefined ? "" : props.filters;
 
   //calculate default date

layout/Home/components/Hero/Title/index.tsx

@@ -1,10 +1,21 @@
 import TypeWriter from "typewriter-effect";
+import schedule from "@data/schedule.json";
+import dayjs from "dayjs";
 
 export default function Title() {
+  /* Parse event dates info from schedule data */
+  const dates = schedule.map((day) => day.date).sort();
+
+  const firstDayDate = dayjs(dates[0], "YYYY/M/D");
+  const lastDayDate = dayjs(dates[dates.length - 1], "YYYY/M/D");
+
+  const month = firstDayDate.format("MMMM");
+  const year = firstDayDate.format("YYYY");
+
   return (
     <div className="relative z-20 font-bold">
       <h5 className="font-terminal-uppercase m-1 text-2xl text-quinary">
-        14-17 February 2023
+        {firstDayDate.format("D")}-{lastDayDate.format("D")} {month} {year}
       </h5>
       {/* 2xl:leading-[6.5rem] is intended to only work with the following font - Terminal */}
       <h1

package.json

@@ -33,6 +33,7 @@
     "@heroicons/react": "^1.0.5",
     "@netlify/plugin-nextjs": "^4.40.1",
     "axios": "^1.6.2",
+    "dayjs": "^1.11.10",
     "framer-motion": "^7.5.3",
     "jsqr": "^1.4.0",
     "lottie-web": "^5.8.1",