From 1637c311843c32c81d959642eee970747e2b7cf5 Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Sun, 20 Oct 2024 18:16:22 +1300
Subject: [PATCH 1/9] fix: backend note delete route

---
 backend/src/db/daos/noteDao.js | 21 ++++++++++-----------
 backend/src/routes/api/note.js | 15 ++++++++++-----
 2 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/backend/src/db/daos/noteDao.js b/backend/src/db/daos/noteDao.js
index 7286cb09..523d97f4 100644
--- a/backend/src/db/daos/noteDao.js
+++ b/backend/src/db/daos/noteDao.js
@@ -1,5 +1,6 @@
 import Note from "../models/note.js";
 import Group from "../models/group.js";
+import { HttpError } from "../../util/error.js";
 
 /**
  * Checks if a user is in a group
@@ -48,19 +49,17 @@ const createNote = async (groupId, title, email, text = "") => {
  */
 const deleteNote = async (noteId, groupId, email) => {
   const role = await checkRole(groupId, email);
-  const note = await Note.findById(noteId);
-  if (note.role !== role) {
-    return null;
-  }
+  const note = await Note.findById(noteId, { role: 1 }).lean();
+  if (note?.role !== role) throw new HttpError(403, "Forbidden");
 
-  const updateQuery = {
-    $pull: { [`notes.${note.role}`]: noteId },
-  };
+  const updateQuery = { $pull: { [`notes.${note.role}`]: noteId } };
+  await Promise.all([
+    // remove reference
+    Group.updateOne({ _id: groupId }, updateQuery),
+    // remove document
+    Note.deleteOne({ _id: noteId }),
+  ]);
 
-  //  delete note from group
-  await Group.updateOne({ _id: groupId }, updateQuery);
-  //  delete note from note collection
-  await note.delete();
   return null;
 };
 
diff --git a/backend/src/routes/api/note.js b/backend/src/routes/api/note.js
index 8b771601..d975d55b 100644
--- a/backend/src/routes/api/note.js
+++ b/backend/src/routes/api/note.js
@@ -7,6 +7,8 @@ import {
   retrieveNote,
 } from "../../db/daos/noteDao.js";
 import auth from "../../middleware/firebaseAuth.js";
+import { handle } from "../../util/error.js";
+import STATUS from "../../util/status.js";
 
 const router = Router();
 const HTTP_OK = 200;
@@ -43,9 +45,12 @@ router.put("/update", async (req, res) => {
 });
 
 // Delete a note
-router.delete("/delete", async (req, res) => {
-  const { noteId, groupId, email } = req.body;
-  await deleteNote(noteId, groupId, email);
-  res.status(HTTP_OK).json("note deleted");
-});
+router.delete(
+  "/delete",
+  handle(async (req, res) => {
+    const { noteId, groupId, email } = req.body;
+    await deleteNote(noteId, groupId, email);
+    res.status(STATUS.OK).json("note deleted");
+  })
+);
 export default router;

From 60cb74ffaa0d5a2ee2cd9d906262e21b5dd5fc95 Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Sun, 20 Oct 2024 19:10:31 +1300
Subject: [PATCH 2/9] seperate note card from edit page

---
 .../playScenario/components/Note/Note.jsx     | 310 ------------------
 .../modals/NotesModal/EditPage.jsx            | 281 ++++++++++++++++
 .../NotesModal}/Note.module.scss              |   0
 .../modals/NotesModal/NoteCard.jsx            |  23 ++
 .../modals/NotesModal/NotesModal.jsx          |  20 +-
 5 files changed, 312 insertions(+), 322 deletions(-)
 delete mode 100644 frontend/src/features/playScenario/components/Note/Note.jsx
 create mode 100644 frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
 rename frontend/src/features/playScenario/{components/Note => modals/NotesModal}/Note.module.scss (100%)
 create mode 100644 frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx

