production2 - Edit Reservations fix

back-end/.env.sample

@@ -0,0 +1,5 @@
+DATABASE_URL=database
+DATABASE_URL_DEVELOPMENT=database
+DATABASE_URL_TEST=database
+DATABASE_URL_PREVIEW=database
+LOG_LEVEL=info

back-end/src/reservations/reservations.controller.js

@@ -102,11 +102,6 @@ function correctTimesOnly(req, res, next){
   next()
 }
 
-function isValidTime(time) {
-  const timeFormat = /^([01]\d|2[0-3]):([0-5]\d)$/;
-  return timeFormat.test(time)
-}
-
 function propertiesExist(req, res, next){
   const { data = {} } = req.body;
 
@@ -187,6 +182,22 @@ async function updateReservation(req, res){
   res.status(200).json({data: data[0]})
 }
 
+function isValidTime(time) {
+  const timeFormatWithSeconds = /^([01]\d|2[0-3]):([0-5]\d):([0-5]\d)$/;
+  const timeFormatWithoutSeconds = /^([01]\d|2[0-3]):([0-5]\d)$/;
+
+  if (timeFormatWithSeconds.test(time)) {
+    return true;
+  }
+  else if (timeFormatWithoutSeconds.test(time)) {
+    return true;
+  }
+  else {
+    console.log("Invalid time format:", time);
+    return false;
+  }
+}
+
 async function editPropertiesExist(req, res, next){
   const { data = {} } = req.body;
   const {reservationId} = req.params
@@ -216,11 +227,11 @@ async function editPropertiesExist(req, res, next){
   }
 
   if (!reservation_date || reservation_date === "" || isNaN(Date.parse(reservation_date))){
-    return next({status: 400, message: "Reservation must include a reservation_date"});
+    return next({status: 400, message: `${999}: Reservation must include a valid reservation_date`});
   }
 
   if (!reservation_time || reservation_time === "" || !isValidTime(reservation_time)){
-    return next({status: 400, message: "Reservation must include a reservation_time"});
+    return next({status: 400, message: `${reservation_time}: Reservation must include a valid reservation_time `});
   }
 
   if (!people || people === "" || people === 0 || typeof people !== "number" ){

back-end/src/reservations/reservations.service.js

@@ -23,10 +23,10 @@ return knex("reservations")
 
   function read(reservationId){
     return knex("reservations")
-    .select("*")
-    .where({reservation_id: reservationId})
-    .first()
-  }
+        .select("*")
+        .where({reservation_id: reservationId})
+        .first()
+}
 
   function update(updatedReservation){
     return knex("reservations")

front-end/src/dashboard/Dashboard.js

@@ -104,7 +104,6 @@ function Dashboard() {
 
       const selectedTableId = event.target.value
       const finishedReservation = allReservations.find(reservation => reservation.reservation_id === Number(selectedTableId))
-      console.log("selected", selectedTableId, finishedReservation)
 
       try {
         await cancelReservation(finishedReservation)

front-end/src/layout/AssignTable.js

@@ -15,7 +15,6 @@ function AssignTable({rootReservations}) {
 
   const [tables, setTables] = useState([])
   const [selectedTable, setSelectedTable] = useState(null)
-  console.log(selectedTable)
 
   let navigate = useNavigate()
   const { reservationId } = useParams();

front-end/src/layout/CreateEditReservation.js

@@ -1,6 +1,6 @@
 import React, {useState, useEffect } from "react";
 import {useNavigate, useParams} from "react-router-dom"
-import { createReservation, editReservationData } from "../utils/api";
+import { createReservation, editReservationData, updateReservationEdit } from "../utils/api";
 import { formatAsDate } from "../utils/date-time";
 import ErrorAlert from "./ErrorAlert";
 
@@ -43,14 +43,27 @@ function CreateEditReservation(){
 
     const navigate = useNavigate()
 
+    const handleEdit = async (event) => {
+        event.preventDefault()
+        try {
+        console.log("handleSubmitEdit")
+          await updateReservationEdit(formData, reservationId);
+          setFormData(initialFormState);
+          navigate(`/dashboard`);
+        } catch (error) {
+          setFormError(error)
+        }
+    }
+
     const handleSubmit = async (event) => {
-        console.log("handleSubmit")
         event.preventDefault()
         try {
+        console.log("handleSubmit")
           await createReservation(formData);
           setFormData(initialFormState);
           navigate(`/dashboard`);
         } catch (error) {
+
           setFormError(error)
         }
       }
@@ -153,16 +166,126 @@ function CreateEditReservation(){
             <ErrorAlert error={formError} />
         </div>    
 )
+
+
+const editReservationForm = (
+    <div className="formtext">
+        <form onSubmit={handleEdit}>
+            <label htmlFor="first_name">
+                <b>First Name:</b>
+                <br />
+                <input
+                    id="first_name"
+                    type="text"
+                    name="first_name"
+                    onChange={handleChange}
+                    value={formData.first_name}
+                    placeholder="First Name"
+                    required
+                />
+            </label>
+            <br/>
+            <label htmlFor="last_name">
+                <b>Last Name:</b>
+                <br />
+                <input
+                    id="last_name"
+                    type="text"
+                    name="last_name"
+                    onChange={handleChange}
+                    value={formData.last_name}
+                    placeholder="Last Name"
+                    required
+                />
+            </label>
+            <br/>
+            <label htmlFor="mobile_number">
+                <b>Mobile Number:</b>
+                <br />
+                <input 
+                id="mobile_number" 
+                type="text"
+                name="mobile_number"
+                placeholder="XXX-XXX-XXXX"
+                pattern="(\d{3}-\d{3}-\d{4}|\d{10})"
+                onChange={handleChange}
+                value={formData.mobile_number}
+                required
+                title="Please enter a valid phone number with 10 digits"
+                >
+                </input>
+            </label>
+            <br/>
+            <label htmlFor="reservation_date">
+                <b>Reservation Date:</b>
+                <br />
+                <input 
+                id="reservation_date" 
+                type="date"
+                name="reservation_date"
+                onChange={handleChange}
+                value={formData.reservation_date}
+                placeholder="YYYY-MM-DD" 
+                pattern="\d{4}-\d{2}-\d{2}"
+                required
+                />
+            </label>
+            <br/>
+            <label htmlFor="reservation_time">
+                <b>Reservation Time:</b>
+                <br />
+                <input 
+                id="reservation_time" 
+                type="time"
+                name="reservation_time"
+                onChange={handleChange}
+                value={formData.reservation_time}
+                placeholder="HH:MM" 
+                pattern="[0-9]{2}:[0-9]{2}"
+                required
+                />
+            </label>
+            <br/>
+            <label htmlFor="people">
+                <b>Number of People:</b>
+                <br />
+                <input 
+                id="people" 
+                type="number"
+                name="people"
+                min="1"
+                onChange={handleChange} 
+                value={formData.people}
+                required
+                />
+            </label>
+            <br/>
+            <button type="submit" className="btn btn-primary">Submit</button>
+            <button onClick={() => navigate(-1)} className= "btn btn-secondary">Cancel</button>
+        </form>
+        <ErrorAlert error={formError} />
+    </div>    
+)
 
-return ( 
+return (
     <div>
-        <h3 className="title">New Reservation</h3>
-        {createReservationForm  }        
+        {reservationId ? (
+            <>
+                <h3 className="title">Edit Reservation</h3>
+                {editReservationForm}
+            </>
+        ) : (
+            <>
+                <h3 className="title">New Reservation</h3>
+                {createReservationForm}
+            </>
+        )}
     </div>
 )
 
 
 
+
 }
 
 

front-end/src/layout/CreateEditTable.js

@@ -11,8 +11,6 @@ function CreateEditTable(){
 
     const [formData, setFormData] = useState({...initialFormState})
     const [formError, setFormError] = useState(null);
-
-    console.log(formData)
 
     const navigate = useNavigate()
 

front-end/src/layout/Search.js

@@ -14,8 +14,6 @@ function Search({rootReservations}){
     const [noReservations, setNoReservations] = useState(false)
     const [tables, setTables] = useState([])
 
-    console.log("tables", tables)
-
     const navigate = useNavigate()
 
     useEffect(() => {

front-end/src/utils/api.js

@@ -88,7 +88,6 @@ export async function listReservations(params, signal) {
  */
 
 export async function loadReservation(reservationId, signal) {
-  console.log("api load", reservationId)
   try{
       const url = new URL(`${API_BASE_URL}/reservations/${reservationId}`);
   return await fetchJson(url, { headers, signal }, [])
@@ -148,7 +147,6 @@ export async function createReservation(reservation, signal) {
  *  a promise that resolves to the saved reservation, which will now have an 'id' property.
  */
 export async function cancelReservation(reservation, signal) {
-  console.log("Cancel Table API")
   try{
      const url = `${API_BASE_URL}/reservations/${reservation.reservation_id}/status`;
       const options = {
@@ -170,7 +168,6 @@ export async function cancelReservation(reservation, signal) {
  */
 
 export async function findReservations({ mobile_number }, signal) {
-  console.log("api reservation mobilenumber", mobile_number)
   try{
     const url = new URL(`${API_BASE_URL}/reservations`);
     if (mobile_number) {
@@ -186,9 +183,9 @@ export async function findReservations({ mobile_number }, signal) {
 }
 
 /**
- * Updates reservation "Seated" to the database.
+ * Updates reservation data to the database.
  * @returns {Promise<[reservation]>}
- *  a promise that resolves to the saved reservation, which will now have an 'id' property.
+ *  a promise that resolves to the saved reservation.
  */
 export async function editReservationData(reservationId, signal) {
   try{
@@ -199,6 +196,30 @@ export async function editReservationData(reservationId, signal) {
   }
 }
 
+
+/**
+ * Updates reservation data to the database.
+ * @returns {Promise<[reservation]>}
+ *  a promise that resolves to the saved reservation.
+ */
+export async function updateReservationEdit(reservation, reservationId, signal) {
+  try{
+
+    reservation.people = Number(reservation.people)
+    const url = `${API_BASE_URL}/reservations/${reservationId}`;
+
+    const options = {
+      method: "PUT",
+      headers,
+      body: JSON.stringify({ data: reservation }),
+      signal,
+    };
+    return await fetchJson(url, options, { signal }, {}); 
+  } catch (error){
+    throw error
+  }
+}
+
 /**
  * Updates reservation "Seated" to the database.
  * @returns {Promise<[reservation]>}
@@ -245,7 +266,6 @@ export async function updateReservationFinished(reservation, signal) {
  *  a promise that resolves to the saved table, which will now have an 'id' property.
  */
 export async function createTable(table, signal) {
-  console.log("create Table api", table)
   try{
      const url = `${API_BASE_URL}/tables`;
       table.capacity = Number(table.capacity);