Merge pull request #510 from ITPNYU/revert-505-main

Revert "Prod Release 11.21"

README.md

@@ -1,44 +1,54 @@
-# Booking App
+# 370J Media Commons Room Reservation App
 
-This project is a booking management application built with Next.js.
+## About
 
-## Getting Started
+This application is designed for reserving rooms at the 370J Media Commons Room.
 
-Follow these steps to run the application in your local environment.
+## Technologies Used
 
-### Prerequisites
+- **Google App Script**: For backend scripting and integration.
+- **React & Google App Script**: Utilizing [React-Google-Apps-Script](https://github.com/enuchi/React-Google-Apps-Script) for a responsive front-end experience.
+- **clasp**: For Google Apps Script project management and deployment.
 
-- Node.js (version 18 or later)
-- npm (usually comes with Node.js)
+## Deployment
 
-### Installation
+We employ GitHub workflows for our deployment process. Pushing or merging to different branches will automatically trigger different Google App Script deploys:
+- `main` branch: triggers the DEVELOPMENT deploy, which serves from localhost and reads/writes the development calendars
+- `staging` branch: triggers the STAGING deploy, which serves from the GAS project and reads/writes the development calendars
+- `prod` branch: triggers the PRODUCTION deploy, which serves from the GAS project and reads/writes the **production** calendars
 
-1. Clone the repository or download the project files.
+The `NODE_ENV` environment variable controls where we serve from, and the `CALENDAR_ENV` environment variable controls which calendars we use. These values are specified in the `package.json` commands triggered by the workflows
 
-2. Navigate to the project directory:
-   ```
-   cd booking-app
-   ```
-3. Install the dependencies:
-   `npm install`
-4. Obtain the `.env` file from a project administrator and place it in the root directory of the project.
+## Preparation
 
-### Running the Application
+Before setting up the project, ensure you have the following:
 
-To start the development server:
-`npm run dev`
-The application should now be running on [http://localhost:3000](http://localhost:3000).
+- `.clasprc.json` file from another developer.
+- `deploymentId` for Google Apps Script.
 
-## Environment Variables
+## Setup Instructions
 
-This project uses environment variables for configuration. Make sure you have received the `.env` file from a project administrator and placed it in the root directory before running the application.
+When developing locally, please follow the flow below.
 
-## Deployment
+1. **Clone the Repository**:
+2. **Configure `.clasprc.json`**:
+   Set up the `.clasprc.json` file with the necessary credentials.
+3. **Install Packages**:
+   ```bash
+   npm install
+   ```
+4. **Upload Local Code to Google App Script**:
 
-This project uses automated deployment pipelines:
+   ```bash
+   npm run start
+   ```
 
-- Pushing to the `main` branch automatically deploys to the development environment.
-- Pushing to the `staging` branch automatically deploys to the staging environment.
-- Pushing to the `production` branch automatically deploys to the production environment.
+   Please continue running this and execute the following command.
 
-Please ensure you push your changes to the appropriate branch based on the intended deployment environment.
+5. **Create a New Version of Google App Script**:
+   Deploy using clasp, targeting your `deploymentId`:
+   ```bash
+   clasp deploy --deploymentId ${deploymentID} -d DEV_YOURNAME
+   ```
+6. **Access the Application**:
+   You can now access the app at `https://script.google.com/a/macros/nyu.edu/s/${deploymentId}/exec`.

booking-app/app/api/bookings/route.ts

@@ -10,6 +10,7 @@ import {
   serverUpdateDataByCalendarEventId,
 } from "@/components/src/server/admin";
 import { deleteEvent, insertEvent } from "@/components/src/server/calendars";
+import { getBookingToolDeployUrl } from "@/components/src/server/ui";
 import {
   ApproverType,
   BookingFormDetails,
@@ -114,6 +115,7 @@ async function handleBookingApprovalEmails(
       email,
       startDate: bookingCalendarInfo?.startStr,
       endDate: bookingCalendarInfo?.endStr,
+      bookingToolUrl: getBookingToolDeployUrl(),
       headerMessage: "This is a request email for first approval.",
       requestNumber: sequentialId,
     };

booking-app/app/lib/sendHTMLEmail.ts

@@ -1,5 +1,4 @@
 import { serverFormatDate } from "@/components/src/client/utils/serverDate";
-import { MEDIA_COMMONS_EMAIL } from "@/components/src/mediaCommonsPolicy";
 import { getEmailBranchTag } from "@/components/src/server/emails";
 import { ApproverType } from "@/components/src/types";
 import { getGmailClient } from "@/lib/googleClient";
@@ -25,7 +24,6 @@ interface SendHTMLEmailParams {
   requestNumber: number;
   body: string;
   approverType?: ApproverType;
-  replyTo?: string;
 }
 
 export const sendHTMLEmail = async (params: SendHTMLEmailParams) => {
@@ -38,7 +36,6 @@ export const sendHTMLEmail = async (params: SendHTMLEmailParams) => {
     requestNumber,
     body,
     approverType,
-    replyTo = MEDIA_COMMONS_EMAIL,
   } = params;
 
   const subj = `${getEmailBranchTag()}${status} - Media Commons request #${requestNumber}: "${eventTitle}"`;
@@ -87,7 +84,6 @@ export const sendHTMLEmail = async (params: SendHTMLEmailParams) => {
   const messageParts = [
     "From: 'Media Commons' <>",
     `To: ${targetEmail}`,
-    `Reply-To: ${replyTo}`,
     "Content-Type: text/html; charset=utf-8",
     "MIME-Version: 1.0",
     `Subject: ${subj}`,

booking-app/components/src/client/routes/admin/components/PolicySettings.tsx

@@ -1,12 +1,11 @@
 import { Box } from "@mui/material";
 import FinalApprover from "./policySettings/FinalApprover";
-import OperationalHours from "./policySettings/OperationalHours";
+import React from "react";
 
 export default function PolicySettings() {
   return (
     <Box>
       <FinalApprover />
-      <OperationalHours />
     </Box>
   );
 }

booking-app/components/src/client/routes/admin/components/Settings.tsx

@@ -1,17 +1,17 @@
 import { Divider, ListItemButton, ListItemText, Stack } from "@mui/material";
+import React, { useState } from "react";
 
 import { AdminUsers } from "./AdminUsers";
 import { BannedUsers } from "./Ban";
 import BookingTypes from "./BookingTypes";
 import { Departments } from "./Departments";
 import ExportDatabase from "./ExportDatabase";
+import FinalApproverSetting from "./PolicySettings";
 import Grid from "@mui/material/Unstable_Grid2";
 import { Liaisons } from "./Liaisons";
 import { PAUsers } from "./PAUsers";
-import PolicySettings from "./PolicySettings";
 import SafetyTrainedUsers from "./SafetyTraining";
 import SyncCalendars from "./SyncCalendars";
-import { useState } from "react";
 
 const tabs = [
   { label: "Safety Training", id: "safetyTraining" },
@@ -55,7 +55,7 @@ export default function Settings() {
         {tab === "ban" && <BannedUsers />}
         {tab === "departments" && <Departments />}
         {tab === "bookingTypes" && <BookingTypes />}
-        {tab === "policy" && <PolicySettings />}
+        {tab === "policy" && <FinalApproverSetting />}
         {tab === "export" && <ExportDatabase />}
         {tab === "syncCalendars" && <SyncCalendars />}
       </Grid>

booking-app/components/src/client/routes/booking/components/CalendarVerticalResource.tsx

@@ -6,11 +6,10 @@ import {
   EventDropArg,
 } from "@fullcalendar/core";
 import CalendarEventBlock, { NEW_TITLE_TAG } from "./CalendarEventBlock";
-import { Days, FormContextLevel, RoomSetting } from "../../../../types";
-import { useContext, useEffect, useMemo, useRef } from "react";
+import { FormContextLevel, RoomSetting } from "../../../../types";
+import React, { useContext, useEffect, useMemo, useRef } from "react";
 
 import { BookingContext } from "../bookingProvider";
-import { DatabaseContext } from "../../components/Provider";
 import { Error } from "@mui/icons-material";
 import { EventResizeDoneArg } from "fullcalendar";
 import FullCalendar from "@fullcalendar/react";
@@ -85,7 +84,6 @@ export default function CalendarVerticalResource({
   rooms,
   dateView,
 }: Props) {
-  const { operationHours } = useContext(DatabaseContext);
   const {
     bookingCalendarInfo,
     existingCalendarEvents,
@@ -242,22 +240,6 @@ export default function CalendarVerticalResource({
     );
   }
 
-  const operationHoursToday = operationHours.find(
-    (setting) => Object.values(Days)[dateView.getDay()] === setting.day
-  );
-
-  if (operationHoursToday.isClosed) {
-    return (
-      <Empty>
-        <Typography>The Media Commons are closed on Sundays.</Typography>
-      </Empty>
-    );
-  }
-
-  const slotMinTime = `${operationHoursToday.open}:00:00`;
-  const slotMaxTime = `${operationHoursToday.close}:00:00`;
-  // don't use these values until we talk to Samantha/Jhanele
-
   return (
     <FullCalendarWrapper>
       <FullCalendar
@@ -284,8 +266,8 @@ export default function CalendarVerticalResource({
         eventResize={handleEventEdit}
         eventDrop={handleEventEdit}
         headerToolbar={false}
-        slotMinTime={slotMinTime}
-        slotMaxTime={slotMaxTime}
+        slotMinTime="09:00:00"
+        slotMaxTime="21:00:00"
         allDaySlot={false}
         aspectRatio={isMobile ? 0.5 : 1.5}
         expandRows={true}

booking-app/components/src/client/routes/booking/formPages/BookingFormDetailsPage.tsx

@@ -1,8 +1,8 @@
 "use client";
 
-import { FormContextLevel } from "@/components/src/types";
+import { FormContextLevel, UserApiData } from "@/components/src/types";
 import Grid from "@mui/material/Unstable_Grid2";
-import { useContext } from "react";
+import { useContext, useEffect, useState } from "react";
 import { DatabaseContext } from "../../components/Provider";
 import FormInput from "../components/FormInput";
 import useCheckFormMissingData from "../hooks/useCheckFormMissingData";
@@ -16,8 +16,29 @@ export default function BookingFormDetailsPage({
   calendarEventId,
   formContext = FormContextLevel.FULL_FORM,
 }: Props) {
-  const { userApiData } = useContext(DatabaseContext);
+  const { netId } = useContext(DatabaseContext);
   useCheckFormMissingData();
+  const [userApiData, setUserApiData] = useState<UserApiData | undefined>(
+    undefined
+  );
+  useEffect(() => {
+    const fetchUserData = async () => {
+      if (!netId) return;
+
+      try {
+        const response = await fetch(`/api/nyu/identity/${netId}`);
+
+        if (response.ok) {
+          const data = await response.json();
+          setUserApiData(data);
+        }
+      } catch (err) {
+        console.error("Failed to fetch user data:", err);
+      }
+    };
+
+    fetchUserData();
+  }, [netId]);
   return (
     <Grid container>
       <Grid width={330} />