Repository: gitify-app/gitify
Pull request #1161 (2024-05-31 03:03:33)

feat: labels indicator
![Screenshot 2024-05-30 at 10 58 30 PM](https://github.com/gitify-app/gitify/assets/386277/8315dcbd-aa3b-4e2d-aa74-26a58db84f75)


setchy: Tests still WIP.

Would appreciate feedback on color and icon. Went with a purple tag for the time being
bmulholland: My take is that using color where it's not conveying information makes it harder to parse the places where color is important (like PR status). Matching the text color should be fine, right?
setchy: > My take is that using color where it's not conveying information makes it harder to parse the places where color is important (like PR status). Matching the text color should be fine, right?

appreciate the feedback. thanks @bmulholland.  I'll make that change.

I might also try and see what render the labels as `pills` using the label.color looks like (like the Android GitHub app does)
setchy: updated to use pill format as to-be introduced by #1169 

<img width="504" alt="Screenshot 2024-06-02 at 3 49 53 PM" src="https://github.com/gitify-app/gitify/assets/386277/8b8220af-b81a-4c44-a349-7b4f3bb5c095">

setchy: > Was about to finish the merge, but had to do the dishes 😂 I think you're still missing a couple of places where labels need to be defined as I still see a couple of these around. <img alt="image" width="1119" src="https://private-user-images.githubusercontent.com/19473034/336262678-374a224c-7c1e-465f-aca8-4753af9d081e.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTc0NjA5MDYsIm5iZiI6MTcxNzQ2MDYwNiwicGF0aCI6Ii8xOTQ3MzAzNC8zMzYyNjI2NzgtMzc0YTIyNGMtN2MxZS00NjVmLWFjYTgtNDc1M2FmOWQwODFlLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA2MDQlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNjA0VDAwMjMyNlomWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTRiYTg2ZTFiNzdhYTg3ZWE1MzZiMjY0MzNlY2VjZjI3YjMzODdlY2NmOWUxZjY0MGVmYTMxMTJiMjgzZWM2ODYmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.4e29rbkVcuWpDHsXS6PrwHaWVLrA3fDA3MoGKO1jgtw">

Haha - sorry about that.  

Where are you seeing this?
afonsojramos: > Haha - sorry about that.
> 
> Where are you seeing this?

<img width="1150" alt="image" src="https://github.com/gitify-app/gitify/assets/19473034/caec66d9-09d9-4eea-bc22-f73b519da9ef">
On these two under `useNotifications.test.ts`

Patch:
diff --git a/src/components/NotificationRow.tsx b/src/components/NotificationRow.tsx
index d9cd9b9f..1a5af437 100644
--- a/src/components/NotificationRow.tsx
+++ b/src/components/NotificationRow.tsx
@@ -5,6 +5,7 @@ import {
   FeedPersonIcon,
   IssueClosedIcon,
   ReadIcon,
+  TagIcon,
 } from '@primer/octicons-react';
 import {
   type FC,
@@ -92,6 +93,10 @@ export const NotificationRow: FC<IProps> = ({ notification, hostname }) => {
     notification.subject.comments > 1 ? 'comments' : 'comment'
   }`;
 
+  const labelsPillDescription = notification.subject.labels
+    ?.map((label) => `🏷️ ${label}`)
+    .join('\n');
+
   const linkedIssuesPillDescription = `Linked to ${
     notification.subject.linkedIssues?.length > 1 ? 'issues' : 'issue'
   } ${notification.subject?.linkedIssues?.join(', ')}`;
@@ -201,6 +206,18 @@ export const NotificationRow: FC<IProps> = ({ notification, hostname }) => {
                   </button>
                 </span>
               )}
+              {notification.subject?.labels?.length > 0 && (
+                <span className="ml-1" title={labelsPillDescription}>
+                  <button type="button" className={Constants.PILL_CLASS_NAME}>
+                    <TagIcon
+                      size={12}
+                      className={`mr-1 ${IconColor.GRAY}`}
+                      aria-label={labelsPillDescription}
+                    />
+                    {notification.subject.labels.length}
+                  </button>
+                </span>
+              )}
             </span>
           </span>
         </div>
diff --git a/src/typesGitHub.ts b/src/typesGitHub.ts
index 46f0ee94..316baee7 100644
--- a/src/typesGitHub.ts
+++ b/src/typesGitHub.ts
@@ -266,6 +266,7 @@ export interface GitifySubject {
   reviews?: GitifyPullRequestReview[];
   linkedIssues?: string[];
   comments?: number;
+  labels?: string[];
 }
 
 export interface PullRequest {
@@ -287,6 +288,7 @@ export interface PullRequest {
   closed_at: string | null;
   merged_at: string | null;
   merge_commit_sha: string | null;
+  labels: Labels[];
   draft: boolean;
   commits_url: string;
   review_comments_url: string;
@@ -311,6 +313,16 @@ export interface GitifyPullRequestReview {
   users: string[];
 }
 
+export interface Labels {
+  id: number;
+  node_id: string;
+  url: string;
+  name: string;
+  color: string;
+  default: boolean;
+  description: string;
+}
+
 export interface PullRequestReview {
   id: number;
   node_id: string;
@@ -416,6 +428,7 @@ export interface Issue {
   author_association: string;
   body: string;
   state_reason: IssueStateReasonType | null;
+  labels: Labels[];
 }
 
 export interface IssueOrPullRequestComment {
@@ -463,6 +476,15 @@ export interface Discussion {
   url: string;
   author: DiscussionAuthor;
   comments: DiscussionComments;
+  labels: DiscussionLabels | null;
+}
+
+export interface DiscussionLabels {
+  nodes: DiscussionLabel[];
+}
+
+export interface DiscussionLabel {
+  name: string;
 }
 
 export interface DiscussionComments {
diff --git a/src/utils/api/__mocks__/response-mocks.ts b/src/utils/api/__mocks__/response-mocks.ts
index 603a58fb..06e438f3 100644
--- a/src/utils/api/__mocks__/response-mocks.ts
+++ b/src/utils/api/__mocks__/response-mocks.ts
@@ -6,6 +6,7 @@ import type {
   Discussion,
   DiscussionAuthor,
   DiscussionComments,
+  DiscussionLabels,
   GraphQLSearch,
   Notification,
   Repository,
@@ -388,6 +389,14 @@ export const mockDiscussionComments: DiscussionComments = {
   totalCount: 2,
 };
 
+export const mockDiscussionLabels: DiscussionLabels = {
+  nodes: [
+    {
+      name: 'enhancement',
+    },
+  ],
+};
+
 export const mockGraphQLResponse: GraphQLSearch<Discussion> = {
   data: {
     search: {
@@ -404,6 +413,7 @@ export const mockGraphQLResponse: GraphQLSearch<Discussion> = {
             type: 'User',
           },
           comments: mockDiscussionComments,
+          labels: mockDiscussionLabels,
         },
       ],
     },
diff --git a/src/utils/api/graphql/discussions.ts b/src/utils/api/graphql/discussions.ts
index 7472f10a..ab34a900 100644
--- a/src/utils/api/graphql/discussions.ts
+++ b/src/utils/api/graphql/discussions.ts
@@ -49,6 +49,11 @@ export const QUERY_SEARCH_DISCUSSIONS = gql`
               }
             }
           }
