From 32c7118ba7fda662e6e5002935949986982c934a Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Wed, 18 Sep 2024 06:51:28 -0400
Subject: [PATCH] refactor: update sidebar labels (#1538)

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 4823bddb7..82a68d1d5 100644
--- a/src/components/Sidebar.test.tsx
+++ b/src/components/Sidebar.test.tsx
@@ -98,13 +98,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(
@@ -128,14 +128,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(
@@ -161,7 +161,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(
@@ -185,7 +185,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(
@@ -212,7 +212,7 @@ describe('components/Sidebar.tsx', () => {
         </AppContext.Provider>,
       );
 
-      fireEvent.click(screen.getByTitle('Refresh Notifications'));
+      fireEvent.click(screen.getByTitle('Refresh notifications'));
 
       expect(fetchNotifications).toHaveBeenCalledTimes(1);
     });
@@ -235,7 +235,7 @@ describe('components/Sidebar.tsx', () => {
         </AppContext.Provider>,
       );
 
-      fireEvent.click(screen.getByTitle('Refresh Notifications'));
+      fireEvent.click(screen.getByTitle('Refresh notifications'));
 
       expect(fetchNotifications).not.toHaveBeenCalled();
     });
@@ -344,7 +344,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',
@@ -368,7 +368,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',
@@ -392,7 +392,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',
@@ -439,7 +439,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');
@@ -461,7 +461,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 836627076..bf28a0b30 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -83,20 +83,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)}
         />
@@ -106,7 +106,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 4d7d2fa2d..cf18a18ae 100644
--- a/src/components/__snapshots__/Sidebar.test.tsx.snap
+++ b/src/components/__snapshots__/Sidebar.test.tsx.snap
@@ -63,11 +63,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"
@@ -84,11 +84,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"
@@ -108,11 +108,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"
@@ -215,11 +215,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"
@@ -236,11 +236,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"
@@ -260,11 +260,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"
@@ -424,11 +424,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"
@@ -445,11 +445,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"
@@ -469,11 +469,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"
@@ -576,11 +576,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"
@@ -597,11 +597,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"
@@ -621,11 +621,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"