fix: Calendar View/Scaling Issues (#144)

* fix: calendar looks normal now; scaling

* fix: array indexing

* chore: eslint

* chore: lint

* feat: team Links and scrolling

src/views/components/calendar/CalendarGrid/CalendarGrid.tsx

@@ -4,7 +4,7 @@ import { getCourseColors } from '@shared/util/colors';
 import CalendarCourseCell from '@views/components/calendar/CalendarCourseCell/CalendarCourseCell';
 import CalendarCell from '@views/components/calendar/CalendarGridCell/CalendarGridCell';
 import type { CalendarGridCourse } from '@views/hooks/useFlattenedCourseSchedule';
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 
 import styles from './CalendarGrid.module.scss';
 
@@ -26,12 +26,10 @@ export default function CalendarGrid({
     saturdayClass,
     setCourse,
 }: React.PropsWithChildren<Props>): JSX.Element {
-    //  const [grid, setGrid] = useState([]);
-    // const calendarRef = useRef(null); // Create a ref for the calendar grid
-    const grid = [];
+    const [grid, setGrid] = useState([]);
 
-    // Run once to create the grid on initial render
     useEffect(() => {
+        const newGrid = [];
         for (let i = 0; i < 13; i++) {
             const row = [];
             let hour = hoursOfDay[i];
@@ -53,9 +51,10 @@ export default function CalendarGrid({
                 };
                 row.push(<CalendarCell key={k} styleProp={styleProp} />);
             }
-            grid.push(row);
+            newGrid.push(row);
         }
-    });
+        setGrid(newGrid);
+    }, []);
 
     return (
         <div className={styles.calendarGrid}>