+          labels {
+            nodes {
+              name
+            }
+          }
         }
       }
     }
diff --git a/src/utils/subject.ts b/src/utils/subject.ts
index 45085a41..ffbc3736 100644
--- a/src/utils/subject.ts
+++ b/src/utils/subject.ts
@@ -184,6 +184,7 @@ async function getGitifySubjectForDiscussion(
     state: discussionState,
     user: discussionUser,
     comments: discussion.comments.totalCount,
+    labels: discussion.labels?.nodes.map((label) => label.name) ?? [],
   };
 }
 
@@ -231,6 +232,7 @@ async function getGitifySubjectForIssue(
       type: issueCommentUser?.type ?? issue.user.type,
     },
     comments: issue.comments,
+    labels: issue.labels?.map((label) => label.name) ?? [],
   };
 }
 
@@ -276,6 +278,7 @@ async function getGitifySubjectForPullRequest(
     },
     reviews: reviews,
     comments: pr.comments,
+    labels: pr.labels?.map((label) => label.name) ?? [],
     linkedIssues: linkedIssues,
   };
 }


Test patch:
diff --git a/src/components/NotificationRow.test.tsx b/src/components/NotificationRow.test.tsx
index af7b1627..71be711e 100644
--- a/src/components/NotificationRow.test.tsx
+++ b/src/components/NotificationRow.test.tsx
@@ -117,6 +117,25 @@ describe('components/NotificationRow.tsx', () => {
     });
   });
 
