From b691bf3231d5002a631687f26c7409e311237662 Mon Sep 17 00:00:00 2001
From: Derek Chen <derex1987@gmail.com>
Date: Fri, 9 Feb 2024 17:12:39 -0600
Subject: [PATCH] fix: grid JSX.Element generation

---
 .../CalendarGrid/CalendarGrid.module.scss     |  2 +-
 .../common/CalendarGrid/CalendarGrid.tsx      | 24 ++++++-------------
 2 files changed, 8 insertions(+), 18 deletions(-)

diff --git a/src/views/components/common/CalendarGrid/CalendarGrid.module.scss b/src/views/components/common/CalendarGrid/CalendarGrid.module.scss
index bea6c952..33bccbe4 100644
--- a/src/views/components/common/CalendarGrid/CalendarGrid.module.scss
+++ b/src/views/components/common/CalendarGrid/CalendarGrid.module.scss
@@ -16,7 +16,7 @@
 
 .calendarGrid {
     display: grid;
-    grid-template-columns: repeat(5, 1fr);
+    grid-template-columns: repeat(6, 1fr);
     grid-template-rows: repeat(13, 1fr);
 }
 
diff --git a/src/views/components/common/CalendarGrid/CalendarGrid.tsx b/src/views/components/common/CalendarGrid/CalendarGrid.tsx
index 7d90d371..03a69aee 100644
--- a/src/views/components/common/CalendarGrid/CalendarGrid.tsx
+++ b/src/views/components/common/CalendarGrid/CalendarGrid.tsx
@@ -5,23 +5,13 @@ import { DAY_MAP } from 'src/shared/types/CourseMeeting';
 
 const daysOfWeek = Object.keys(DAY_MAP).filter(key => !['SAT', 'SUN'].includes(key));
 const hoursOfDay = Array.from({ length: 14 }, (_, index) => index + 8);
-const grid = Array.from({ length: 6 }, (_, rowIndex) => {
-  let index = 0;
-  return Array.from({ length: 13 }, (_, columnIndex) => {
-    if (columnIndex == 0) {
-      index += 1;
-      return (
-        <div key={columnIndex} className={styles.timeBlock}>
-          <div className={styles.timeLabelContainer}>
-            <p>{hoursOfDay[index - 1]}</p>
-          </div>
-        </div>
-      );
-    } else {
-      return <CalendarCell key={columnIndex} />;
-    }
-  })
-});
+const grid = [];
+for (let i = 0; i < 13; i++) {
+  const row = [];
+  row.push(hoursOfDay[i]);
+  const row = Array.from({ length: 5 }, (_, j) => <CalendarCell key={j} />);
+  grid.push(row);
+}
 
 /**
  * Grid of CalendarGridCell components forming the user's course schedule calendar view