From 2ab2d950fd6c00019926a7c54d6e709afef7b3ef Mon Sep 17 00:00:00 2001
From: timmi <timmid999@gmail.com>
Date: Tue, 1 Apr 2025 23:58:32 -0700
Subject: [PATCH 1/4] Changed login colour to match header. Added notification
 icon.

---
 frontend/react-app/src/components/Header.jsx | 5 +++--
 frontend/react-app/src/login.css             | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/frontend/react-app/src/components/Header.jsx b/frontend/react-app/src/components/Header.jsx
index e3dbc6f..d1974fe 100644
--- a/frontend/react-app/src/components/Header.jsx
+++ b/frontend/react-app/src/components/Header.jsx
@@ -1,5 +1,5 @@
 import { useCookies } from 'react-cookie'
-import { Home, UserCircle, ListChecks, ShieldUser, LogOut } from "lucide-react";
+import { Home, UserCircle, ListChecks, ShieldUser, LogOut, Bell } from "lucide-react";
 
 function Header(){
     const [cookies, removeCookie] = useCookies(['userInfo'])
@@ -18,7 +18,8 @@ function Header(){
 
                 <ul className ='icon-nav'>
                     <li><a href="/home" title="Home"><Home/></a></li>
-                    <li><a href="/my-tasks" title="My Tasks"><ListChecks/></a></li>
+                    <li><a href="/my-tasks" title="My Tasks"><ListChecks /></a></li>
+                    <li><a href="/notifications" title="Notifications"><Bell /></a></li>
                     <li><a href="/profile" title="Profile"><UserCircle/></a></li>
 
                     {cookies.userInfo.role === 'admin' && (
diff --git a/frontend/react-app/src/login.css b/frontend/react-app/src/login.css
index 3d4aae2..60db239 100644
--- a/frontend/react-app/src/login.css
+++ b/frontend/react-app/src/login.css
@@ -40,7 +40,7 @@
     height: 100%;
     width: 100%;
     /* background-color: #5f577a; */
-    background-color: #1f6e76;
+    background-color: #3B3355;
 }
 
 #loginForm {

From 9efa26aff1fece6c1f594efbb5ed83ea847fdea2 Mon Sep 17 00:00:00 2001
From: timmi <timmid999@gmail.com>
Date: Wed, 2 Apr 2025 00:17:48 -0700
Subject: [PATCH 2/4] Added header to notification page

---
 .../react-app/src/pages/Notifications.jsx     | 28 +++++++++++--------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/frontend/react-app/src/pages/Notifications.jsx b/frontend/react-app/src/pages/Notifications.jsx
index 2a3a16b..c35d0c0 100644
--- a/frontend/react-app/src/pages/Notifications.jsx
+++ b/frontend/react-app/src/pages/Notifications.jsx
@@ -1,6 +1,7 @@
 import React, { useState } from 'react';
 import '../css/Notifications.css';
 import Notification from "../components/Notification";
+import Header from "../components/Header";
 
 const Notifications = () => {
     const [notifications, setNotifications] = useState([
@@ -43,18 +44,21 @@ const Notifications = () => {
     );
 
     return (
-        <div id="notifContainer">
-            <table>
-                <thead>
-                    <tr>
-                        <td colSpan="4">Notifications</td>
-                    </tr>
-                </thead>
-                <tbody>
-                    <NotificationSection title="Unread" items={unreadNotifications} />
-                    <NotificationSection title="Read" items={readNotifications} />
-                </tbody>
-            </table>
+        <div>
+            <Header/>
+                <div id="notifContainer">
+                    <table>
+                        <thead>
+                            <tr>
+                                <td colSpan="4">Notifications</td>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <NotificationSection title="Unread" items={unreadNotifications} />
+                            <NotificationSection title="Read" items={readNotifications} />
+                        </tbody>
+                    </table>
+            </div>
         </div>
     );
 };

From ee811b5e8584e4c54cf906453a45c653e3e74aca Mon Sep 17 00:00:00 2001
From: timmi <timmid999@gmail.com>
Date: Wed, 2 Apr 2025 00:31:31 -0700
Subject: [PATCH 3/4] Fixing ReactCI failure.

---
 .../react-app/src/pages/Notifications.jsx     | 26 +++++++++----------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/frontend/react-app/src/pages/Notifications.jsx b/frontend/react-app/src/pages/Notifications.jsx
index c35d0c0..d93c0a8 100644
--- a/frontend/react-app/src/pages/Notifications.jsx
+++ b/frontend/react-app/src/pages/Notifications.jsx
@@ -44,20 +44,20 @@ const Notifications = () => {
     );
 
     return (
-        <div>
+        <div className="pageContainer">
             <Header/>
-                <div id="notifContainer">
-                    <table>
-                        <thead>
-                            <tr>
-                                <td colSpan="4">Notifications</td>
-                            </tr>
-                        </thead>
-                        <tbody>
-                            <NotificationSection title="Unread" items={unreadNotifications} />
-                            <NotificationSection title="Read" items={readNotifications} />
-                        </tbody>
-                    </table>
+            <div id="notifContainer">
+                <table>
+                    <thead>
+                        <tr>
+                            <td colSpan="4">Notifications</td>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <NotificationSection title="Unread" items={unreadNotifications} />
+                        <NotificationSection title="Read" items={readNotifications} />
+                    </tbody>
+                </table>
             </div>
         </div>
     );

From 1a2a695c5351c7a9e38c51742cca283725e0437d Mon Sep 17 00:00:00 2001
From: timmi <timmid999@gmail.com>
Date: Wed, 2 Apr 2025 00:40:47 -0700
Subject: [PATCH 4/4] Fixing ReactCI 2

---
 frontend/react-app/src/tests/Notifications.test.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/react-app/src/tests/Notifications.test.js b/frontend/react-app/src/tests/Notifications.test.js
index deeb908..0204261 100644
--- a/frontend/react-app/src/tests/Notifications.test.js
+++ b/frontend/react-app/src/tests/Notifications.test.js
@@ -1,6 +1,7 @@
 import React from "react";
 import { render, screen, fireEvent } from "@testing-library/react";
 import Notifications from "../pages/Notifications";
+jest.mock("../components/Header", () => () => <div data-testid="mock-header" />);
 
 jest.mock("../components/Notification", () => ({ notif, toggleRead }) => (
     <tr>