+  describe('notification labels', () => {
+    it('should render labels metric when available', async () => {
+      jest
+        .spyOn(global.Date, 'now')
+        .mockImplementation(() => new Date('2024').valueOf());
+
+      const mockNotification = mockSingleNotification;
+      mockNotification.subject.labels = ['enhancement', 'good-first-issue'];
+
+      const props = {
+        notification: mockNotification,
+        hostname: 'github.com',
+      };
+
+      const tree = render(<NotificationRow {...props} />);
+      expect(tree).toMatchSnapshot();
+    });
+  });
+
   describe('linked issues/prs', () => {
     it('should render when linked to one issue/pr', async () => {
       jest
diff --git a/src/components/__snapshots__/NotificationRow.test.tsx.snap b/src/components/__snapshots__/NotificationRow.test.tsx.snap
index 6479765a..c2cac717 100644
--- a/src/components/__snapshots__/NotificationRow.test.tsx.snap
+++ b/src/components/__snapshots__/NotificationRow.test.tsx.snap
@@ -186,6 +186,34 @@ exports[`components/NotificationRow.tsx linked issues/prs should render when lin
                     2
                   </button>
                 </span>
+                <span
+                  class="ml-1"
+                  title="🏷️ enhancement
+🏷️ good-first-issue"
+                >
+                  <button
+                    class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                    type="button"
+                  >
+                    <svg
+                      aria-label="🏷️ enhancement
+🏷️ good-first-issue"
+                      class="mr-1 text-gray-500 dark:text-gray-300"
+                      fill="currentColor"
+                      focusable="false"
+                      height="12"
+                      role="img"
+                      style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                      viewBox="0 0 16 16"
+                      width="12"
+                    >
+                      <path
+                        d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"
+                      />
+                    </svg>
+                    2
+                  </button>
+                </span>
               </span>
             </span>
           </div>
@@ -442,6 +470,34 @@ exports[`components/NotificationRow.tsx linked issues/prs should render when lin
                   2
                 </button>
               </span>
+              <span
+                class="ml-1"
+                title="🏷️ enhancement
+🏷️ good-first-issue"
+              >
+                <button
+                  class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                  type="button"
+                >
+                  <svg
+                    aria-label="🏷️ enhancement
+🏷️ good-first-issue"
+                    class="mr-1 text-gray-500 dark:text-gray-300"
+                    fill="currentColor"
+                    focusable="false"
+                    height="12"
+                    role="img"
+                    style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                    viewBox="0 0 16 16"
+                    width="12"
+                  >
+                    <path
+                      d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"
+                    />
+                  </svg>
+                  2
+                </button>
+              </span>
             </span>
           </span>
         </div>
@@ -755,6 +811,34 @@ exports[`components/NotificationRow.tsx linked issues/prs should render when lin
                     2
                   </button>
                 </span>
+                <span
+                  class="ml-1"
+                  title="🏷️ enhancement
+🏷️ good-first-issue"
+                >
+                  <button
+                    class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                    type="button"
+                  >
+                    <svg
+                      aria-label="🏷️ enhancement
+🏷️ good-first-issue"
+                      class="mr-1 text-gray-500 dark:text-gray-300"
+                      fill="currentColor"
+                      focusable="false"
+                      height="12"
+                      role="img"
+                      style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                      viewBox="0 0 16 16"
+                      width="12"
+                    >
+                      <path
+                        d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"
+                      />
+                    </svg>
+                    2
+                  </button>
+                </span>
               </span>
             </span>
           </div>
@@ -1011,6 +1095,601 @@ exports[`components/NotificationRow.tsx linked issues/prs should render when lin
                   2
                 </button>
               </span>
+              <span
+                class="ml-1"
+                title="🏷️ enhancement
+🏷️ good-first-issue"
+              >
+                <button
+                  class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                  type="button"
+                >
+                  <svg
+                    aria-label="🏷️ enhancement
+🏷️ good-first-issue"
+                    class="mr-1 text-gray-500 dark:text-gray-300"
+                    fill="currentColor"
+                    focusable="false"
+                    height="12"
+                    role="img"
+                    style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                    viewBox="0 0 16 16"
+                    width="12"
+                  >
+                    <path
+                      d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"
+                    />
+                  </svg>
+                  2
+                </button>
+              </span>
+            </span>
+          </span>
+        </div>
+      </div>
+      <div
+        class="flex justify-center items-center gap-2 opacity-0 group-hover:opacity-80 transition-opacity"
+      >
+        <button
+          class="focus:outline-none h-full hover:text-green-500"
+          title="Mark as Done"
+          type="button"
+        >
+          <svg
+            aria-label="Mark as Done"
+            class="octicon octicon-check"
+            fill="currentColor"
+            focusable="false"
+            height="16"
+            role="img"
+            style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+            viewBox="0 0 16 16"
+            width="16"
+          >
+            <path
+              d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"
+            />
+          </svg>
+        </button>
+        <button
+          class="focus:outline-none h-full hover:text-red-500"
+          title="Unsubscribe from Thread"
+          type="button"
+        >
+          <svg
+            aria-label="Unsubscribe from Thread"
+            class="octicon octicon-bell-slash"
+            fill="currentColor"
+            focusable="false"
+            height="14"
+            role="img"
+            style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+            viewBox="0 0 16 16"
+            width="14"
+          >
+            <path
+              d="m4.182 4.31.016.011 10.104 7.316.013.01 1.375.996a.75.75 0 1 1-.88 1.214L13.626 13H2.518a1.516 1.516 0 0 1-1.263-2.36l1.703-2.554A.255.255 0 0 0 3 7.947V5.305L.31 3.357a.75.75 0 1 1 .88-1.214Zm7.373 7.19L4.5 6.391v1.556c0 .346-.102.683-.294.97l-1.703 2.556a.017.017 0 0 0-.003.01c0 .005.002.009.005.012l.006.004.007.001ZM8 1.5c-.997 0-1.895.416-2.534 1.086A.75.75 0 1 1 4.38 1.55 5 5 0 0 1 13 5v2.373a.75.75 0 0 1-1.5 0V5A3.5 3.5 0 0 0 8 1.5ZM8 16a2 2 0 0 1-1.985-1.75c-.017-.137.097-.25.235-.25h3.5c.138 0 .252.113.235.25A2 2 0 0 1 8 16Z"
+            />
+          </svg>
+        </button>
+        <button
+          class="focus:outline-none h-full hover:text-green-500"
+          title="Mark as Read"
+          type="button"
+        >
+          <svg
+            aria-label="Mark as Read"
+            class="octicon octicon-read"
+            fill="currentColor"
+            focusable="false"
+            height="14"
+            role="img"
+            style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+            viewBox="0 0 16 16"
+            width="14"
+          >
+            <path
+              d="M7.115.65a1.752 1.752 0 0 1 1.77 0l6.25 3.663c.536.314.865.889.865 1.51v6.427A1.75 1.75 0 0 1 14.25 14H1.75A1.75 1.75 0 0 1 0 12.25V5.823c0-.621.33-1.196.865-1.51Zm1.011 1.293a.252.252 0 0 0-.252 0l-5.72 3.353L6.468 7.76a2.748 2.748 0 0 1 3.066 0l4.312-2.464-5.719-3.353ZM13.15 12.5 8.772 9.06a1.25 1.25 0 0 0-1.544 0L2.85 12.5Zm1.35-5.85-3.687 2.106 3.687 2.897ZM5.187 8.756 1.5 6.65v5.003Z"
+            />
+          </svg>
+        </button>
+      </div>
+    </div>
+  </div>,
+  "debug": [Function],
+  "findAllByAltText": [Function],
+  "findAllByDisplayValue": [Function],
+  "findAllByLabelText": [Function],
+  "findAllByPlaceholderText": [Function],
+  "findAllByRole": [Function],
+  "findAllByTestId": [Function],
+  "findAllByText": [Function],
+  "findAllByTitle": [Function],
+  "findByAltText": [Function],
+  "findByDisplayValue": [Function],
+  "findByLabelText": [Function],
+  "findByPlaceholderText": [Function],
+  "findByRole": [Function],
+  "findByTestId": [Function],
+  "findByText": [Function],
+  "findByTitle": [Function],
+  "getAllByAltText": [Function],
+  "getAllByDisplayValue": [Function],
+  "getAllByLabelText": [Function],
+  "getAllByPlaceholderText": [Function],
+  "getAllByRole": [Function],
+  "getAllByTestId": [Function],
+  "getAllByText": [Function],
+  "getAllByTitle": [Function],
+  "getByAltText": [Function],
+  "getByDisplayValue": [Function],
+  "getByLabelText": [Function],
+  "getByPlaceholderText": [Function],
+  "getByRole": [Function],
+  "getByTestId": [Function],
+  "getByText": [Function],
+  "getByTitle": [Function],
+  "queryAllByAltText": [Function],
+  "queryAllByDisplayValue": [Function],
+  "queryAllByLabelText": [Function],
+  "queryAllByPlaceholderText": [Function],
+  "queryAllByRole": [Function],
+  "queryAllByTestId": [Function],
+  "queryAllByText": [Function],
+  "queryAllByTitle": [Function],
+  "queryByAltText": [Function],
+  "queryByDisplayValue": [Function],
+  "queryByLabelText": [Function],
+  "queryByPlaceholderText": [Function],
+  "queryByRole": [Function],
+  "queryByTestId": [Function],
+  "queryByText": [Function],
+  "queryByTitle": [Function],
+  "rerender": [Function],
+  "unmount": [Function],
+}
+`;
+
+exports[`components/NotificationRow.tsx notification labels should render labels metric when available 1`] = `
+{
+  "asFragment": [Function],
+  "baseElement": <body>
+    <div>
+      <div
+        class="flex space-x-3 py-2 px-3 bg-white dark:bg-gray-dark dark:text-white hover:bg-gray-100 dark:hover:bg-gray-darker border-b border-gray-100 dark:border-gray-darker group"
+        id="138661096"
+      >
+        <div
+          class="flex justify-center items-center w-5 text-green-500"
+          title="Open Issue"
+        >
+          <svg
+            aria-label="Issue"
+            class="octicon octicon-issue-opened"
+            fill="currentColor"
+            focusable="false"
+            height="18"
+            role="img"
+            style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+            viewBox="0 0 16 16"
+            width="18"
+          >
+            <path
+              d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+            />
+            <path
+              d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+            />
+          </svg>
+        </div>
+        <div
+          class="flex-1 overflow-hidden"
+        >
+          <div
+            class="mb-1 text-sm whitespace-nowrap overflow-ellipsis overflow-hidden cursor-pointer"
+            role="main"
+            title="I am a robot and this is a test!"
+          >
+            I am a robot and this is a test!
+          </div>
+          <div
+            class="text-xs text-capitalize whitespace-nowrap overflow-ellipsis overflow-hidden"
+          >
+            <span
+              class="flex items-center"
+            >
+              <span
+                class="flex"
+                title="Updated over 6 years ago"
+              >
+                <span>
+                  <svg
+                    aria-hidden="true"
+                    class="text-gray-500 dark:text-gray-300"
+                    fill="currentColor"
+                    focusable="false"
+                    height="16"
+                    style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                    viewBox="0 0 16 16"
+                    width="16"
+                  >
+                    <path
+                      d="M8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16Zm.847-8.145a2.502 2.502 0 1 0-1.694 0C5.471 8.261 4 9.775 4 11c0 .395.145.995 1 .995h6c.855 0 1-.6 1-.995 0-1.224-1.47-2.74-3.153-3.145Z"
+                    />
+                  </svg>
+                </span>
+                <span
+                  class="ml-1"
+                  title="You're watching the repository."
+                >
+                  Updated
+                </span>
+                <span
+                  class="ml-1"
+                >
+                  over 6 years ago
+                </span>
+                <span
+                  class="ml-1"
+                  title="octocat approved these changes"
+                >
+                  <button
+                    class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                    type="button"
+                  >
+                    <svg
+                      aria-label="octocat approved these changes"
+                      class="mr-1 text-green-500"
+                      fill="currentColor"
+                      focusable="false"
+                      height="12"
+                      role="img"
+                      style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                      viewBox="0 0 16 16"
+                      width="12"
+                    >
+                      <path
+                        d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"
+                      />
+                    </svg>
+                    1
+                  </button>
+                </span>
+                <span
+                  class="ml-1"
+                  title="gitify-app requested changes"
+                >
+                  <button
+                    class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                    type="button"
+                  >
+                    <svg
+                      aria-label="gitify-app requested changes"
+                      class="mr-1 text-red-500"
+                      fill="currentColor"
+                      focusable="false"
+                      height="12"
+                      role="img"
+                      style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                      viewBox="0 0 16 16"
+                      width="12"
+                    >
+                      <path
+                        d="M1 1.75C1 .784 1.784 0 2.75 0h7.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16H2.75A1.75 1.75 0 0 1 1 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h10.5a.25.25 0 0 0 .25-.25V4.664a.25.25 0 0 0-.073-.177l-2.914-2.914a.25.25 0 0 0-.177-.073ZM8 3.25a.75.75 0 0 1 .75.75v1.5h1.5a.75.75 0 0 1 0 1.5h-1.5v1.5a.75.75 0 0 1-1.5 0V7h-1.5a.75.75 0 0 1 0-1.5h1.5V4A.75.75 0 0 1 8 3.25Zm-3 8a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1-.75-.75Z"
+                      />
+                    </svg>
+                    1
+                  </button>
+                </span>
+                <span
+                  class="ml-1"
+                  title="2 comments"
+                >
+                  <button
+                    class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                    type="button"
+                  >
+                    <svg
+                      aria-label="2 comments"
+                      class="mr-1 text-gray-500 dark:text-gray-300"
+                      fill="currentColor"
+                      focusable="false"
+                      height="12"
+                      role="img"
+                      style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                      viewBox="0 0 16 16"
+                      width="12"
+                    >
+                      <path
+                        d="M1 2.75C1 1.784 1.784 1 2.75 1h10.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 13.25 12H9.06l-2.573 2.573A1.458 1.458 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"
+                      />
+                    </svg>
+                    2
+                  </button>
+                </span>
+                <span
+                  class="ml-1"
+                  title="🏷️ enhancement
+🏷️ good-first-issue"
+                >
+                  <button
+                    class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                    type="button"
+                  >
+                    <svg
+                      aria-label="🏷️ enhancement
+🏷️ good-first-issue"
+                      class="mr-1 text-gray-500 dark:text-gray-300"
+                      fill="currentColor"
+                      focusable="false"
+                      height="12"
+                      role="img"
+                      style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                      viewBox="0 0 16 16"
+                      width="12"
+                    >
+                      <path
+                        d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"
+                      />
+                    </svg>
+                    2
+                  </button>
+                </span>
+              </span>
+            </span>
+          </div>
+        </div>
+        <div
+          class="flex justify-center items-center gap-2 opacity-0 group-hover:opacity-80 transition-opacity"
+        >
+          <button
+            class="focus:outline-none h-full hover:text-green-500"
+            title="Mark as Done"
+            type="button"
+          >
+            <svg
+              aria-label="Mark as Done"
+              class="octicon octicon-check"
+              fill="currentColor"
+              focusable="false"
+              height="16"
+              role="img"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              viewBox="0 0 16 16"
+              width="16"
+            >
+              <path
+                d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="focus:outline-none h-full hover:text-red-500"
+            title="Unsubscribe from Thread"
+            type="button"
+          >
+            <svg
+              aria-label="Unsubscribe from Thread"
+              class="octicon octicon-bell-slash"
+              fill="currentColor"
+              focusable="false"
+              height="14"
+              role="img"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              viewBox="0 0 16 16"
+              width="14"
+            >
+              <path
+                d="m4.182 4.31.016.011 10.104 7.316.013.01 1.375.996a.75.75 0 1 1-.88 1.214L13.626 13H2.518a1.516 1.516 0 0 1-1.263-2.36l1.703-2.554A.255.255 0 0 0 3 7.947V5.305L.31 3.357a.75.75 0 1 1 .88-1.214Zm7.373 7.19L4.5 6.391v1.556c0 .346-.102.683-.294.97l-1.703 2.556a.017.017 0 0 0-.003.01c0 .005.002.009.005.012l.006.004.007.001ZM8 1.5c-.997 0-1.895.416-2.534 1.086A.75.75 0 1 1 4.38 1.55 5 5 0 0 1 13 5v2.373a.75.75 0 0 1-1.5 0V5A3.5 3.5 0 0 0 8 1.5ZM8 16a2 2 0 0 1-1.985-1.75c-.017-.137.097-.25.235-.25h3.5c.138 0 .252.113.235.25A2 2 0 0 1 8 16Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="focus:outline-none h-full hover:text-green-500"
+            title="Mark as Read"
+            type="button"
+          >
+            <svg
+              aria-label="Mark as Read"
+              class="octicon octicon-read"
+              fill="currentColor"
+              focusable="false"
+              height="14"
+              role="img"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              viewBox="0 0 16 16"
+              width="14"
+            >
+              <path
+                d="M7.115.65a1.752 1.752 0 0 1 1.77 0l6.25 3.663c.536.314.865.889.865 1.51v6.427A1.75 1.75 0 0 1 14.25 14H1.75A1.75 1.75 0 0 1 0 12.25V5.823c0-.621.33-1.196.865-1.51Zm1.011 1.293a.252.252 0 0 0-.252 0l-5.72 3.353L6.468 7.76a2.748 2.748 0 0 1 3.066 0l4.312-2.464-5.719-3.353ZM13.15 12.5 8.772 9.06a1.25 1.25 0 0 0-1.544 0L2.85 12.5Zm1.35-5.85-3.687 2.106 3.687 2.897ZM5.187 8.756 1.5 6.65v5.003Z"
+              />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </div>
+  </body>,
+  "container": <div>
+    <div
+      class="flex space-x-3 py-2 px-3 bg-white dark:bg-gray-dark dark:text-white hover:bg-gray-100 dark:hover:bg-gray-darker border-b border-gray-100 dark:border-gray-darker group"
+      id="138661096"
+    >
+      <div
+        class="flex justify-center items-center w-5 text-green-500"
+        title="Open Issue"
+      >
+        <svg
+          aria-label="Issue"
+          class="octicon octicon-issue-opened"
+          fill="currentColor"
+          focusable="false"
+          height="18"
+          role="img"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          viewBox="0 0 16 16"
+          width="18"
+        >
+          <path
+            d="M8 9.5a1.5 1.5 0 1 0 0-3 1.5 1.5 0 0 0 0 3Z"
+          />
+          <path
+            d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0ZM1.5 8a6.5 6.5 0 1 0 13 0 6.5 6.5 0 0 0-13 0Z"
+          />
+        </svg>
+      </div>
+      <div
+        class="flex-1 overflow-hidden"
+      >
+        <div
+          class="mb-1 text-sm whitespace-nowrap overflow-ellipsis overflow-hidden cursor-pointer"
+          role="main"
+          title="I am a robot and this is a test!"
+        >
+          I am a robot and this is a test!
+        </div>
+        <div
+          class="text-xs text-capitalize whitespace-nowrap overflow-ellipsis overflow-hidden"
+        >
+          <span
+            class="flex items-center"
+          >
+            <span
+              class="flex"
+              title="Updated over 6 years ago"
+            >
+              <span>
+                <svg
+                  aria-hidden="true"
+                  class="text-gray-500 dark:text-gray-300"
+                  fill="currentColor"
+                  focusable="false"
+                  height="16"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  viewBox="0 0 16 16"
+                  width="16"
+                >
+                  <path
+                    d="M8 16A8 8 0 1 1 8 0a8 8 0 0 1 0 16Zm.847-8.145a2.502 2.502 0 1 0-1.694 0C5.471 8.261 4 9.775 4 11c0 .395.145.995 1 .995h6c.855 0 1-.6 1-.995 0-1.224-1.47-2.74-3.153-3.145Z"
+                  />
+                </svg>
+              </span>
+              <span
+                class="ml-1"
+                title="You're watching the repository."
+              >
+                Updated
+              </span>
+              <span
+                class="ml-1"
+              >
+                over 6 years ago
+              </span>
+              <span
+                class="ml-1"
+                title="octocat approved these changes"
+              >
+                <button
+                  class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                  type="button"
+                >
+                  <svg
+                    aria-label="octocat approved these changes"
+                    class="mr-1 text-green-500"
+                    fill="currentColor"
+                    focusable="false"
+                    height="12"
+                    role="img"
+                    style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                    viewBox="0 0 16 16"
+                    width="12"
+                  >
+                    <path
+                      d="M13.78 4.22a.75.75 0 0 1 0 1.06l-7.25 7.25a.75.75 0 0 1-1.06 0L2.22 9.28a.751.751 0 0 1 .018-1.042.751.751 0 0 1 1.042-.018L6 10.94l6.72-6.72a.75.75 0 0 1 1.06 0Z"
+                    />
+                  </svg>
+                  1
+                </button>
+              </span>
+              <span
+                class="ml-1"
+                title="gitify-app requested changes"
+              >
+                <button
+                  class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                  type="button"
+                >
+                  <svg
+                    aria-label="gitify-app requested changes"
+                    class="mr-1 text-red-500"
+                    fill="currentColor"
+                    focusable="false"
+                    height="12"
+                    role="img"
+                    style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                    viewBox="0 0 16 16"
+                    width="12"
+                  >
+                    <path
+                      d="M1 1.75C1 .784 1.784 0 2.75 0h7.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16H2.75A1.75 1.75 0 0 1 1 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h10.5a.25.25 0 0 0 .25-.25V4.664a.25.25 0 0 0-.073-.177l-2.914-2.914a.25.25 0 0 0-.177-.073ZM8 3.25a.75.75 0 0 1 .75.75v1.5h1.5a.75.75 0 0 1 0 1.5h-1.5v1.5a.75.75 0 0 1-1.5 0V7h-1.5a.75.75 0 0 1 0-1.5h1.5V4A.75.75 0 0 1 8 3.25Zm-3 8a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1-.75-.75Z"
+                    />
+                  </svg>
+                  1
+                </button>
+              </span>
+              <span
+                class="ml-1"
+                title="2 comments"
+              >
+                <button
+                  class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                  type="button"
+                >
+                  <svg
+                    aria-label="2 comments"
+                    class="mr-1 text-gray-500 dark:text-gray-300"
+                    fill="currentColor"
+                    focusable="false"
+                    height="12"
+                    role="img"
+                    style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                    viewBox="0 0 16 16"
+                    width="12"
+                  >
+                    <path
+                      d="M1 2.75C1 1.784 1.784 1 2.75 1h10.5c.966 0 1.75.784 1.75 1.75v7.5A1.75 1.75 0 0 1 13.25 12H9.06l-2.573 2.573A1.458 1.458 0 0 1 4 13.543V12H2.75A1.75 1.75 0 0 1 1 10.25Zm1.75-.25a.25.25 0 0 0-.25.25v7.5c0 .138.112.25.25.25h2a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h4.5a.25.25 0 0 0 .25-.25v-7.5a.25.25 0 0 0-.25-.25Z"
+                    />
+                  </svg>
+                  2
+                </button>
+              </span>
+              <span
+                class="ml-1"
+                title="🏷️ enhancement
+🏷️ good-first-issue"
+              >
+                <button
+                  class="rounded-full text-xs px-2 bg-gray-100 hover:bg-gray-200 dark:bg-gray-800 dark:hover:bg-gray-700"
+                  type="button"
+                >
+                  <svg
+                    aria-label="🏷️ enhancement
+🏷️ good-first-issue"
+                    class="mr-1 text-gray-500 dark:text-gray-300"
+                    fill="currentColor"
+                    focusable="false"
+                    height="12"
+                    role="img"
+                    style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                    viewBox="0 0 16 16"
+                    width="12"
+                  >
+                    <path
+                      d="M1 7.775V2.75C1 1.784 1.784 1 2.75 1h5.025c.464 0 .91.184 1.238.513l6.25 6.25a1.75 1.75 0 0 1 0 2.474l-5.026 5.026a1.75 1.75 0 0 1-2.474 0l-6.25-6.25A1.752 1.752 0 0 1 1 7.775Zm1.5 0c0 .066.026.13.073.177l6.25 6.25a.25.25 0 0 0 .354 0l5.025-5.025a.25.25 0 0 0 0-.354l-6.25-6.25a.25.25 0 0 0-.177-.073H2.75a.25.25 0 0 0-.25.25ZM6 5a1 1 0 1 1 0 2 1 1 0 0 1 0-2Z"
+                    />
+                  </svg>
+                  2
+                </button>
+              </span>
             </span>
           </span>
         </div>
diff --git a/src/hooks/useNotifications.test.ts b/src/hooks/useNotifications.test.ts
index 7d55d332..cf33a3b7 100644
--- a/src/hooks/useNotifications.test.ts
+++ b/src/hooks/useNotifications.test.ts
@@ -225,6 +225,7 @@ describe('hooks/useNotifications.ts', () => {
                         },
                       ],
                     },
+                    labels: null,
                   },
                 ],
               },
@@ -237,6 +238,7 @@ describe('hooks/useNotifications.ts', () => {
             state: 'closed',
             merged: true,
             user: mockNotificationUser,
+            labels: [],
           });
         nock('https://api.github.com')
           .get('/repos/gitify-app/notifications-test/issues/3/comments')
@@ -249,6 +251,7 @@ describe('hooks/useNotifications.ts', () => {
             state: 'closed',
             merged: false,
             user: mockNotificationUser,
+            labels: [],
           });
         nock('https://api.github.com')
           .get('/repos/gitify-app/notifications-test/pulls/4/reviews')
diff --git a/src/utils/subject.test.ts b/src/utils/subject.test.ts
index 9ea16cad..8ecc5c1e 100644
--- a/src/utils/subject.test.ts
+++ b/src/utils/subject.test.ts
@@ -227,6 +227,7 @@ describe('utils/subject.ts', () => {
             type: mockDiscussionAuthor.type,
           },
           comments: 0,
+          labels: [],
         });
       });
 
