added MyLoansPage component and integrated loan deletion functionality; updated routing in App and added Header component

backend/routes/api.js

@@ -26,6 +26,7 @@ import {
   createAPIentry,
   deleteAPKey,
   getLoanInfoWithID,
+  SETdeleteLoanFromDatabase,
 } from "../services/database.js";
 import { authenticate, generateToken } from "../services/tokenService.js";
 const router = express.Router();
@@ -261,6 +262,16 @@ router.delete("/deleteLoan/:id", authenticate, async (req, res) => {
   }
 });
 
+router.delete("/SETdeleteLoan/:id", authenticate, async (req, res) => {
+  const loanId = req.params.id;
+  const result = await SETdeleteLoanFromDatabase(loanId);
+  if (result.success) {
+    res.status(200).json({ message: "Loan deleted successfully" });
+  } else {
+    res.status(500).json({ message: "Failed to delete loan" });
+  }
+});
+
 router.post("/borrowableItems", authenticate, async (req, res) => {
   const { startDate, endDate } = req.body || {};
   if (!startDate || !endDate) {

backend/services/database.js

@@ -126,9 +126,10 @@ export const getLoansFromDatabase = async () => {
 };
 
 export const getUserLoansFromDatabase = async (username) => {
-  const [result] = await pool.query("SELECT * FROM loans WHERE username = ?;", [
-    username,
-  ]);
+  const [result] = await pool.query(
+    "SELECT * FROM loans WHERE username = ? AND deleted = 0;",
+    [username]
+  );
   if (result.length > 0) {
     return { success: true, data: result };
   } else if (result.length == 0) {
@@ -149,6 +150,18 @@ export const deleteLoanFromDatabase = async (loanId) => {
   }
 };
 
+export const SETdeleteLoanFromDatabase = async (loanId) => {
+  const [result] = await pool.query(
+    "UPDATE loans SET deleted = 1 WHERE id = ?;",
+    [loanId]
+  );
+  if (result.affectedRows > 0) {
+    return { success: true };
+  } else {
+    return { success: false };
+  }
+};
+
 export const getBorrowableItemsFromDatabase = async (
   startDate,
   endDate,