From 1efdadf7cfd01cb66d543a8b20cf6dcd49a73d60 Mon Sep 17 00:00:00 2001
From: lucia <51058748+lucia-gomez@users.noreply.github.com>
Date: Wed, 31 Jul 2024 19:48:25 -0400
Subject: [PATCH] fix compile error + TODO fix mes

---
 .../routes/booking/components/BookingSelection.tsx     | 10 ++++------
 .../booking/components/CalendarVerticalResource.tsx    |  3 +--
 .../src/client/routes/booking/components/FormInput.tsx |  3 +--
 .../client/routes/booking/formPages/UserRolePage.tsx   |  4 ++--
 .../components/src/client/routes/components/Table.tsx  |  6 ++----
 5 files changed, 10 insertions(+), 16 deletions(-)

diff --git a/booking-app/components/src/client/routes/booking/components/BookingSelection.tsx b/booking-app/components/src/client/routes/booking/components/BookingSelection.tsx
index 38564d6a..222ccbe4 100644
--- a/booking-app/components/src/client/routes/booking/components/BookingSelection.tsx
+++ b/booking-app/components/src/client/routes/booking/components/BookingSelection.tsx
@@ -17,13 +17,11 @@ export const RoomDetails = styled(Grid)`
 `;
 
 const AlertHeader = styled(Alert)(({ theme }) => ({
-  //TODO: Fix later
-  //background: theme.palette.secondary.light,
+  background: theme.palette.secondary.light,
   marginBottom: 0,
 
   ".MuiAlert-icon": {
-    //TODO: Fix later
-    //color: theme.palette.primary.main,
+    color: theme.palette.primary.main,
   },
 }));
 
@@ -55,8 +53,8 @@ export default function BookingSelection() {
         <RoomDetails container>
           <label>Time:</label>
           <p>{`${formatTimeAmPm(
-            bookingCalendarInfo.startStr
-          )} - ${formatTimeAmPm(bookingCalendarInfo.endStr)}`}</p>
+            new Date(bookingCalendarInfo.startStr)
+          )} - ${formatTimeAmPm(new Date(bookingCalendarInfo.endStr))}`}</p>
         </RoomDetails>
       </AlertHeader>
       {/* <Typography variant={'h5'}>Your Request</Typography>
diff --git a/booking-app/components/src/client/routes/booking/components/CalendarVerticalResource.tsx b/booking-app/components/src/client/routes/booking/components/CalendarVerticalResource.tsx
index 5f15230b..521b3d9d 100644
--- a/booking-app/components/src/client/routes/booking/components/CalendarVerticalResource.tsx
+++ b/booking-app/components/src/client/routes/booking/components/CalendarVerticalResource.tsx
@@ -65,8 +65,7 @@ const Empty = styled(Box)(({ theme }) => ({
   justifyContent: "center",
   alignItems: "center",
   height: 500,
-  //TODO: Fix later
-  //color: theme.palette.custom.gray3",
+  color: theme.palette.custom.gray3,
 }));
 
 export default function CalendarVerticalResource({ rooms, dateView }: Props) {
diff --git a/booking-app/components/src/client/routes/booking/components/FormInput.tsx b/booking-app/components/src/client/routes/booking/components/FormInput.tsx
index 0122e897..82324f79 100644
--- a/booking-app/components/src/client/routes/booking/components/FormInput.tsx
+++ b/booking-app/components/src/client/routes/booking/components/FormInput.tsx
@@ -46,8 +46,7 @@ const Container = styled(Box)(({ theme }) => ({
   flexDirection: "column",
   alignItems: "flex-start",
   borderRadius: "4px",
-  //TODO: Fix later
-  //border: `1px solid ${theme.palette.custom.border}` || "#e3e3e3",
+  border: `1px solid ${theme.palette.custom.border}` || "#e3e3e3",
 }));
 
 export default function FormInput() {
diff --git a/booking-app/components/src/client/routes/booking/formPages/UserRolePage.tsx b/booking-app/components/src/client/routes/booking/formPages/UserRolePage.tsx
index a4fe5513..2465980b 100644
--- a/booking-app/components/src/client/routes/booking/formPages/UserRolePage.tsx
+++ b/booking-app/components/src/client/routes/booking/formPages/UserRolePage.tsx
@@ -1,4 +1,5 @@
 "use client";
+
 import { Box, Button, Typography } from "@mui/material";
 import { Department, Role } from "../../../../types";
 import React, { useContext, useEffect } from "react";
@@ -6,8 +7,8 @@ import React, { useContext, useEffect } from "react";
 import { BookingContext } from "../bookingProvider";
 import Dropdown from "../components/Dropdown";
 import { styled } from "@mui/material/styles";
-import { useRouter } from "next/navigation";
 import { useAuth } from "../../components/AuthProvider";
+import { useRouter } from "next/navigation";
 
 const Center = styled(Box)`
   width: 100%;
@@ -23,7 +24,6 @@ const Container = styled(Box)(({ theme }) => ({
   flexDirection: "column",
   alignItems: "center",
   borderRadius: "4px",
-  //TODO: Fix later
   border: `1px solid ${theme.palette.divider}`,
 }));
 
diff --git a/booking-app/components/src/client/routes/components/Table.tsx b/booking-app/components/src/client/routes/components/Table.tsx
index 88ec9f47..db1280f6 100644
--- a/booking-app/components/src/client/routes/components/Table.tsx
+++ b/booking-app/components/src/client/routes/components/Table.tsx
@@ -13,8 +13,7 @@ import React from "react";
 import { styled } from "@mui/system";
 
 const TableCustom = styled(MuiTable)(({ theme }) => ({
-  //TODO: Fix later
-  //border: `1px solid ${theme.palette.custom.border}`,
+  border: `1px solid ${theme.palette.custom.border}`,
   borderCollapse: "separate",
   borderRadius: "0px 0px 4px 4px",
 
@@ -24,8 +23,7 @@ const TableCustom = styled(MuiTable)(({ theme }) => ({
 }));
 
 const ShadedHeader = styled(TableHead)(({ theme }) => ({
-  //TODO: Fix later
-  //backgroundColor: theme.palette.custom.gray,
+  backgroundColor: theme.palette.custom.gray,
 }));
 
 export const TableTopRow = styled(MuiTable)`