@@ -252,6 +253,7 @@ describe('utils/subject.ts', () => {
             type: mockDiscussionAuthor.type,
           },
           comments: 0,
+          labels: [],
         });
       });
 
@@ -277,6 +279,7 @@ describe('utils/subject.ts', () => {
             type: mockDiscussionAuthor.type,
           },
           comments: 0,
+          labels: [],
         });
       });
 
@@ -302,6 +305,7 @@ describe('utils/subject.ts', () => {
             type: mockDiscussionAuthor.type,
           },
           comments: 0,
+          labels: [],
         });
       });
 
@@ -327,6 +331,7 @@ describe('utils/subject.ts', () => {
             type: mockDiscussionAuthor.type,
           },
           comments: 0,
+          labels: [],
         });
       });
 
@@ -352,6 +357,41 @@ describe('utils/subject.ts', () => {
             type: mockDiscussionAuthor.type,
           },
           comments: 0,
+          labels: [],
+        });
+      });
+
+      it('discussion with labels', async () => {
+        const mockDiscussion = mockDiscussionNode(null, true);
+        mockDiscussion.labels = {
+          nodes: [
+            {
+              name: 'enhancement',
+            },
+          ],
+        };
+        nock('https://api.github.com')
+          .post('/graphql')
+          .reply(200, {
+            data: {
+              search: {
+                nodes: [mockDiscussion],
+              },
+            },
+          });
+
+        const result = await getGitifySubjectDetails(mockNotification);
+
+        expect(result).toEqual({
+          state: 'ANSWERED',
+          user: {
+            login: mockDiscussionAuthor.login,
+            html_url: mockDiscussionAuthor.url,
+            avatar_url: mockDiscussionAuthor.avatar_url,
+            type: mockDiscussionAuthor.type,
+          },
+          comments: 0,
+          labels: ['enhancement'],
         });
       });
     });
