From 2072b27e6fbd60e61024bed53b89e9777b83c32c Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Tue, 17 Sep 2024 16:14:01 -0400
Subject: [PATCH] refactor: update sidebar labels

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/components/Sidebar.test.tsx               | 26 +++++-----
 src/components/Sidebar.tsx                    |  8 ++--
 .../__snapshots__/Sidebar.test.tsx.snap       | 48 +++++++++----------
 3 files changed, 41 insertions(+), 41 deletions(-)

diff --git a/src/components/Sidebar.test.tsx b/src/components/Sidebar.test.tsx
index 4210c9de1..f788b289e 100644
--- a/src/components/Sidebar.test.tsx
+++ b/src/components/Sidebar.test.tsx
@@ -102,13 +102,13 @@ describe('components/Sidebar.tsx', () => {
           </AppContext.Provider>,
         );
 
-        const notificationsIcon = screen.getByTitle('0 Unread Notifications');
+        const notificationsIcon = screen.getByTitle('0 unread notifications');
 
         expect(notificationsIcon.className).toContain('text-white');
         expect(notificationsIcon.childNodes.length).toBe(1);
         expect(notificationsIcon.childNodes[0].nodeName).toBe('svg');
 
-        fireEvent.click(screen.getByLabelText('0 Unread Notifications'));
+        fireEvent.click(screen.getByLabelText('0 unread notifications'));
 
         expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
         expect(openExternalLinkMock).toHaveBeenCalledWith(
@@ -132,14 +132,14 @@ describe('components/Sidebar.tsx', () => {
           </AppContext.Provider>,
         );
 
-        const notificationsIcon = screen.getByTitle('4 Unread Notifications');
+        const notificationsIcon = screen.getByTitle('4 unread notifications');
 
         expect(notificationsIcon.className).toContain(IconColor.GREEN);
         expect(notificationsIcon.childNodes.length).toBe(2);
         expect(notificationsIcon.childNodes[0].nodeName).toBe('svg');
         expect(notificationsIcon.childNodes[1].nodeValue).toBe('4');
 
-        fireEvent.click(screen.getByLabelText('4 Unread Notifications'));
+        fireEvent.click(screen.getByLabelText('4 unread notifications'));
 
         expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
         expect(openExternalLinkMock).toHaveBeenCalledWith(
@@ -165,7 +165,7 @@ describe('components/Sidebar.tsx', () => {
       </AppContext.Provider>,
     );
 
-    fireEvent.click(screen.getByLabelText('My Issues'));
+    fireEvent.click(screen.getByLabelText('My issues'));
 
     expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
     expect(openExternalLinkMock).toHaveBeenCalledWith(
@@ -189,7 +189,7 @@ describe('components/Sidebar.tsx', () => {
       </AppContext.Provider>,
     );
 
-    fireEvent.click(screen.getByLabelText('My Pull Requests'));
+    fireEvent.click(screen.getByLabelText('My pull requests'));
 
     expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
     expect(openExternalLinkMock).toHaveBeenCalledWith(
@@ -216,7 +216,7 @@ describe('components/Sidebar.tsx', () => {
         </AppContext.Provider>,
       );
 
-      fireEvent.click(screen.getByTitle('Refresh Notifications'));
+      fireEvent.click(screen.getByTitle('Refresh notifications'));
 
       expect(fetchNotifications).toHaveBeenCalledTimes(1);
     });
@@ -239,7 +239,7 @@ describe('components/Sidebar.tsx', () => {
         </AppContext.Provider>,
       );
 
-      fireEvent.click(screen.getByTitle('Refresh Notifications'));
+      fireEvent.click(screen.getByTitle('Refresh notifications'));
 
       expect(fetchNotifications).not.toHaveBeenCalled();
     });
@@ -348,7 +348,7 @@ describe('components/Sidebar.tsx', () => {
         </MemoryRouter>
       </AppContext.Provider>,
     );
-    fireEvent.click(screen.getByLabelText('4 Unread Notifications'));
+    fireEvent.click(screen.getByLabelText('4 unread notifications'));
     expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
     expect(openExternalLinkMock).toHaveBeenCalledWith(
       'https://github.com/notifications',
@@ -372,7 +372,7 @@ describe('components/Sidebar.tsx', () => {
         </MemoryRouter>
       </AppContext.Provider>,
     );
-    fireEvent.click(screen.getByLabelText('My Issues'));
+    fireEvent.click(screen.getByLabelText('My issues'));
     expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
     expect(openExternalLinkMock).toHaveBeenCalledWith(
       'https://github.com/issues',
@@ -396,7 +396,7 @@ describe('components/Sidebar.tsx', () => {
         </MemoryRouter>
       </AppContext.Provider>,
     );
-    fireEvent.click(screen.getByLabelText('My Pull Requests'));
+    fireEvent.click(screen.getByLabelText('My pull requests'));
     expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
     expect(openExternalLinkMock).toHaveBeenCalledWith(
       'https://github.com/pulls',
@@ -443,7 +443,7 @@ describe('components/Sidebar.tsx', () => {
         </AppContext.Provider>,
       );
 
-      const notificationsIcon = screen.getByTitle('0 Unread Notifications');
+      const notificationsIcon = screen.getByTitle('0 unread notifications');
       expect(notificationsIcon.className).toContain('text-white');
       expect(notificationsIcon.childNodes.length).toBe(1);
       expect(notificationsIcon.childNodes[0].nodeName).toBe('svg');
@@ -465,7 +465,7 @@ describe('components/Sidebar.tsx', () => {
         </AppContext.Provider>,
       );
 
-      const notificationsIcon = screen.getByTitle('4 Unread Notifications');
+      const notificationsIcon = screen.getByTitle('4 unread notifications');
       expect(notificationsIcon.className).toContain(IconColor.GREEN);
       expect(notificationsIcon.childNodes.length).toBe(2);
       expect(notificationsIcon.childNodes[0].nodeName).toBe('svg');
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index 61f2f584e..593c21d3b 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -85,20 +85,20 @@ export const Sidebar: FC = () => {
         </button>
 
         <SidebarButton
-          title={`${notificationsCount} Unread Notifications`}
+          title={`${notificationsCount} unread notifications`}
           metric={isLoggedIn ? notificationsCount : null}
           icon={BellIcon}
           onClick={() => openGitHubNotifications(primaryAccountHostname)}
         />
 
         <SidebarButton
-          title="My Issues"
+          title="My issues"
           icon={IssueOpenedIcon}
           onClick={() => openGitHubIssues(primaryAccountHostname)}
         />
 
         <SidebarButton
-          title="My Pull Requests"
+          title="My pull requests"
           icon={GitPullRequestIcon}
           onClick={() => openGitHubPulls(primaryAccountHostname)}
         />
@@ -108,7 +108,7 @@ export const Sidebar: FC = () => {
         {isLoggedIn && (
           <>
             <SidebarButton
-              title="Refresh Notifications"
+              title="Refresh notifications"
               icon={SyncIcon}
               size={Size.MEDIUM}
               loading={status === 'loading'}
diff --git a/src/components/__snapshots__/Sidebar.test.tsx.snap b/src/components/__snapshots__/Sidebar.test.tsx.snap
index a6f5dcf52..8fbf9a4cb 100644
--- a/src/components/__snapshots__/Sidebar.test.tsx.snap
+++ b/src/components/__snapshots__/Sidebar.test.tsx.snap
@@ -64,11 +64,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged in)
           </button>
           <button
             class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-            title="4 Unread Notifications"
+            title="4 unread notifications"
             type="button"
           >
             <svg
-              aria-label="4 Unread Notifications"
+              aria-label="4 unread notifications"
               class="octicon octicon-bell"
               fill="currentColor"
               focusable="false"
@@ -85,11 +85,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged in)
           </button>
           <button
             class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-            title="My Issues"
+            title="My issues"
             type="button"
           >
             <svg
-              aria-label="My Issues"
+              aria-label="My issues"
               class="octicon octicon-issue-opened"
               fill="currentColor"
               focusable="false"
@@ -109,11 +109,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged in)
           </button>
           <button
             class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-            title="My Pull Requests"
+            title="My pull requests"
             type="button"
           >
             <svg
-              aria-label="My Pull Requests"
+              aria-label="My pull requests"
               class="octicon octicon-git-pull-request"
               fill="currentColor"
               focusable="false"
@@ -217,11 +217,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged in)
         </button>
         <button
           class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-          title="4 Unread Notifications"
+          title="4 unread notifications"
           type="button"
         >
           <svg
-            aria-label="4 Unread Notifications"
+            aria-label="4 unread notifications"
             class="octicon octicon-bell"
             fill="currentColor"
             focusable="false"
@@ -238,11 +238,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged in)
         </button>
         <button
           class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-          title="My Issues"
+          title="My issues"
           type="button"
         >
           <svg
-            aria-label="My Issues"
+            aria-label="My issues"
             class="octicon octicon-issue-opened"
             fill="currentColor"
             focusable="false"
@@ -262,11 +262,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged in)
         </button>
         <button
           class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-          title="My Pull Requests"
+          title="My pull requests"
           type="button"
         >
           <svg
-            aria-label="My Pull Requests"
+            aria-label="My pull requests"
             class="octicon octicon-git-pull-request"
             fill="currentColor"
             focusable="false"
@@ -427,11 +427,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged out)
           </button>
           <button
             class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-            title="4 Unread Notifications"
+            title="4 unread notifications"
             type="button"
           >
             <svg
-              aria-label="4 Unread Notifications"
+              aria-label="4 unread notifications"
               class="octicon octicon-bell"
               fill="currentColor"
               focusable="false"
@@ -448,11 +448,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged out)
           </button>
           <button
             class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-            title="My Issues"
+            title="My issues"
             type="button"
           >
             <svg
-              aria-label="My Issues"
+              aria-label="My issues"
               class="octicon octicon-issue-opened"
               fill="currentColor"
               focusable="false"
@@ -472,11 +472,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged out)
           </button>
           <button
             class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-            title="My Pull Requests"
+            title="My pull requests"
             type="button"
           >
             <svg
-              aria-label="My Pull Requests"
+              aria-label="My pull requests"
               class="octicon octicon-git-pull-request"
               fill="currentColor"
               focusable="false"
@@ -580,11 +580,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged out)
         </button>
         <button
           class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-          title="4 Unread Notifications"
+          title="4 unread notifications"
           type="button"
         >
           <svg
-            aria-label="4 Unread Notifications"
+            aria-label="4 unread notifications"
             class="octicon octicon-bell"
             fill="currentColor"
             focusable="false"
@@ -601,11 +601,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged out)
         </button>
         <button
           class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-          title="My Issues"
+          title="My issues"
           type="button"
         >
           <svg
-            aria-label="My Issues"
+            aria-label="My issues"
             class="octicon octicon-issue-opened"
             fill="currentColor"
             focusable="false"
@@ -625,11 +625,11 @@ exports[`components/Sidebar.tsx should render itself & its children (logged out)
         </button>
         <button
           class="flex justify-evenly items-center w-full my-1 cursor-pointer text-xs font-extrabold focus:outline-none disabled:text-gray-500 disabled:cursor-default text-white hover:text-gray-500 py-1"
-          title="My Pull Requests"
+          title="My pull requests"
           type="button"
         >
           <svg
-            aria-label="My Pull Requests"
+            aria-label="My pull requests"
             class="octicon octicon-git-pull-request"
             fill="currentColor"
             focusable="false"