From 04c3d519963a4ae4d4f35824c336b6cd885c0d16 Mon Sep 17 00:00:00 2001
From: Christopher Evangelista <cevangdpt@gmail.com>
Date: Tue, 10 Jun 2025 14:22:22 -0400
Subject: [PATCH 1/2] Added title and aria-label attributes to
 CalendarHeader.jsx

---
 .../features/calendarHeader/CalendarHeader.jsx  | 17 ++++++++++++++++-
 1 file changed, 16 insertions(+), 1 deletion(-)

diff --git a/client/src/features/calendarHeader/CalendarHeader.jsx b/client/src/features/calendarHeader/CalendarHeader.jsx
index ee88dc14..d2a87271 100644
--- a/client/src/features/calendarHeader/CalendarHeader.jsx
+++ b/client/src/features/calendarHeader/CalendarHeader.jsx
@@ -28,7 +28,6 @@ function CalendarHeader({ date }) {
   const handleLogin = () => {
     window.location = "api/auth/discord";
   };
-
   return (
     <header className="flex items-center max-[440px]:px-2 px-5 py-3 bg-white lg:justify-between w-full justify-center lg:flex-nowrap flex-wrap  max-[440px]:gap-x-2 gap-x-6 lg:gap-x-4 overflow-hidden">
       <section className="flex max-[440px]:gap-x-2 gap-x-6 lg:gap-x-4">
@@ -36,17 +35,23 @@ function CalendarHeader({ date }) {
           Icon={BsCalendarPlusFill}
           tooltipText="Add Event"
           onClick={formModal.handleOpen}
+          title="Add Event"
+          aria-label="Add Event"
         />
 
         <HeaderButton
           Icon={MdGroupAdd}
           tooltipText="Join Team"
           onClick={() => linkToUrl(DISCORD_THREAD_URL)}
+          title="Join Team"
+          aria-label="Join Team"
         />
         <HeaderButton
           Icon={FaHome}
           tooltipText={"Home"}
           onClick={() => navigate("/")}
+          title="Home"
+          aria-label="Home"
         />
       </section>
       <section className="flex items-center w-full order-first lg:w-min lg:space-x-3 lg:order-0 justify-between mb-4 lg:mb-0">
@@ -61,6 +66,8 @@ function CalendarHeader({ date }) {
           text={"Today"}
           tooltipText={"Jump to current month"}
           onClick={() => date.getCurrentMonth()}
+          title="Today"
+          aria-label="Today"
         />
       </section>
       <section className="flex max-[440px]:gap-x-2 gap-x-6 lg:gap-x-4">
@@ -68,23 +75,31 @@ function CalendarHeader({ date }) {
           Icon={IoChatbubblesOutline}
           tooltipText="Feedback"
           onClick={() => linkToUrl(GH_ISSUES_URL)}
+          title="Feedback"
+          aria-label="Feedback"
         />
         <HeaderButton
           Icon={FaQuestion}
           tooltipText="Help"
           onClick={() => linkToUrl(GH_ISSUES_URL)}
+          title="Help"
+          aria-label="Help"
         />
         {isAuthenticated() ? (
           <HeaderButton
             Icon={RiArrowLeftCircleFill}
             tooltipText="Logout"
             onClick={logout}
+            title="Logout"
+            aria-label="Logout"
           />
         ) : (
           <HeaderButton
             Icon={RiArrowRightCircleFill}
             tooltipText="Login"
             onClick={handleLogin}
+            title="Login"
+            aria-label="Login"
           />
         )}
       </section>

From f8cbac0240e5f2819f24bb72b98cf3b77ec79072 Mon Sep 17 00:00:00 2001
From: Christopher Evangelista <cevangdpt@gmail.com>
Date: Thu, 21 Aug 2025 10:44:14 -0400
Subject: [PATCH 2/2] Add aria-label and title to /calendar buttons so
 description hovers when user hovers on button

---
 .../features/calendarHeader/CalendarHeader.jsx   | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/client/src/features/calendarHeader/CalendarHeader.jsx b/client/src/features/calendarHeader/CalendarHeader.jsx
index d2a87271..10bf879d 100644
--- a/client/src/features/calendarHeader/CalendarHeader.jsx
+++ b/client/src/features/calendarHeader/CalendarHeader.jsx
@@ -35,23 +35,23 @@ function CalendarHeader({ date }) {
           Icon={BsCalendarPlusFill}
           tooltipText="Add Event"
           onClick={formModal.handleOpen}
-          title="Add Event"
           aria-label="Add Event"
+          title="Add Event"
         />
 
         <HeaderButton
           Icon={MdGroupAdd}
           tooltipText="Join Team"
           onClick={() => linkToUrl(DISCORD_THREAD_URL)}
-          title="Join Team"
           aria-label="Join Team"
+          title="Join Team"
         />
         <HeaderButton
           Icon={FaHome}
           tooltipText={"Home"}
           onClick={() => navigate("/")}
-          title="Home"
           aria-label="Home"
+          title="Home"
         />
       </section>
       <section className="flex items-center w-full order-first lg:w-min lg:space-x-3 lg:order-0 justify-between mb-4 lg:mb-0">
@@ -66,8 +66,8 @@ function CalendarHeader({ date }) {
           text={"Today"}
           tooltipText={"Jump to current month"}
           onClick={() => date.getCurrentMonth()}
-          title="Today"
           aria-label="Today"
+          title="Today"
         />
       </section>
       <section className="flex max-[440px]:gap-x-2 gap-x-6 lg:gap-x-4">
@@ -75,31 +75,31 @@ function CalendarHeader({ date }) {
           Icon={IoChatbubblesOutline}
           tooltipText="Feedback"
           onClick={() => linkToUrl(GH_ISSUES_URL)}
-          title="Feedback"
           aria-label="Feedback"
+          title="Feedback"
         />
         <HeaderButton
           Icon={FaQuestion}
           tooltipText="Help"
           onClick={() => linkToUrl(GH_ISSUES_URL)}
-          title="Help"
           aria-label="Help"
+          title="Help"
         />
         {isAuthenticated() ? (
           <HeaderButton
             Icon={RiArrowLeftCircleFill}
             tooltipText="Logout"
             onClick={logout}
-            title="Logout"
             aria-label="Logout"
+            title="Logout"
           />
         ) : (
           <HeaderButton
             Icon={RiArrowRightCircleFill}
             tooltipText="Login"
             onClick={handleLogin}
-            title="Login"
             aria-label="Login"
+            title="Login"
           />
         )}
       </section>