@@ -371,7 +411,7 @@ describe('utils/subject.ts', () => {
       it('open issue state', async () => {
         nock('https://api.github.com')
           .get('/repos/gitify-app/notifications-test/issues/1')
-          .reply(200, { state: 'open', user: mockAuthor });
+          .reply(200, { state: 'open', user: mockAuthor, labels: [] });
 
         nock('https://api.github.com')
           .get('/repos/gitify-app/notifications-test/issues/comments/302888448')
@@ -387,13 +427,14 @@ describe('utils/subject.ts', () => {
             avatar_url: mockCommenter.avatar_url,
             type: mockCommenter.type,
           },
+          labels: [],
         });
       });
 
       it('closed issue state', async () => {
         nock('https://api.github.com')
           .get('/repos/gitify-app/notifications-test/issues/1')
-          .reply(200, { state: 'closed', user: mockAuthor });
+          .reply(200, { state: 'closed', user: mockAuthor, labels: [] });
 
         nock('https://api.github.com')
           .get('/repos/gitify-app/notifications-test/issues/comments/302888448')
@@ -409,6 +450,7 @@ describe('utils/subject.ts', () => {
             avatar_url: mockCommenter.avatar_url,
             type: mockCommenter.type,
           },
+          labels: [],
         });
       });
 