diff --git a/frontend/src/features/playScenario/components/Note/Note.jsx b/frontend/src/features/playScenario/components/Note/Note.jsx
deleted file mode 100644
index 07ff605b..00000000
--- a/frontend/src/features/playScenario/components/Note/Note.jsx
+++ /dev/null
@@ -1,310 +0,0 @@
-import AuthenticationContext from "context/AuthenticationContext";
-import { useAuthDelete, useAuthGet, useAuthPut } from "hooks/crudHooks";
-import { useContext, useEffect, useState } from "react";
-import styles from "./Note.module.scss";
-
-export default function Note({ role, noteId, group, refetchGroup }) {
-  const { user } = useContext(AuthenticationContext);
-  const [noteContent, setContent] = useState();
-  const [title, setTitle] = useState();
-  const [date, setDate] = useState();
-  const [open, setOpen] = useState(false);
-  //  lock save process while saving
-  const [save, setSave] = useState(false);
-  //  check if user has same role
-  const [isRole, setRole] = useState(false);
-  //  show delete confirmation
-  const [showConfirm, setShowConfirm] = useState(false);
-  //  is the current version of the note saved
-  const [saved, setSaved] = useState(false);
-  const {
-    response: noteData,
-    loading: noteLoading,
-    error: noteError,
-    getRequest: retrieveNoteRequest,
-  } = useAuthGet(`/api/note/retrieve/${noteId}`);
-
-  const {
-    response: updateResult,
-    loading: updateLoading,
-    error: updateError,
-    putRequest: updateNoteRequest,
-  } = useAuthPut("/api/note/update");
-
-  const {
-    response: deleteResult,
-    loading: deleteLoading,
-    error: deleteError,
-    deleteRequest: deleteNoteRequest,
-  } = useAuthDelete(`/api/note/delete`);
-
-  const getRole = () => {
-    group.users.forEach((userToCheck) => {
-      if (userToCheck.email === user.email) {
-        if (userToCheck.role === role) {
-          setRole(true);
-        }
-      }
-    });
-  };
-
-  const loadNote = async () => {
-    if (noteData) {
-      setContent(noteData.text);
-      setTitle(noteData.title);
-      if (noteData.date) {
-        const dateObject = new Date(noteData.date);
-        setDate(dateObject);
-      }
-    }
-  };
-
-  async function fetchNote() {
-    console.log("fetching note");
-    await retrieveNoteRequest();
-    getRole();
-  }
-
-  useEffect(() => {
-    loadNote();
-  }, [noteData]);
-
-  useEffect(() => {
-    fetchNote();
-  }, []);
-
-  const handleContentInput = (e) => {
-    setSaved(false);
-    setContent(e.target.value);
-  };
-
-  const handleTitleInput = (e) => {
-    setSaved(false);
-    setTitle(e.target.value);
-  };
-
-  const handleOpen = () => {
-    setOpen(true);
-  };
-
-  const saveNote = async () => {
-    try {
-      await updateNoteRequest({
-        noteId,
-        text: noteContent,
-        title,
-        groupId: group._id,
-        email: user.email,
-      });
-      setSaved(true);
-    } catch (e) {
-      console.log(e);
-      throw new Error("Failed to save note");
-    }
-  };
-
-  const handleSave = async () => {
-    if (save) return;
-    setSave(true);
-    try {
-      await saveNote();
-      await fetchNote();
-    } catch (e) {
-      console.log(e);
-    } finally {
-      console.log("note updated");
-      setSave(false);
-    }
-  };
-
-  const handleClose = () => {
-    setOpen(false);
-  };
-
-  const deleteNote = async () => {
-    setShowConfirm(false);
-    try {
-      await deleteNoteRequest({
-        noteId,
-        groupId: group._id,
-        email: user.email,
-      });
-      refetchGroup();
-      handleClose();
-    } catch (e) {
-      console.log(e);
-    }
-  };
-
-  const handleDelete = () => {
-    setShowConfirm(true);
-  };
-
-  const handleKeyPress = (e) => {
-    if (e.key === "Escape") {
-      handleClose();
-    }
-  };
-
-  if (noteLoading) {
-    return (
-      <div
-        role="button"
-        onClick={handleOpen}
-        onKeyDown={handleKeyPress}
-        tabIndex={0}
-        className={styles.note}
-      >
-        Loading...
-      </div>
-    );
-  }
-
-  if (noteError) {
-    return (
-      <div
-        role="button"
-        onClick={handleOpen}
-        onKeyDown={handleKeyPress}
-        tabIndex={0}
-        className={styles.note}
-      >
-        Error
-      </div>
-    );
-  }
-
-  return (
-    <>
-      <div
-        className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer border-2 border-slate-50 hover:border-slate-300 "
-        onClick={handleOpen}
-        onKeyDown={handleKeyPress}
-      >
-        <div className="card-body p-5">
-          <h2 className="card-title overflow-hidden text-ellipsis text-nowrap">
-            <span className="capitalize">[{role || "-"}]</span>
-            <span className="overflow-hidden text-ellipsis">
-              {noteData?.title || "-"}
-            </span>
-          </h2>
-          <p className="overflow-hidden text-ellipsis">
-            {noteData?.text || "-"}
-          </p>
-          {/* Date time */}
-          <p>
-            Last edit: {date instanceof Date ? date.toLocaleDateString() : "-"}
-          </p>
-        </div>
-      </div>
-
-      {open && (
-        <div>
-          <div className={styles.noteContent}>
-            {isRole && (
-              <input
-                className={styles.titleInput}
-                type="text"
-                value={title}
-                maxLength="50"
-                onChange={(e) => handleTitleInput(e)}
-              />
-            )}
-            {isRole && (
-              <textarea
-                className={styles.inputField}
-                type="text"
-                value={noteContent}
-                onChange={(e) => handleContentInput(e)}
-              />
-            )}
-            {!isRole && <h2>{title}</h2>}
-            {!isRole && <p className={styles.inputField}>{noteContent}</p>}
-            {date instanceof Date ? (
-              <div>
-                <p>Last saved at:</p>
-                <p>{date.toLocaleDateString()}</p>
-                <p>{date.toLocaleTimeString()}</p>
-              </div>
-            ) : (
-              ""
-            )}
-            {updateLoading ? <p>Saving...</p> : ""}
-            {updateError ? <p>Error saving note</p> : ""}
-            {saved && updateResult ? <p>Note saved</p> : ""}
-            {deleteLoading ? <p>Deleting...</p> : ""}
-            {deleteError ? <p>Error deleting note</p> : ""}
-            {deleteResult ? <p>Note deleted</p> : ""}
-            <div>
-              {" "}
-              {isRole && (
-                <button
-                  type="button"
-                  onClick={handleClose}
-                  className={styles.closeButton}
-                >
-                  Close
-                </button>
-              )}
-              {isRole && (
-                <button
-                  type="button"
-                  onClick={handleSave}
-                  className={styles.saveButton}
-                >
-                  Save
-                </button>
-              )}
-              {isRole && (
-                <button
-                  type="button"
-                  onClick={handleDelete}
-                  className={styles.deleteButton}
-                >
-                  Delete
-                </button>
-              )}
-              {!isRole && (
-                <button
-                  type="button"
-                  onClick={handleClose}
-                  className={styles.notRoleCloseButton}
-                >
-                  Close
-                </button>
-              )}
-            </div>
-            {showConfirm && (
-              <div
-                role="button"
-                onKeyDown={handleKeyPress}
-                tabIndex={0}
-                className={styles.overlay}
-                onClick={() => setShowConfirm(false)}
-              >
-                {" "}
-                <div className={styles.conform}>
-                  <p>Are you sure you want to delete this note?</p>
-                  <button
-                    type="button"
-                    onClick={deleteNote}
-                    className={styles.conformButton}
-                  >
-                    Yes
-                  </button>
-                  <button
-                    type="button"
-                    onClick={() => setShowConfirm(false)}
-                    className={styles.rejectButton}
-                  >
-                    No
-                  </button>
-                </div>
-              </div>
-            )}
-          </div>
-        </div>
-      )}
-    </>
-  );
-}
diff --git a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
new file mode 100644
index 00000000..5eb7c585
--- /dev/null
+++ b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
@@ -0,0 +1,281 @@
+import AuthenticationContext from "context/AuthenticationContext";
+import { useAuthDelete, useAuthGet, useAuthPut } from "hooks/crudHooks";
+import { useContext, useEffect, useState } from "react";
+import styles from "./Note.module.scss";
+
+export default function EditPage({ role, noteId, group, refetchGroup }) {
+  const { user } = useContext(AuthenticationContext);
+  const [noteContent, setContent] = useState();
+  const [title, setTitle] = useState();
+  const [date, setDate] = useState();
+  //  lock save process while saving
+  const [save, setSave] = useState(false);
+  //  check if user has same role
+  const [isRole, setRole] = useState(false);
+  //  show delete confirmation
+  const [showConfirm, setShowConfirm] = useState(false);
+  //  is the current version of the note saved
+  const [saved, setSaved] = useState(false);
+  const {
+    response: noteData,
+    loading: noteLoading,
+    error: noteError,
+    getRequest: retrieveNoteRequest,
+  } = useAuthGet(`/api/note/retrieve/${noteId}`);
+
+  const {
+    response: updateResult,
+    loading: updateLoading,
+    error: updateError,
+    putRequest: updateNoteRequest,
+  } = useAuthPut("/api/note/update");
+
+  const {
+    response: deleteResult,
+    loading: deleteLoading,
+    error: deleteError,
+    deleteRequest: deleteNoteRequest,
+  } = useAuthDelete(`/api/note/delete`);
+
+  const getRole = () => {
+    group.users.forEach((userToCheck) => {
+      if (userToCheck.email === user.email) {
+        if (userToCheck.role === role) {
+          setRole(true);
+        }
+      }
+    });
+  };
+
+  const loadNote = async () => {
+    if (noteData) {
+      setContent(noteData.text);
+      setTitle(noteData.title);
+      if (noteData.date) {
+        const dateObject = new Date(noteData.date);
+        setDate(dateObject);
+      }
+    }
+  };
+
+  async function fetchNote() {
+    console.log("fetching note");
+    await retrieveNoteRequest();
+    getRole();
+  }
+
+  useEffect(() => {
+    loadNote();
+  }, [noteData]);
+
+  useEffect(() => {
+    fetchNote();
+  }, []);
+
+  const handleContentInput = (e) => {
+    setSaved(false);
+    setContent(e.target.value);
+  };
+
+  const handleTitleInput = (e) => {
+    setSaved(false);
+    setTitle(e.target.value);
+  };
+
+  const handleOpen = () => {
+    setOpen(true);
+  };
+
+  const saveNote = async () => {
+    try {
+      await updateNoteRequest({
+        noteId,
+        text: noteContent,
+        title,
+        groupId: group._id,
+        email: user.email,
+      });
+      setSaved(true);
+    } catch (e) {
+      console.log(e);
+      throw new Error("Failed to save note");
+    }
+  };
+
+  const handleSave = async () => {
+    if (save) return;
+    setSave(true);
+    try {
+      await saveNote();
+      await fetchNote();
+    } catch (e) {
+      console.log(e);
+    } finally {
+      console.log("note updated");
+      setSave(false);
+    }
+  };
+
+  const handleClose = () => {
+    setOpen(false);
+  };
+
+  const deleteNote = async () => {
+    setShowConfirm(false);
+    try {
+      await deleteNoteRequest({
+        noteId,
+        groupId: group._id,
+        email: user.email,
+      });
+      refetchGroup();
+      handleClose();
+    } catch (e) {
+      console.log(e);
+    }
+  };
+
+  const handleDelete = () => {
+    setShowConfirm(true);
+  };
+
+  const handleKeyPress = (e) => {
+    if (e.key === "Escape") {
+      handleClose();
+    }
+  };
+
+  if (noteLoading) {
+    return (
+      <div
+        role="button"
+        onClick={handleOpen}
+        onKeyDown={handleKeyPress}
+        tabIndex={0}
+        className={styles.note}
+      >
+        Loading...
+      </div>
+    );
+  }
+
+  if (noteError) {
+    return (
+      <div
+        role="button"
+        onClick={handleOpen}
+        onKeyDown={handleKeyPress}
+        tabIndex={0}
+        className={styles.note}
+      >
+        Error
+      </div>
+    );
+  }
+
+  return (
+    <div className={styles.noteContent}>
+      {isRole && (
+        <input
+          className={styles.titleInput}
+          type="text"
+          value={title}
+          maxLength="50"
+          onChange={(e) => handleTitleInput(e)}
+        />
+      )}
+      {isRole && (
+        <textarea
+          className={styles.inputField}
+          type="text"
+          value={noteContent}
+          onChange={(e) => handleContentInput(e)}
+        />
+      )}
+      {!isRole && <h2>{title}</h2>}
+      {!isRole && <p className={styles.inputField}>{noteContent}</p>}
+      {date instanceof Date ? (
+        <div>
+          <p>Last saved at:</p>
+          <p>{date.toLocaleDateString()}</p>
+          <p>{date.toLocaleTimeString()}</p>
+        </div>
+      ) : (
+        ""
+      )}
+      {updateLoading ? <p>Saving...</p> : ""}
+      {updateError ? <p>Error saving note</p> : ""}
+      {saved && updateResult ? <p>Note saved</p> : ""}
+      {deleteLoading ? <p>Deleting...</p> : ""}
+      {deleteError ? <p>Error deleting note</p> : ""}
+      {deleteResult ? <p>Note deleted</p> : ""}
+      <div>
+        {" "}
+        {isRole && (
+          <button
+            type="button"
+            onClick={handleClose}
+            className={styles.closeButton}
+          >
+            Close
+          </button>
+        )}
+        {isRole && (
+          <button
+            type="button"
+            onClick={handleSave}
+            className={styles.saveButton}
+          >
+            Save
+          </button>
+        )}
+        {isRole && (
+          <button
+            type="button"
+            onClick={handleDelete}
+            className={styles.deleteButton}
+          >
+            Delete
+          </button>
+        )}
+        {!isRole && (
+          <button
+            type="button"
+            onClick={handleClose}
+            className={styles.notRoleCloseButton}
+          >
+            Close
+          </button>
+        )}
+      </div>
+      {showConfirm && (
+        <div
+          role="button"
+          onKeyDown={handleKeyPress}
+          tabIndex={0}
+          className={styles.overlay}
+          onClick={() => setShowConfirm(false)}
+        >
+          {" "}
+          <div className={styles.conform}>
+            <p>Are you sure you want to delete this note?</p>
+            <button
+              type="button"
+              onClick={deleteNote}
+              className={styles.conformButton}
+            >
+              Yes
+            </button>
+            <button
+              type="button"
+              onClick={() => setShowConfirm(false)}
+              className={styles.rejectButton}
+            >
+              No
+            </button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/frontend/src/features/playScenario/components/Note/Note.module.scss b/frontend/src/features/playScenario/modals/NotesModal/Note.module.scss
similarity index 100%
rename from frontend/src/features/playScenario/components/Note/Note.module.scss
rename to frontend/src/features/playScenario/modals/NotesModal/Note.module.scss
diff --git a/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx b/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
new file mode 100644
index 00000000..94f98e5e
--- /dev/null
+++ b/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
@@ -0,0 +1,23 @@
+const NoteCard = ({ title, role, text, date }) => {
+  return (
+    <>
+      <div className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer border-2 border-slate-50 hover:border-slate-300 ">
+        <div className="card-body p-5">
+          <h2 className="card-title overflow-hidden text-ellipsis text-nowrap">
+            <span className="capitalize">[{role || "-"}]</span>
+            <span className="overflow-hidden text-ellipsis">
+              {title || "-"}
+            </span>
+          </h2>
+          <p className="overflow-hidden text-ellipsis">{text || "-"}</p>
+          {/* Date time */}
+          <p>
+            Last edit: {date instanceof Date ? date.toLocaleDateString() : "-"}
+          </p>
+        </div>
+      </div>
+    </>
+  );
+};
+
+export default NoteCard;
diff --git a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
index 39cd0938..a710e670 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
@@ -2,12 +2,13 @@ import { useAuthGet, useAuthPost } from "hooks/crudHooks";
 import { useEffect, useState } from "react";
 
 import { Add } from "@material-ui/icons";
-import Note from "../../components/Note/Note";
+import NoteCard from "./NoteCard.jsx";
 import styles from "./NotesModal.module.scss";
 
 export default function NotesModal({ group, user, handleClose }) {
   const [notes, setNotes] = useState([]);
   const [userRole, setRole] = useState(null);
+
   const {
     response: groupData,
     loading: groupLoading,
@@ -77,6 +78,8 @@ export default function NotesModal({ group, user, handleClose }) {
     fetchNotesData();
   };
 
+  console.log(notes);
+
   return (
     <>
       <div>
@@ -88,22 +91,15 @@ export default function NotesModal({ group, user, handleClose }) {
           onKeyDown={handleKeyPress}
           aria-label="Close Card"
         />
-
         <div className={styles.noteCard}>
-          {groupLoading ? <div>Loading...</div> : ""}
-          {groupError ? <div>Error loading notes</div> : ""}
-          {noteCreating ? <div>Creating note...</div> : ""}
-          {createError ? <div>Error creating note</div> : ""}
-          {createResponse ? <div>Note created</div> : ""}
           <div className={styles.notesContainer}>
             {notes.map((note) => (
-              <Note
+              <NoteCard
                 key={note.id}
+                title={note.title}
                 role={note.role}
-                noteId={note.id}
-                group={group}
-                user={user}
-                refetchGroup={fetchNotesData}
+                text={note.text}
+                date={note.date}
               />
             ))}
             <div

From aa3afa54283664b1313006071740a3fc686ea9a6 Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Sun, 20 Oct 2024 19:43:37 +1300
Subject: [PATCH 3/9] fix: change api endpoint to fetch all note info on open

---
 backend/src/db/daos/noteDao.js                | 23 +++++-----------
 backend/src/routes/api/note.js                |  4 +--
 .../modals/NotesModal/NotesModal.jsx          | 27 +++----------------
 3 files changed, 12 insertions(+), 42 deletions(-)

diff --git a/backend/src/db/daos/noteDao.js b/backend/src/db/daos/noteDao.js
index 523d97f4..59c70ec0 100644
--- a/backend/src/db/daos/noteDao.js
+++ b/backend/src/db/daos/noteDao.js
@@ -93,24 +93,13 @@ const updateNote = async (noteId, updatedNote, groupId, email) => {
  * @returns list of database note objects
  */
 //  I know the group is fetched for twice but this is currently not used anywhere
-const retrieveNoteList = async (groupId, email) => {
-  const dbGroup = await Group.findById(groupId);
-  const role = await checkRole(groupId, email);
-  //  if user is not in group return null
-  if (role === null) {
-    return null;
-  }
-  const allNotes = [];
-  const noteIds = [...dbGroup.notes.values()].flat();
-  const dbNotes = await Note.find({ _id: { $in: noteIds } }, [
-    "title",
-    "role",
-    "date",
-    "text",
-  ]);
+const retrieveNoteList = async (groupId) => {
+  const { notes } = await Group.findById(groupId, { notes: 1 }).lean();
+
+  const noteIds = Object.values(notes).flat();
+  const dbNotes = await Note.find({ _id: { $in: noteIds } }, { __v: 0 });
 
-  allNotes.push(...dbNotes);
-  return allNotes;
+  return dbNotes;
 };
 
 /**
diff --git a/backend/src/routes/api/note.js b/backend/src/routes/api/note.js
index d975d55b..44451044 100644
--- a/backend/src/routes/api/note.js
+++ b/backend/src/routes/api/note.js
@@ -16,9 +16,9 @@ const HTTP_OK = 200;
 router.use(auth);
 
 // Retrieve note list
-router.get("/retrieveList/:groupId", async (req, res) => {
+router.get("/retrieveAll/:groupId", async (req, res) => {
   const { groupId } = req.params;
-  const notes = retrieveNoteList(groupId);
+  const notes = await retrieveNoteList(groupId);
   res.status(HTTP_OK).json(notes);
 });
 
diff --git a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
index a710e670..d0b9d42a 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
@@ -13,8 +13,8 @@ export default function NotesModal({ group, user, handleClose }) {
     response: groupData,
     loading: groupLoading,
     error: groupError,
-    getRequest: retrieveGroupRequest,
-  } = useAuthGet(`/api/group/retrieve/${group._id}`);
+    getRequest: retrieveNotes,
+  } = useAuthGet(`/api/note/retrieveAll/${group._id}`, setNotes);
 
   const {
     response: createResponse,
@@ -23,25 +23,6 @@ export default function NotesModal({ group, user, handleClose }) {
     postRequest: createNoteRequest,
   } = useAuthPost("/api/note/");
 
-  async function loadNotes() {
-    if (!groupData) {
-      return;
-    }
-    const noteList = Object.entries(groupData.notes).flatMap(([role, ids]) =>
-      ids.map((id) => ({ role, id }))
-    );
-    setNotes(noteList);
-  }
-
-  useEffect(() => {
-    loadNotes();
-  }, [groupData]);
-
-  // refetch group data to get updated notes
-  async function fetchNotesData() {
-    await retrieveGroupRequest();
-  }
-
   useEffect(() => {
     // Check roles
     group.users.forEach((userToCheck) => {
@@ -50,7 +31,7 @@ export default function NotesModal({ group, user, handleClose }) {
       }
     });
 
-    fetchNotesData();
+    retrieveNotes();
   }, []);
 
   const handleKeyPress = (e) => {
@@ -75,7 +56,7 @@ export default function NotesModal({ group, user, handleClose }) {
       title: "New Note",
       email: user.email,
     });
-    fetchNotesData();
+    retrieveNotes();
   };
 
   console.log(notes);

From f4d59d032480b61a1187bd235e9dac936a808ba6 Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Sun, 20 Oct 2024 21:29:38 +1300
Subject: [PATCH 4/9] feat: add back switching to note edit page

---
 .../modals/NotesModal/EditPage.jsx            |  2 +-
 .../modals/NotesModal/NoteCard.jsx            | 33 ++++----
 .../modals/NotesModal/NotesModal.jsx          | 83 +++++--------------
 .../modals/NotesModal/ViewPage.jsx            | 65 +++++++++++++++
 4 files changed, 102 insertions(+), 81 deletions(-)
 create mode 100644 frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx

diff --git a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
index 5eb7c585..9a030493 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
@@ -174,7 +174,7 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
   }
 
   return (
-    <div className={styles.noteContent}>
+    <div>
       {isRole && (
         <input
           className={styles.titleInput}
diff --git a/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx b/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
index 94f98e5e..8778f04f 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
@@ -1,22 +1,21 @@
-const NoteCard = ({ title, role, text, date }) => {
+const NoteCard = ({ title, role, text, date, onClick }) => {
   return (
-    <>
-      <div className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer border-2 border-slate-50 hover:border-slate-300 ">
-        <div className="card-body p-5">
-          <h2 className="card-title overflow-hidden text-ellipsis text-nowrap">
-            <span className="capitalize">[{role || "-"}]</span>
-            <span className="overflow-hidden text-ellipsis">
-              {title || "-"}
-            </span>
-          </h2>
-          <p className="overflow-hidden text-ellipsis">{text || "-"}</p>
-          {/* Date time */}
-          <p>
-            Last edit: {date instanceof Date ? date.toLocaleDateString() : "-"}
-          </p>
-        </div>
+    <div
+      className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer border-2 border-slate-50 hover:border-slate-300 "
+      onClick={onClick}
+    >
+      <div className="card-body p-5">
+        <h2 className="card-title overflow-hidden text-ellipsis text-nowrap">
+          <span className="capitalize">[{role || "-"}]</span>
+          <span className="overflow-hidden text-ellipsis">{title || "-"}</span>
+        </h2>
+        <p className="overflow-hidden text-ellipsis">{text || "-"}</p>
+        {/* Date time */}
+        <p>
+          {`Last edit: ${date ? new Date(date).toLocaleDateString() : "-"}`}
+        </p>
       </div>
-    </>
+    </div>
   );
 };
 
diff --git a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
index d0b9d42a..fe0a9b45 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
@@ -1,66 +1,31 @@
 import { useAuthGet, useAuthPost } from "hooks/crudHooks";
 import { useEffect, useState } from "react";
 
-import { Add } from "@material-ui/icons";
-import NoteCard from "./NoteCard.jsx";
 import styles from "./NotesModal.module.scss";
+import ViewPage from "./ViewPage.jsx";
+import EditPage from "./EditPage";
 
 export default function NotesModal({ group, user, handleClose }) {
-  const [notes, setNotes] = useState([]);
-  const [userRole, setRole] = useState(null);
+  const [content, setContent] = useState("");
+  const [role, setRole] = useState(null);
 
-  const {
-    response: groupData,
-    loading: groupLoading,
-    error: groupError,
-    getRequest: retrieveNotes,
-  } = useAuthGet(`/api/note/retrieveAll/${group._id}`, setNotes);
+  const handleKeyPress = (e) => {
+    if (e.key === "Escape") handleClose();
+  };
 
-  const {
-    response: createResponse,
-    loading: noteCreating,
-    error: createError,
-    postRequest: createNoteRequest,
-  } = useAuthPost("/api/note/");
+  useEffect(() => {
+    document.addEventListener("keydown", handleKeyPress);
+    return () => document.removeEventListener("keydown", handleKeyPress);
+  }, []);
 
   useEffect(() => {
-    // Check roles
     group.users.forEach((userToCheck) => {
       if (userToCheck.email === user.email) {
         setRole(userToCheck.role);
       }
     });
-
-    retrieveNotes();
   }, []);
 
-  const handleKeyPress = (e) => {
-    if (e.key === "Escape") {
-      handleClose();
-    }
-  };
-
-  useEffect(() => {
-    document.addEventListener("keydown", handleKeyPress);
-    return () => {
-      document.removeEventListener("keydown", handleKeyPress);
-    };
-  }, []);
-
-  const handleCreate = async () => {
-    if (!userRole) {
-      return;
-    }
-    await createNoteRequest({
-      groupId: group._id,
-      title: "New Note",
-      email: user.email,
-    });
-    retrieveNotes();
-  };
-
-  console.log(notes);
-
   return (
     <>
       <div>
@@ -74,24 +39,16 @@ export default function NotesModal({ group, user, handleClose }) {
         />
         <div className={styles.noteCard}>
           <div className={styles.notesContainer}>
-            {notes.map((note) => (
-              <NoteCard
-                key={note.id}
-                title={note.title}
-                role={note.role}
-                text={note.text}
-                date={note.date}
+            {!content ? (
+              <ViewPage
+                group={group}
+                user={user}
+                role={role}
+                setContent={setContent}
               />
-            ))}
-            <div
-              className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer hover:border-2 border-slate-300"
-              onClick={handleCreate}
-              onKeyDown={handleKeyPress}
-            >
-              <div className="card-body flex justify-center items-center text-slate-500">
-                <Add fontSize="large" />
-              </div>
-            </div>
+            ) : (
+              <EditPage noteId={content} group={group} role={role} />
+            )}
           </div>
         </div>
       </div>
diff --git a/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
new file mode 100644
index 00000000..476d8bcc
--- /dev/null
+++ b/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
@@ -0,0 +1,65 @@
+import { useAuthGet, useAuthPost } from "hooks/crudHooks";
+import { useEffect, useState } from "react";
+
+import { Add } from "@material-ui/icons";
+import NoteCard from "./NoteCard.jsx";
+import styles from "./NotesModal.module.scss";
+
+export default function ViewPage({ group, user, role, setContent }) {
+  const [notes, setNotes] = useState([]);
+
+  const {
+    response: groupData,
+    loading: groupLoading,
+    error: groupError,
+    getRequest: retrieveNotes,
+  } = useAuthGet(`/api/note/retrieveAll/${group._id}`, setNotes);
+
+  const {
+    response: createResponse,
+    loading: noteCreating,
+    error: createError,
+    postRequest: createNoteRequest,
+  } = useAuthPost("/api/note/");
+
+  useEffect(() => {
+    retrieveNotes();
+  }, []);
+
+  const handleCreate = async () => {
+    if (!role) return;
+
+    await createNoteRequest({
+      groupId: group._id,
+      title: "New Note",
+      email: user.email,
+    });
+
+    retrieveNotes();
+  };
+
+  return (
+    <div className={styles.notesContainer}>
+      {notes.map(
+        (note) => (
+          console.log(note),
+          (
+            <NoteCard
+              key={note.id}
+              {...note}
+              onClick={() => setContent(note._id)}
+            />
+          )
+        )
+      )}
+      <div
+        className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer hover:border-2 border-slate-300"
+        onClick={handleCreate}
+      >
+        <div className="card-body flex justify-center items-center text-slate-500">
+          <Add fontSize="large" />
+        </div>
+      </div>
+    </div>
+  );
+}

From 9dd2901b6ba3cad439a943e1319977d81cd2ff32 Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Mon, 21 Oct 2024 02:26:56 +1300
Subject: [PATCH 5/9] feat: apply styling and fix layout

---
 .../modals/NotesModal/EditPage.jsx            | 179 ++++++------------
 .../modals/NotesModal/NotesModal.jsx          |  11 +-
 .../modals/NotesModal/NotesModal.module.scss  |   2 +-
 .../modals/NotesModal/ViewPage.jsx            |  53 +++---
 4 files changed, 97 insertions(+), 148 deletions(-)

diff --git a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
index 9a030493..3fdcfaff 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
@@ -1,9 +1,11 @@
 import AuthenticationContext from "context/AuthenticationContext";
 import { useAuthDelete, useAuthGet, useAuthPut } from "hooks/crudHooks";
 import { useContext, useEffect, useState } from "react";
+import CloseIcon from "@mui/icons-material/Close";
+import ArrowBackIcon from "@mui/icons-material/ArrowBack";
 import styles from "./Note.module.scss";
 
-export default function EditPage({ role, noteId, group, refetchGroup }) {
+export default function EditPage({ role, noteId, group, goBack, handleClose }) {
   const { user } = useContext(AuthenticationContext);
   const [noteContent, setContent] = useState();
   const [title, setTitle] = useState();
@@ -37,16 +39,6 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
     deleteRequest: deleteNoteRequest,
   } = useAuthDelete(`/api/note/delete`);
 
-  const getRole = () => {
-    group.users.forEach((userToCheck) => {
-      if (userToCheck.email === user.email) {
-        if (userToCheck.role === role) {
-          setRole(true);
-        }
-      }
-    });
-  };
-
   const loadNote = async () => {
     if (noteData) {
       setContent(noteData.text);
@@ -55,13 +47,14 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
         const dateObject = new Date(noteData.date);
         setDate(dateObject);
       }
+      if (noteData.role === role) {
+        setRole(true);
+      }
     }
   };
 
   async function fetchNote() {
-    console.log("fetching note");
     await retrieveNoteRequest();
-    getRole();
   }
 
   useEffect(() => {
@@ -82,10 +75,6 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
     setTitle(e.target.value);
   };
 
-  const handleOpen = () => {
-    setOpen(true);
-  };
-
   const saveNote = async () => {
     try {
       await updateNoteRequest({
@@ -116,10 +105,6 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
     }
   };
 
-  const handleClose = () => {
-    setOpen(false);
-  };
-
   const deleteNote = async () => {
     setShowConfirm(false);
     try {
@@ -128,7 +113,6 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
         groupId: group._id,
         email: user.email,
       });
-      refetchGroup();
       handleClose();
     } catch (e) {
       console.log(e);
@@ -139,119 +123,68 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
     setShowConfirm(true);
   };
 
-  const handleKeyPress = (e) => {
-    if (e.key === "Escape") {
-      handleClose();
-    }
-  };
-
-  if (noteLoading) {
-    return (
-      <div
-        role="button"
-        onClick={handleOpen}
-        onKeyDown={handleKeyPress}
-        tabIndex={0}
-        className={styles.note}
-      >
-        Loading...
-      </div>
-    );
-  }
-
-  if (noteError) {
-    return (
-      <div
-        role="button"
-        onClick={handleOpen}
-        onKeyDown={handleKeyPress}
-        tabIndex={0}
-        className={styles.note}
-      >
-        Error
-      </div>
-    );
-  }
-
   return (
-    <div>
-      {isRole && (
+    <>
+      <div className="flex w-full justify-between gap-10">
         <input
-          className={styles.titleInput}
+          className="text-2xl font-semibold grow bg-slate-50 p-2 rounded-md border-slate-300 border-2"
           type="text"
           value={title}
           maxLength="50"
-          onChange={(e) => handleTitleInput(e)}
-        />
-      )}
-      {isRole && (
-        <textarea
-          className={styles.inputField}
-          type="text"
-          value={noteContent}
-          onChange={(e) => handleContentInput(e)}
+          onChange={handleTitleInput}
+          disabled={!isRole}
         />
-      )}
-      {!isRole && <h2>{title}</h2>}
-      {!isRole && <p className={styles.inputField}>{noteContent}</p>}
-      {date instanceof Date ? (
-        <div>
-          <p>Last saved at:</p>
-          <p>{date.toLocaleDateString()}</p>
-          <p>{date.toLocaleTimeString()}</p>
-        </div>
-      ) : (
-        ""
-      )}
-      {updateLoading ? <p>Saving...</p> : ""}
-      {updateError ? <p>Error saving note</p> : ""}
-      {saved && updateResult ? <p>Note saved</p> : ""}
-      {deleteLoading ? <p>Deleting...</p> : ""}
-      {deleteError ? <p>Error deleting note</p> : ""}
-      {deleteResult ? <p>Note deleted</p> : ""}
-      <div>
-        {" "}
-        {isRole && (
-          <button
-            type="button"
-            onClick={handleClose}
-            className={styles.closeButton}
-          >
-            Close
-          </button>
-        )}
-        {isRole && (
-          <button
-            type="button"
-            onClick={handleSave}
-            className={styles.saveButton}
-          >
-            Save
-          </button>
+        <button type="button" onClick={goBack}>
+          <ArrowBackIcon />
+        </button>
+        <button type="button" onClick={handleClose}>
+          <CloseIcon />
+        </button>
+      </div>
+      <textarea
+        className="w-full grow bg-slate-50 p-2 rounded-md border-slate-300 border-2"
+        type="text"
+        value={noteContent}
+        onChange={(e) => handleContentInput(e)}
+        disabled={!isRole}
+      />
+      <div className="flex flex-row justify-between">
+        {date ? (
+          <p>
+            {`Last edit: ${date.toLocaleDateString()} at ${date.toLocaleTimeString(
+              [],
+              {
+                hour: "2-digit",
+                minute: "2-digit",
+              }
+            )}`}
+            {}
+          </p>
+        ) : (
+          ""
         )}
         {isRole && (
-          <button
-            type="button"
-            onClick={handleDelete}
-            className={styles.deleteButton}
-          >
-            Delete
-          </button>
-        )}
-        {!isRole && (
-          <button
-            type="button"
-            onClick={handleClose}
-            className={styles.notRoleCloseButton}
-          >
-            Close
-          </button>
+          <div className="flex gap-10 grow flex-row-reverse">
+            <button
+              type="button"
+              onClick={handleSave}
+              className="btn vps w-[100px]"
+            >
+              Save
+            </button>
+            <button
+              type="button"
+              onClick={handleDelete}
+              className="btn vps important w-[100px]"
+            >
+              Delete
+            </button>
+          </div>
         )}
       </div>
       {showConfirm && (
         <div
           role="button"
-          onKeyDown={handleKeyPress}
           tabIndex={0}
           className={styles.overlay}
           onClick={() => setShowConfirm(false)}
@@ -276,6 +209,6 @@ export default function EditPage({ role, noteId, group, refetchGroup }) {
           </div>
         </div>
       )}
-    </div>
+    </>
   );
 }
diff --git a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
index fe0a9b45..44df2b1d 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.jsx
@@ -38,16 +38,23 @@ export default function NotesModal({ group, user, handleClose }) {
           aria-label="Close Card"
         />
         <div className={styles.noteCard}>
-          <div className={styles.notesContainer}>
+          <div className="flex flex-col gap-5 w-full">
             {!content ? (
               <ViewPage
                 group={group}
                 user={user}
                 role={role}
                 setContent={setContent}
+                handleClose={handleClose}
               />
             ) : (
-              <EditPage noteId={content} group={group} role={role} />
+              <EditPage
+                noteId={content}
+                group={group}
+                role={role}
+                goBack={() => setContent("")}
+                handleClose={handleClose}
+              />
             )}
           </div>
         </div>
diff --git a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.module.scss b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.module.scss
index ff18acc8..f22e1491 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/NotesModal.module.scss
+++ b/frontend/src/features/playScenario/modals/NotesModal/NotesModal.module.scss
@@ -8,7 +8,7 @@
   justify-content: left;
   background-color: rgb(255, 255, 255);
   border: 5px solid #515151;
-  padding: 20px;
+  padding: 40px;
   border-radius: 13px;
   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
   visibility: "visible";
diff --git a/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
index 476d8bcc..4e667e17 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
@@ -3,9 +3,15 @@ import { useEffect, useState } from "react";
 
 import { Add } from "@material-ui/icons";
 import NoteCard from "./NoteCard.jsx";
-import styles from "./NotesModal.module.scss";
+import CloseIcon from "@mui/icons-material/Close";
 
-export default function ViewPage({ group, user, role, setContent }) {
+export default function ViewPage({
+  group,
+  user,
+  role,
+  setContent,
+  handleClose,
+}) {
   const [notes, setNotes] = useState([]);
 
   const {
@@ -39,27 +45,30 @@ export default function ViewPage({ group, user, role, setContent }) {
   };
 
   return (
-    <div className={styles.notesContainer}>
-      {notes.map(
-        (note) => (
-          console.log(note),
-          (
-            <NoteCard
-              key={note.id}
-              {...note}
-              onClick={() => setContent(note._id)}
-            />
-          )
-        )
-      )}
-      <div
-        className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer hover:border-2 border-slate-300"
-        onClick={handleCreate}
-      >
-        <div className="card-body flex justify-center items-center text-slate-500">
-          <Add fontSize="large" />
+    <>
+      <div className="flex w-full justify-between">
+        <h2 className="text-2xl font-semibold">Notes</h2>
+        <button type="button" onClick={handleClose}>
+          <CloseIcon />
+        </button>
+      </div>
+      <div className="flex flex-wrap gap-10 h-fit">
+        {notes.map((note) => (
+          <NoteCard
+            key={note.id}
+            {...note}
+            onClick={() => setContent(note._id)}
+          />
+        ))}
+        <div
+          className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer hover:border-2 border-slate-300"
+          onClick={handleCreate}
+        >
+          <div className="card-body flex justify-center items-center text-slate-500">
+            <Add fontSize="large" />
+          </div>
         </div>
       </div>
-    </div>
+    </>
   );
 }

From cb091a60531be0c8ade981d99677127e4e862460 Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Mon, 21 Oct 2024 14:01:05 +1300
Subject: [PATCH 6/9] fix: remove default outline on input elements

---
 .../src/features/playScenario/modals/NotesModal/EditPage.jsx  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
index 3fdcfaff..7f7e0134 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
@@ -127,7 +127,7 @@ export default function EditPage({ role, noteId, group, goBack, handleClose }) {
     <>
       <div className="flex w-full justify-between gap-10">
         <input
-          className="text-2xl font-semibold grow bg-slate-50 p-2 rounded-md border-slate-300 border-2"
+          className="text-2xl font-semibold grow bg-slate-50 p-2 rounded-md outline-none border-slate-150 border-2 focus:border-slate-300"
           type="text"
           value={title}
           maxLength="50"
@@ -142,7 +142,7 @@ export default function EditPage({ role, noteId, group, goBack, handleClose }) {
         </button>
       </div>
       <textarea
-        className="w-full grow bg-slate-50 p-2 rounded-md border-slate-300 border-2"
+        className="w-full grow bg-slate-50 p-2 rounded-md outline-none border-slate-150 border-2 focus:border-slate-300"
         type="text"
         value={noteContent}
         onChange={(e) => handleContentInput(e)}

From 860f04776bef92bb62c7760e0103e1e1dafd62ea Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Mon, 21 Oct 2024 14:01:46 +1300
Subject: [PATCH 7/9] style: shrink shadow on note cards

---
 .../src/features/playScenario/modals/NotesModal/NoteCard.jsx    | 2 +-
 .../src/features/playScenario/modals/NotesModal/ViewPage.jsx    | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx b/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
index 8778f04f..426e1fcd 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/NoteCard.jsx
@@ -1,7 +1,7 @@
 const NoteCard = ({ title, role, text, date, onClick }) => {
   return (
     <div
-      className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer border-2 border-slate-50 hover:border-slate-300 "
+      className="card bg-slate-50 w-60 h-40 shadow-md cursor-pointer border-2 border-slate-50 hover:border-slate-300 "
       onClick={onClick}
     >
       <div className="card-body p-5">
diff --git a/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
index 4e667e17..045da9fb 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/ViewPage.jsx
@@ -61,7 +61,7 @@ export default function ViewPage({
           />
         ))}
         <div
-          className="card bg-slate-50 w-60 h-40 shadow-xl cursor-pointer hover:border-2 border-slate-300"
+          className="card bg-slate-50 w-60 h-40 shadow-md cursor-pointer hover:border-2 border-slate-300"
           onClick={handleCreate}
         >
           <div className="card-body flex justify-center items-center text-slate-500">

From 412a9d0eedc86aea9f1d1fef4cf030160df79f1e Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Mon, 21 Oct 2024 14:06:06 +1300
Subject: [PATCH 8/9] fix: add note date on creation

---
 backend/src/db/daos/noteDao.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/backend/src/db/daos/noteDao.js b/backend/src/db/daos/noteDao.js
index 59c70ec0..98260813 100644
--- a/backend/src/db/daos/noteDao.js
+++ b/backend/src/db/daos/noteDao.js
@@ -32,7 +32,7 @@ const createNote = async (groupId, title, email, text = "") => {
   if (role === null) {
     return null;
   }
-  const dbNote = new Note({ title, role, text });
+  const dbNote = new Note({ title, role, text, date: new Date() });
   await dbNote.save();
   const updateQuery = {};
   updateQuery[`notes.${role}`] = dbNote.id;

From e5d544a6af062e180fc24bfd82a5c5a58380f885 Mon Sep 17 00:00:00 2001
From: harbassan <harbassan@hotmail.com>
Date: Mon, 21 Oct 2024 14:06:22 +1300
Subject: [PATCH 9/9] fix: go back to view page on note delete

---
 .../src/features/playScenario/modals/NotesModal/EditPage.jsx    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
index 7f7e0134..1fe4ff71 100644
--- a/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
+++ b/frontend/src/features/playScenario/modals/NotesModal/EditPage.jsx
@@ -113,7 +113,7 @@ export default function EditPage({ role, noteId, group, goBack, handleClose }) {
         groupId: group._id,
         email: user.email,
       });
-      handleClose();
+      goBack();
     } catch (e) {
       console.log(e);
     }