From 4e1c68786306434aabad8ce63a1b1477a6076414 Mon Sep 17 00:00:00 2001
From: eli384 <88353612+edl21@users.noreply.github.com>
Date: Sat, 30 Sep 2023 12:36:07 +1300
Subject: [PATCH 1/3] functionality added

---
 .../src/components/ProfileBookingHistory.js   | 172 ++++++++++++------
 frontend/src/pages/Profile.js                 |   2 +-
 2 files changed, 115 insertions(+), 59 deletions(-)

diff --git a/frontend/src/components/ProfileBookingHistory.js b/frontend/src/components/ProfileBookingHistory.js
index 92a23180f..273620612 100644
--- a/frontend/src/components/ProfileBookingHistory.js
+++ b/frontend/src/components/ProfileBookingHistory.js
@@ -1,64 +1,120 @@
-import React from "react"
-import { CardContent, Stack, Card, Typography } from "@mui/material"
+import React, { useState, useEffect } from "react"
+import { db } from "../firebase"
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableContainer,
+  TableHead,
+  TableRow,
+  Paper,
+  Card,
+  CardContent,
+  Typography,
+  Stack,
+} from "@mui/material"
+import {
+  doc,
+  collection,
+  where,
+  query,
+  orderBy,
+  getDocs,
+} from "@firebase/firestore"
+
+const ProfileBookingHistory = ({ userId }) => {
+  const [bookings, setBookings] = useState([])
+  const [loading, setLoading] = useState(true)
+
+  useEffect(() => {
+    if (!userId) return
+    setLoading(true)
+
+    const fetchData = async () => {
+      try {
+        const userDocRef = doc(db, "users", userId)
+        const q = query(
+          collection(db, "bookings"),
+          where("user_id", "==", userDocRef),
+          orderBy("check_in", "desc")
+        )
+
+        const querySnapshot = await getDocs(q)
+
+        const fetchedBookings = querySnapshot.docs.map((doc) => ({
+          id: doc.id,
+          ...doc.data(),
+        }))
+        setBookings(fetchedBookings)
+      } catch (error) {
+        console.error("Error fetching user bookings: ", error)
+      } finally {
+        setLoading(false)
+      }
+    }
+
+    fetchData()
+  }, [userId])
 
-function ProfileBookingHistory() {
-  const mockBookingHistoryData = [
-    {
-      check_in: "Jan 1st 2021",
-      check_out: "Jan 4th 2021",
-      total_days: 4,
-      booking_id: 0,
-    },
-    {
-      check_in: "Aug 21st 2021",
-      check_out: "Aug 22nd 2021",
-      total_days: 2,
-      booking_id: 1,
-    },
-    {
-      check_in: "Sep 25th 2022",
-      check_out: "Sep 26th 2022",
-      total_days: 2,
-      booking_id: 2,
-    },
-  ]
   return (
-    <div>
-      <Card
-        sx={{
-          boxShadow: "0px 8px 44px 0px rgba(0, 0, 0, 0.14)",
-          backgroundColor: "white",
-          borderRadius: "15px",
-        }}
-      >
-        <CardContent sx={{ padding: "36px" }}>
-          <Stack spacing={4}>
-            <Typography
-              variant="h5"
-              align="left"
-              color="#457CC3"
-              sx={{ fontWeight: "900" }}
-            >
-              Booking History{" "}
+    <Card
+      sx={{
+        boxShadow: "0px 8px 44px 0px rgba(0, 0, 0, 0.14)",
+        backgroundColor: "white",
+        borderRadius: "15px",
+      }}
+    >
+      <CardContent sx={{ padding: "36px" }}>
+        <Stack spacing={4}>
+          <Typography
+            variant="h5"
+            align="left"
+            color="#457CC3"
+            sx={{ fontWeight: "900" }}
+          >
+            Booking History
+          </Typography>
+          {loading ? (
+            <Typography variant="body1" align="left">
+              {" "}
+              Loading...{" "}
+            </Typography>
+          ) : bookings.length === 0 ? (
+            <Typography variant="body1" align="left">
+              {" "}
+              You have no past bookings.{" "}
             </Typography>
-            <Stack spacing={2}>
-              {mockBookingHistoryData.map((booking) => (
-                <Stack
-                  key={booking.booking_id}
-                  direction="row"
-                  justifyContent="space-between"
-                >
-                  <Typography variant="body1" align="left">
-                    {" "}
-                    {booking.check_in} - {booking.check_out}{" "}
-                  </Typography>
-                </Stack>
-              ))}
-            </Stack>
-          </Stack>
-        </CardContent>
-      </Card>
-    </div>
+          ) : (
+            <TableContainer component={Paper}>
+              <Table>
+                <TableHead>
+                  <TableRow>
+                    <TableCell align="right">Check In</TableCell>
+                    <TableCell align="right">Check Out</TableCell>
+                  </TableRow>
+                </TableHead>
+                <TableBody>
+                  {bookings.map((booking) => (
+                    <TableRow key={booking.id}>
+                      <TableCell align="right">
+                        {new Date(
+                          booking.check_in.seconds * 1000
+                        ).toLocaleDateString("en-GB") || "N/A"}
+                      </TableCell>
+                      <TableCell align="right">
+                        {new Date(
+                          booking.check_out.seconds * 1000
+                        ).toLocaleDateString("en-GB") || "N/A"}
+                      </TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            </TableContainer>
+          )}
+        </Stack>
+      </CardContent>
+    </Card>
   )
 }
 
diff --git a/frontend/src/pages/Profile.js b/frontend/src/pages/Profile.js
index 1f9947d14..1c3576653 100644
--- a/frontend/src/pages/Profile.js
+++ b/frontend/src/pages/Profile.js
@@ -80,7 +80,7 @@ export default function Profile() {
             </Typography>
             <ProfileCalendarCard bookings={bookings} />
             <ProfileCurrentBookings bookings={bookings} />
-            <ProfileBookingHistory />
+            {user && <ProfileBookingHistory userId={user.uid} />}
           </Stack>
         </Stack>
       </Stack>

From 473e728cb4890f9428047e0bab4f77d39ca33e0e Mon Sep 17 00:00:00 2001
From: eli384 <88353612+edl21@users.noreply.github.com>
Date: Tue, 10 Oct 2023 14:58:22 +1300
Subject: [PATCH 2/3] uasc-92/UserBooking-BookingHistory

- Changed it to using the fetched data in the profile instead
- Showing past the current date now
- Added comments
---
 .../src/components/ProfileBookingHistory.js   | 63 ++++---------------
 frontend/src/pages/Profile.js                 |  2 +-
 2 files changed, 12 insertions(+), 53 deletions(-)

diff --git a/frontend/src/components/ProfileBookingHistory.js b/frontend/src/components/ProfileBookingHistory.js
index 273620612..8b0cb41be 100644
--- a/frontend/src/components/ProfileBookingHistory.js
+++ b/frontend/src/components/ProfileBookingHistory.js
@@ -1,5 +1,4 @@
-import React, { useState, useEffect } from "react"
-import { db } from "../firebase"
+import React from "react"
 import {
   Table,
   TableBody,
@@ -13,48 +12,13 @@ import {
   Typography,
   Stack,
 } from "@mui/material"
-import {
-  doc,
-  collection,
-  where,
-  query,
-  orderBy,
-  getDocs,
-} from "@firebase/firestore"
-
-const ProfileBookingHistory = ({ userId }) => {
-  const [bookings, setBookings] = useState([])
-  const [loading, setLoading] = useState(true)
-
-  useEffect(() => {
-    if (!userId) return
-    setLoading(true)
-
-    const fetchData = async () => {
-      try {
-        const userDocRef = doc(db, "users", userId)
-        const q = query(
-          collection(db, "bookings"),
-          where("user_id", "==", userDocRef),
-          orderBy("check_in", "desc")
-        )
-
-        const querySnapshot = await getDocs(q)
 
-        const fetchedBookings = querySnapshot.docs.map((doc) => ({
-          id: doc.id,
-          ...doc.data(),
-        }))
-        setBookings(fetchedBookings)
-      } catch (error) {
-        console.error("Error fetching user bookings: ", error)
-      } finally {
-        setLoading(false)
-      }
-    }
-
-    fetchData()
-  }, [userId])
+const ProfileBookingHistory = ({ bookings }) => {
+  // Filter out bookings that have check-out dates in the past.
+  const pastBookings =
+    bookings?.filter(
+      (booking) => booking.data().check_out.toDate() < new Date()
+    ) || []
 
   return (
     <Card
@@ -74,12 +38,7 @@ const ProfileBookingHistory = ({ userId }) => {
           >
             Booking History
           </Typography>
-          {loading ? (
-            <Typography variant="body1" align="left">
-              {" "}
-              Loading...{" "}
-            </Typography>
-          ) : bookings.length === 0 ? (
+          {pastBookings.length === 0 ? (
             <Typography variant="body1" align="left">
               {" "}
               You have no past bookings.{" "}
@@ -94,16 +53,16 @@ const ProfileBookingHistory = ({ userId }) => {
                   </TableRow>
                 </TableHead>
                 <TableBody>
-                  {bookings.map((booking) => (
+                  {pastBookings.map((booking) => (
                     <TableRow key={booking.id}>
                       <TableCell align="right">
                         {new Date(
-                          booking.check_in.seconds * 1000
+                          booking.data().check_in.seconds * 1000
                         ).toLocaleDateString("en-GB") || "N/A"}
                       </TableCell>
                       <TableCell align="right">
                         {new Date(
-                          booking.check_out.seconds * 1000
+                          booking.data().check_out.seconds * 1000
                         ).toLocaleDateString("en-GB") || "N/A"}
                       </TableCell>
                     </TableRow>
diff --git a/frontend/src/pages/Profile.js b/frontend/src/pages/Profile.js
index 1c3576653..491beed1a 100644
--- a/frontend/src/pages/Profile.js
+++ b/frontend/src/pages/Profile.js
@@ -80,7 +80,7 @@ export default function Profile() {
             </Typography>
             <ProfileCalendarCard bookings={bookings} />
             <ProfileCurrentBookings bookings={bookings} />
-            {user && <ProfileBookingHistory userId={user.uid} />}
+            <ProfileBookingHistory bookings={bookings} />
           </Stack>
         </Stack>
       </Stack>

From f9a1092ac5845bda6d5ff10a7f17b2bd1c2651f6 Mon Sep 17 00:00:00 2001
From: bwon783 <86991521+BW82262@users.noreply.github.com>
Date: Sat, 6 Jan 2024 22:29:43 +1300
Subject: [PATCH 3/3] Update firestore.rules

---
 frontend/firestore.rules | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/firestore.rules b/frontend/firestore.rules
index 570db81de..391bb5aa6 100644
--- a/frontend/firestore.rules
+++ b/frontend/firestore.rules
@@ -3,7 +3,7 @@ service cloud.firestore {
   match /databases/{database}/documents {
     match /{document=**} {
       allow read, write: if
-        request.time < timestamp.date(2023, 10, 31);
+        request.time < timestamp.date(2024, 1, 31);
     }
   }
 }