diff --git a/frontend/app/components/reservation_summary.tsx b/frontend/app/components/reservation_summary.tsx
index 0013ccc88..a3357ac79 100644
--- a/frontend/app/components/reservation_summary.tsx
+++ b/frontend/app/components/reservation_summary.tsx
@@ -6,7 +6,17 @@ import AccountBalanceOutlinedIcon from "@mui/icons-material/AccountBalanceOutlin
import AddToHomeScreenIcon from "@mui/icons-material/AddToHomeScreen";
import Line from "./line";
-function Reserv() {
+type ResProps = {
+ time?: string;
+ price?: string;
+};
+
+function Reserv({ time, price }: ResProps) {
+ const ResDetails = {
+ time: time || "0",
+ price: price || "0",
+ };
+
return (
@@ -15,17 +25,12 @@ function Reserv() {
-
+
Time Reserved:
-
5:30 PM
-
-
-
1x
-
1 hour
-
(Individual Seat)
+
{ResDetails.time}
-
₱ 80.00
+
₱ {ResDetails.price}
@@ -35,7 +40,7 @@ function Reserv() {
Subtotal Fee
- ₱ 80.00
+ ₱ {ResDetails.price}
@@ -64,17 +69,6 @@ function Reserv() {
title="GCash"
marginRight="220px"
>
-
-
- }
- title="Paymaya"
- marginRight="205px"
- >
);
}
diff --git a/frontend/app/payment_details/page.tsx b/frontend/app/payment_details/page.tsx
index eb7a2d633..a0689c4e3 100644
--- a/frontend/app/payment_details/page.tsx
+++ b/frontend/app/payment_details/page.tsx
@@ -26,8 +26,8 @@ function Page() {
title="Payment Details"
subTitle1="Select your preferred payment method"
/>
-
-
+ {" "}
+ {/*insert values for RESERVED TIME and its PRICE inside "Reserv".. props are "time" and "price"*/}
);
}
diff --git a/frontend/app/reservation/page.tsx b/frontend/app/reservation/page.tsx
index f8939913e..3f556834f 100644
--- a/frontend/app/reservation/page.tsx
+++ b/frontend/app/reservation/page.tsx
@@ -5,12 +5,36 @@ import TemporaryDrawer from "../components/side_bar";
import { ChairRight, ChairLeft, ChairDown, ChairUp } from "../components/svgs";
import BasicModal from "../components/modal";
+interface Accounts {
+ UserID: number;
+ Username: string;
+}
+
function Page() {
useEffect(() => {
// Set the title directly for the browser tab
document.title = "Reservation";
}, []);
+ const [accounts, setAccounts] = useState([]);
+
+ /*
+ useEffect(() => {
+ fetch("http://localhost:5000/api/get-reservations")
+ .then((response) => response.json())
+ .then((data: { accounts: Accounts[] }) => {
+ const simplifiedData = data.accounts.map(({ UserID, Username }) => ({
+ UserID,
+ Username,
+ }));
+ setAccounts(simplifiedData);
+ })
+ .catch((error) => {
+ console.error("Error fetching data:", error);
+ });
+ }, []);
+ */
+
const [isModalOpen, setModalOpen] = React.useState(false);
const handleModalOpen = () => {
diff --git a/frontend/app/sign_in/page.tsx b/frontend/app/sign_in/page.tsx
index ed8ccab1c..b322bf9ce 100644
--- a/frontend/app/sign_in/page.tsx
+++ b/frontend/app/sign_in/page.tsx
@@ -40,10 +40,19 @@ function Page() {
console.log("data", data.user_data);
localStorage.setItem("user", JSON.stringify(data.user_data));
router.push("/reservation");
- } else router.push("/admin_dashboard");
+ } else {
+ router.push("/admin_dashboard");
+ }
} else {
const errorData = await response.json();
- console.error("Login failed:", errorData.message);
+ if (response.status === 401) {
+ console.error("Authentication failed:", errorData.message);
+ // Display an alert for incorrect username or password
+ alert("The User Name or Password is incorrect.");
+ } else {
+ console.error("Login failed:", errorData.message);
+ // Handle other types of errors here
+ }
}
} catch (error) {
console.error(error);