@@ -419,6 +461,7 @@ describe('utils/subject.ts', () => {
             state: 'closed',
             state_reason: 'completed',
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -435,6 +478,7 @@ describe('utils/subject.ts', () => {
             avatar_url: mockCommenter.avatar_url,
             type: mockCommenter.type,
           },
+          labels: [],
         });
       });
 
@@ -445,6 +489,7 @@ describe('utils/subject.ts', () => {
             state: 'open',
             state_reason: 'not_planned',
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -461,6 +506,7 @@ describe('utils/subject.ts', () => {
             avatar_url: mockCommenter.avatar_url,
             type: mockCommenter.type,
           },
+          labels: [],
         });
       });
 
@@ -471,6 +517,7 @@ describe('utils/subject.ts', () => {
             state: 'open',
             state_reason: 'reopened',
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -487,6 +534,7 @@ describe('utils/subject.ts', () => {
             avatar_url: mockCommenter.avatar_url,
             type: mockCommenter.type,
           },
+          labels: [],
         });
       });
 
@@ -500,6 +548,7 @@ describe('utils/subject.ts', () => {
             draft: false,
             merged: false,
             user: mockAuthor,
+            labels: [],
           });
 
         const result = await getGitifySubjectDetails(mockNotification);
@@ -512,6 +561,34 @@ describe('utils/subject.ts', () => {
             avatar_url: mockAuthor.avatar_url,
             type: mockAuthor.type,
           },
+          labels: [],
+        });
+      });
+
+      it('issue with labels', async () => {
+        nock('https://api.github.com')
+          .get('/repos/gitify-app/notifications-test/issues/1')
+          .reply(200, {
+            state: 'open',
+            user: mockAuthor,
+            labels: [{ name: 'enhancement' }],
+          });
+
+        nock('https://api.github.com')
+          .get('/repos/gitify-app/notifications-test/issues/comments/302888448')
+          .reply(200, { user: mockCommenter });
+
+        const result = await getGitifySubjectDetails(mockNotification);
+
+        expect(result).toEqual({
+          state: 'open',
+          user: {
+            login: mockCommenter.login,
+            html_url: mockCommenter.html_url,
+            avatar_url: mockCommenter.avatar_url,
+            type: mockCommenter.type,
+          },
+          labels: ['enhancement'],
         });
       });
     });
