Staging 12.12

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

@@ -4,7 +4,6 @@ import { serverApproveBooking } from "@/components/src/server/admin";
 
 export async function POST(req: NextRequest) {
   const { id, email } = await req.json();
-
   try {
     await serverApproveBooking(id, email);
     return NextResponse.json(
@@ -14,8 +13,8 @@ export async function POST(req: NextRequest) {
   } catch (error) {
     console.error(`booking_id: ${id} Error approving:`, error);
     return NextResponse.json(
-      { error: `Failed to approve booking. id: ${id}` },
-      { status: 500 },
+      { error: error.message },
+      { status: error.status },
     );
   }
 }

booking-app/app/equipment/page.tsx

@@ -0,0 +1,16 @@
+// app/liaison/page.tsx
+
+"use client";
+
+import Equipment from "@/components/src/client/routes/equipment/Equipment";
+import { Suspense } from "react";
+
+const EquipmentPage: React.FC = () => {
+  return (
+    <Suspense fallback={<div>Loading...</div>}>
+      <Equipment />
+    </Suspense>
+  );
+};
+
+export default EquipmentPage;

booking-app/clientInfo

@@ -0,0 +1 @@
+o4Qd0YDOKtCR95EUyQ2Rbp5UbNUa:XkfbKenefg7ntnRR1D3r3nTo_lQa

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

@@ -0,0 +1,16 @@
+import { Typography } from "@mui/material";
+import { EquipmentUsers } from "./EquipmentUsers";
+import { Liaisons } from "./Liaisons";
+
+export const Approvers = () => (
+  <div>
+    <Typography style={{ marginBottom: 24 }} variant="h6">
+      Liaison Users
+    </Typography>
+    <Liaisons />
+    <Typography style={{ marginTop: 48, marginBottom: 24 }} variant="h6">
+      Equipment Users
+    </Typography>
+    <EquipmentUsers />
+  </div>
+);

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

@@ -36,7 +36,7 @@ export default function BookingActions(props: Props) {
   const [selectedAction, setSelectedAction] = useState<Actions>(
     Actions.PLACEHOLDER
   );
-  const { reloadBookings } = useContext(DatabaseContext);
+  const { reloadFutureBookings } = useContext(DatabaseContext);
   const [showError, setShowError] = useState(false);
   const [reason, setReason] = useState<string>();
 
@@ -54,7 +54,7 @@ export default function BookingActions(props: Props) {
   };
 
   const reload = async () => {
-    reloadBookings();
+    reloadFutureBookings();
   };
 
   const onError = () => {

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

@@ -0,0 +1,60 @@
+import { useContext, useMemo } from "react";
+
+import { ApproverLevel, TableNames } from "../../../../policy";
+import { formatDate } from "../../../utils/date";
+import AddRow from "../../components/AddRow";
+import ListTable from "../../components/ListTable";
+import { DatabaseContext } from "../../components/Provider";
+
+const AddEquipmentForm = ({ equipmentEmails, reloadEquipmentEmails }) => {
+  return (
+    <AddRow
+      addDuplicateErrorMessage="This user is already registered"
+      addFailedErrorMessage="Failed to add user as equipments"
+      columnNameUniqueValue="email"
+      inputPlaceholder="Add email"
+      tableName={TableNames.APPROVERS}
+      rows={equipmentEmails}
+      rowsRefresh={reloadEquipmentEmails}
+      title="Equipment Users"
+      extra={{
+        values: { level: ApproverLevel.EQUIPMENT },
+      }}
+    />
+  );
+};
+
+export const EquipmentUsers = () => {
+  const { equipmentUsers, reloadApproverUsers } = useContext(DatabaseContext);
+  const equipmentEmails = useMemo<string[]>(
+    () => equipmentUsers.map((user) => user.email),
+    [equipmentUsers]
+  );
+
+  const rows = useMemo(() => {
+    const filtered = equipmentUsers.map((liaison) => {
+      const { level, ...other } = liaison;
+      return other;
+    });
+    const sorted = filtered.sort((a, b) =>
+      a.department.localeCompare(b.department)
+    );
+    return sorted as unknown as { [key: string]: string }[];
+  }, [equipmentUsers]);
+
+  return (
+    <ListTable
+      tableName={TableNames.APPROVERS}
+      columnNameToRemoveBy="email"
+      rows={rows}
+      rowsRefresh={reloadApproverUsers}
+      topRow={
+        <AddEquipmentForm
+          equipmentEmails={equipmentEmails}
+          reloadEquipmentEmails={reloadApproverUsers}
+        />
+      }
+      columnFormatters={{ createdAt: formatDate }}
+    />
+  );
+};

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

@@ -1,23 +1,23 @@
 import { Divider, ListItemButton, ListItemText, Stack } from "@mui/material";
 
+import Grid from "@mui/material/Unstable_Grid2";
+import { useState } from "react";
 import { AdminUsers } from "./AdminUsers";
+import { Approvers } from "./Approvers";
 import { BannedUsers } from "./Ban";
 import BookingTypes from "./BookingTypes";
 import { Departments } from "./Departments";
 import ExportDatabase from "./ExportDatabase";
-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" },
   { label: "PA Users", id: "pa" },
   { label: "Admin Users", id: "admin" },
-  { label: "Liaisons", id: "liaisons" },
+  { label: "Approvers", id: "approvers" },
   { label: "Departments", id: "departments" },
   { label: "Ban", id: "ban" },
   { label: "Booking Types", id: "bookingTypes" },
@@ -51,7 +51,7 @@ export default function Settings() {
         {tab === "safetyTraining" && <SafetyTrainedUsers />}
         {tab === "pa" && <PAUsers />}
         {tab === "admin" && <AdminUsers />}
-        {tab === "liaisons" && <Liaisons />}
+        {tab === "approvers" && <Approvers />}
         {tab === "ban" && <BannedUsers />}
         {tab === "departments" && <Departments />}
         {tab === "bookingTypes" && <BookingTypes />}

booking-app/components/src/client/routes/admin/hooks/useBookingActions.tsx

@@ -1,4 +1,3 @@
-import { BookingStatusLabel, PageContextLevel } from "@/components/src/types";
 import {
   cancel,
   checkOut,
@@ -7,13 +6,14 @@ import {
   decline,
   noShow,
 } from "@/components/src/server/db";
+import { BookingStatusLabel, PageContextLevel } from "@/components/src/types";
 import { useContext, useMemo, useState } from "react";
 
+import { Timestamp } from "@firebase/firestore";
+import { useRouter } from "next/navigation";
 import { BookingContext } from "../../booking/bookingProvider";
 import { DatabaseContext } from "../../components/Provider";
-import { Timestamp } from "@firebase/firestore";
 import useExistingBooking from "./useExistingBooking";
-import { useRouter } from "next/navigation";
 
 export enum Actions {
   CANCEL = "Cancel",
@@ -146,6 +146,7 @@ export default function useBookingActions({
       status !== BookingStatusLabel.CHECKED_IN &&
       status !== BookingStatusLabel.CHECKED_OUT &&
       status !== BookingStatusLabel.NO_SHOW &&
+      status !== BookingStatusLabel.APPROVED &&
       startDate.toDate() > date
     ) {
       options.push(Actions.EDIT);
@@ -184,6 +185,7 @@ export default function useBookingActions({
   }, [status]);
 
   const liaisonOptions = [Actions.FIRST_APPROVE, Actions.DECLINE];
+  const equipmentOptions = [Actions.MODIFICATION, Actions.DECLINE];
 
   const adminOptions = useMemo(() => {
     if (
@@ -215,6 +217,8 @@ export default function useBookingActions({
         return paOptions;
       case PageContextLevel.LIAISON:
         return liaisonOptions;
+      case PageContextLevel.EQUIPMENT:
+        return equipmentOptions;
       default:
         return adminOptions;
     }

booking-app/components/src/client/routes/admin/hooks/useExistingBooking.tsx

@@ -12,10 +12,10 @@ export default function useExistingBooking() {
     setBookingCalendarInfo,
     setFormData,
   } = useContext(BookingContext);
-  const { bookings, roomSettings } = useContext(DatabaseContext);
+  const { futureBookings, roomSettings } = useContext(DatabaseContext);
 
   const findBooking = (calendarEventId: string) =>
-    bookings.filter(
+    futureBookings.filter(
       (booking) => booking.calendarEventId === calendarEventId
     )[0];
 

booking-app/components/src/client/routes/booking/hooks/useSubmitBooking.tsx

@@ -10,7 +10,7 @@ export default function useSubmitBooking(formContext: FormContextLevel) {
   const {
     liaisonUsers,
     userEmail,
-    reloadBookings,
+    reloadFutureBookings,
     pagePermission,
     roomSettings,
   } = useContext(DatabaseContext);
@@ -122,7 +122,7 @@ export default function useSubmitBooking(formContext: FormContextLevel) {
           setFormData(undefined);
           setHasShownMocapModal(false);
 
-          reloadBookings();
+          reloadFutureBookings();
           setSubmitting("success");
         })
         .catch((error) => {
@@ -136,7 +136,7 @@ export default function useSubmitBooking(formContext: FormContextLevel) {
       liaisonUsers,
       userEmail,
       router,
-      reloadBookings,
+      reloadFutureBookings,
       department,
       role,
     ]

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

@@ -1,12 +1,12 @@
-import { Box, IconButton, TextField } from "@mui/material";
+import { IconButton, TextField } from "@mui/material";
 import React, { useMemo, useState } from "react";
 
+import { Timestamp } from "@firebase/firestore";
 import { AddCircleOutline } from "@mui/icons-material";
 import Grid from "@mui/material/Unstable_Grid2/Grid2";
-import Loading from "./Loading";
-import { TableNames } from "../../../policy";
-import { Timestamp } from "@firebase/firestore";
 import { clientSaveDataToFirestore } from "../../../../../lib/firebase/firebase";
+import { TableNames } from "../../../policy";
+import Loading from "./Loading";
 
 interface Props {
   addDuplicateErrorMessage?: string;
@@ -18,9 +18,9 @@ interface Props {
   rowsRefresh: () => Promise<void>;
   title: string;
   extra?: {
-    components: React.ReactNode[];
+    components?: React.ReactNode[];
     values: { [key: string]: any };
-    updates: ((x: string) => void)[];
+    updates?: ((x: string) => void)[];
   };
 }