@@ -537,6 +614,7 @@ describe('utils/subject.ts', () => {
             draft: false,
             merged: false,
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -558,6 +636,7 @@ describe('utils/subject.ts', () => {
             type: mockCommenter.type,
           },
           reviews: null,
+          labels: [],
           linkedIssues: [],
         });
       });
@@ -570,6 +649,7 @@ describe('utils/subject.ts', () => {
             draft: true,
             merged: false,
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -591,6 +671,7 @@ describe('utils/subject.ts', () => {
             type: mockCommenter.type,
           },
           reviews: null,
+          labels: [],
           linkedIssues: [],
         });
       });
@@ -603,6 +684,7 @@ describe('utils/subject.ts', () => {
             draft: false,
             merged: true,
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -624,6 +706,7 @@ describe('utils/subject.ts', () => {
             type: mockCommenter.type,
           },
           reviews: null,
+          labels: [],
           linkedIssues: [],
         });
       });
@@ -636,6 +719,7 @@ describe('utils/subject.ts', () => {
             draft: false,
             merged: false,
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -657,6 +741,7 @@ describe('utils/subject.ts', () => {
             type: mockCommenter.type,
           },
           reviews: null,
+          labels: [],
           linkedIssues: [],
         });
       });
@@ -672,6 +757,7 @@ describe('utils/subject.ts', () => {
             draft: false,
             merged: false,
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -689,6 +775,7 @@ describe('utils/subject.ts', () => {
             type: mockAuthor.type,
           },
           reviews: null,
+          labels: [],
           linkedIssues: [],
         });
       });
@@ -703,6 +790,7 @@ describe('utils/subject.ts', () => {
             draft: false,
             merged: false,
             user: mockAuthor,
+            labels: [],
           });
 
         nock('https://api.github.com')
@@ -720,6 +808,7 @@ describe('utils/subject.ts', () => {
             type: mockAuthor.type,
           },
           reviews: null,
+          labels: [],
           linkedIssues: [],
         });
       });
@@ -782,7 +871,42 @@ describe('utils/subject.ts', () => {
         });
       });
 
-      describe('Pull Request Reviews - Extract Linked Issues', () => {
+      it('Pull Requests With labels', async () => {
+        nock('https://api.github.com')
+          .get('/repos/gitify-app/notifications-test/pulls/1')
+          .reply(200, {
+            state: 'open',
+            draft: false,
+            merged: false,
+            user: mockAuthor,
+            labels: [{ name: 'enhancement' }],
+          });
+
+        nock('https://api.github.com')
+          .get('/repos/gitify-app/notifications-test/issues/comments/302888448')
+          .reply(200, { user: mockCommenter });
+
+        nock('https://api.github.com')
+          .get('/repos/gitify-app/notifications-test/pulls/1/reviews')
+          .reply(200, []);
+
+        const result = await getGitifySubjectDetails(mockNotification);
+
+        expect(result).toEqual({
+          state: 'open',
+          user: {
+            login: mockCommenter.login,
+            html_url: mockCommenter.html_url,
+            avatar_url: mockCommenter.avatar_url,
+            type: mockCommenter.type,
+          },
+          reviews: null,
+          labels: ['enhancement'],
+          linkedIssues: [],
+        });
+      });
+
+      describe('Pull Request With Linked Issues', () => {
         it('returns empty if no pr body', () => {
           const result = parseLinkedIssuesFromPrBody(null);
           expect(result).toEqual([]);
@@ -1078,5 +1202,6 @@ function mockDiscussionNode(
       nodes: [],
       totalCount: 0,
     },
+    labels: null,
   };
 }