refactor: use state for inferred checksuite status (gitify-app#848)

* refactor: use state to pass checksuite status around

* refactor tests

Author: setchy

src/hooks/useNotifications.test.ts

@@ -192,8 +192,8 @@ describe('hooks/useNotifications.ts', () => {
           {
             id: 1,
             subject: {
-              title: 'This is a Discussion.',
-              type: 'Discussion',
+              title: 'This is a check suite workflow.',
+              type: 'CheckSuite',
               url: 'https://api.github.com/1',
             },
             repository: {
@@ -204,25 +204,37 @@ describe('hooks/useNotifications.ts', () => {
           {
             id: 2,
             subject: {
-              title: 'This is an Issue.',
-              type: 'Issue',
+              title: 'This is a Discussion.',
+              type: 'Discussion',
               url: 'https://api.github.com/2',
             },
+            repository: {
+              full_name: 'some/repo',
+            },
+            updated_at: '2024-02-26T00:00:00Z',
           },
           {
             id: 3,
             subject: {
-              title: 'This is a Pull Request.',
-              type: 'PullRequest',
+              title: 'This is an Issue.',
+              type: 'Issue',
               url: 'https://api.github.com/3',
             },
           },
           {
             id: 4,
+            subject: {
+              title: 'This is a Pull Request.',
+              type: 'PullRequest',
+              url: 'https://api.github.com/4',
+            },
+          },
+          {
+            id: 5,
             subject: {
               title: 'This is an invitation.',
               type: 'RepositoryInvitation',
-              url: 'https://api.github.com/4',
+              url: 'https://api.github.com/5',
             },
           },
         ];
@@ -249,18 +261,15 @@ describe('hooks/useNotifications.ts', () => {
               },
             },
           });
-        nock('https://api.github.com')
-          .get('/2')
-          .reply(200, { state: 'closed', merged: true });
         nock('https://api.github.com')
           .get('/3')
-          .reply(200, { state: 'closed', merged: false });
+          .reply(200, { state: 'closed', merged: true });
         nock('https://api.github.com')
           .get('/4')
-          .reply(200, { state: 'open', draft: false });
+          .reply(200, { state: 'closed', merged: false });
         nock('https://api.github.com')
           .get('/5')
-          .reply(200, { state: 'open', draft: true });
+          .reply(200, { state: 'open', draft: false });
 
         const { result } = renderHook(() => useNotifications(true));
 
@@ -277,7 +286,7 @@ describe('hooks/useNotifications.ts', () => {
           expect(result.current.notifications[0].hostname).toBe('github.com');
         });
 
-        expect(result.current.notifications[0].notifications.length).toBe(4);
+        expect(result.current.notifications[0].notifications.length).toBe(5);
       });
     });
   });

src/typesGithub.ts

@@ -46,6 +46,7 @@ export type IssueStateReasonType = 'completed' | 'not_planned' | 'reopened';
 export type PullRequestStateType = 'closed' | 'draft' | 'merged' | 'open';
 
 export type StateType =
+  | CheckSuiteStatus
   | DiscussionStateType
   | IssueStateType
   | IssueStateReasonType

src/utils/github-api.test.ts

@@ -29,38 +29,39 @@ describe('formatReason', () => {
 describe('getNotificationTypeIcon', () => {
   it('should get the notification type icon', () => {
     expect(
-      getNotificationTypeIcon(createSubjectMock({ type: 'CheckSuite' }))
-        .displayName,
+      getNotificationTypeIcon(
+        createSubjectMock({ type: 'CheckSuite', state: null }),
+      ).displayName,
     ).toBe('SyncIcon');
     expect(
       getNotificationTypeIcon(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow cancelled for main branch',
+          state: 'cancelled',
         }),
       ).displayName,
     ).toBe('StopIcon');
     expect(
       getNotificationTypeIcon(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow failed for main branch',
+          state: 'failure',
         }),
       ).displayName,
     ).toBe('XIcon');
     expect(
       getNotificationTypeIcon(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow skipped for main branch',
+          state: 'skipped',
         }),
       ).displayName,
     ).toBe('SkipIcon');
     expect(
       getNotificationTypeIcon(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow succeeded for main branch',
+          state: 'success',
         }),
       ).displayName,
     ).toBe('CheckIcon');
@@ -195,15 +196,15 @@ describe('getNotificationTypeIconColor', () => {
       getNotificationTypeIconColor(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow cancelled for main branch',
+          state: 'cancelled',
         }),
       ),
     ).toMatchSnapshot();
     expect(
       getNotificationTypeIconColor(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow failed for main branch',
+          state: 'failure',
         }),
       ),
     ).toMatchSnapshot();
@@ -212,23 +213,23 @@ describe('getNotificationTypeIconColor', () => {
       getNotificationTypeIconColor(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow skipped for main branch',
+          state: 'skipped',
         }),
       ),
     ).toMatchSnapshot();
     expect(
       getNotificationTypeIconColor(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'Workflow succeeded for main branch',
+          state: 'success',
         }),
       ),
     ).toMatchSnapshot();
     expect(
       getNotificationTypeIconColor(
         createSubjectMock({
           type: 'CheckSuite',
-          title: 'unknown state',
+          state: null,
         }),
       ),
     ).toMatchSnapshot();

src/utils/github-api.ts

@@ -24,7 +24,7 @@ import {
   TagIcon,
   XIcon,
 } from '@primer/octicons-react';
-import { CheckSuiteStatus, Reason, Subject } from '../typesGithub';
+import { Reason, Subject } from '../typesGithub';
 
 // prettier-ignore
 const DESCRIPTIONS = {
@@ -92,9 +92,7 @@ export function getNotificationTypeIcon(
 ): React.FC<OcticonProps> {
   switch (subject.type) {
     case 'CheckSuite':
-      const checkSuiteState = inferCheckSuiteStatus(subject.title);
-
-      switch (checkSuiteState) {
+      switch (subject.state) {
         case 'cancelled':
           return StopIcon;
         case 'failure':
@@ -158,32 +156,19 @@ export function getNotificationTypeIcon(
 }
 
 export function getNotificationTypeIconColor(subject: Subject): string {
-  if (subject.type === 'CheckSuite') {
-    const checkSuiteState = inferCheckSuiteStatus(subject.title);
-
-    switch (checkSuiteState) {
-      case 'cancelled':
-        return 'text-gray-500';
-      case 'failure':
-        return 'text-red-500';
-      case 'skipped':
-        return 'text-gray-500';
-      case 'success':
-        return 'text-green-500';
-      default:
-        return 'text-gray-300';
-    }
-  }
-
   switch (subject.state) {
     case 'ANSWERED':
       return 'text-green-500';
+    case 'cancelled':
+      return 'text-gray-500';
     case 'closed':
       return 'text-red-500';
     case 'completed':
       return 'text-purple-500';
     case 'draft':
       return 'text-gray-600';
+    case 'failure':
+      return 'text-red-500';
     case 'merged':
       return 'text-purple-500';
     case 'not_planned':
@@ -194,31 +179,11 @@ export function getNotificationTypeIconColor(subject: Subject): string {
       return 'text-green-500';
     case 'RESOLVED':
       return 'text-purple-500';
+    case 'skipped':
+      return 'text-gray-500';
+    case 'success':
+      return 'text-green-500';
     default:
       return 'text-gray-300';
   }
 }
-
-export function inferCheckSuiteStatus(title: string): CheckSuiteStatus {
-  if (title) {
-    const lowerTitle = title.toLowerCase();
-
-    if (lowerTitle.includes('cancelled for')) {
-      return 'cancelled';
-    }
-
-    if (lowerTitle.includes('failed for')) {
-      return 'failure';
-    }
-
-    if (lowerTitle.includes('skipped for')) {
-      return 'skipped';
-    }
-
-    if (lowerTitle.includes('succeeded for')) {
-      return 'success';
-    }
-  }
-
-  return null;
-}

src/utils/state.test.ts

@@ -4,6 +4,7 @@ import nock from 'nock';
 import { mockAccounts } from '../__mocks__/mock-state';
 import { mockedSingleNotification } from '../__mocks__/mockedData';
 import {
+  getCheckSuiteState,
   getDiscussionState,
   getIssueState,
   getPullRequestState,
@@ -15,6 +16,78 @@ describe('utils/state.ts', () => {
     axios.defaults.adapter = 'http';
   });
 
+  describe('getCheckSuiteState', () => {
+    it('cancelled check suite state', async () => {
+      const mockNotification = {
+        ...mockedSingleNotification,
+        subject: {
+          ...mockedSingleNotification.subject,
+          title: 'Demo workflow run cancelled for main branch',
+        },
+      };
+
+      const result = getCheckSuiteState(mockNotification);
+
+      expect(result).toBe('cancelled');
+    });
+
+    it('failed check suite state', async () => {
+      const mockNotification = {
+        ...mockedSingleNotification,
+        subject: {
+          ...mockedSingleNotification.subject,
+          title: 'Demo workflow run failed for main branch',
+        },
+      };
+
+      const result = getCheckSuiteState(mockNotification);
+
+      expect(result).toBe('failure');
+    });
+
+    it('skipped check suite state', async () => {
+      const mockNotification = {
+        ...mockedSingleNotification,
+        subject: {
+          ...mockedSingleNotification.subject,
+          title: 'Demo workflow run skipped for main branch',
+        },
+      };
+
+      const result = getCheckSuiteState(mockNotification);
+
+      expect(result).toBe('skipped');
+    });
+
+    it('successful check suite state', async () => {
+      const mockNotification = {
+        ...mockedSingleNotification,
+        subject: {
+          ...mockedSingleNotification.subject,
+          title: 'Demo workflow run succeeded for main branch',
+        },
+      };
+
+      const result = getCheckSuiteState(mockNotification);
+
+      expect(result).toBe('success');
+    });
+
+    it('unknown check suite state', async () => {
+      const mockNotification = {
+        ...mockedSingleNotification,
+        subject: {
+          ...mockedSingleNotification.subject,
+          title: 'Demo workflow run for main branch',
+        },
+      };
+
+      const result = getCheckSuiteState(mockNotification);
+
+      expect(result).toBeNull();
+    });
+  });
+
   describe('getDiscussionState', () => {
     it('answered discussion state', async () => {
       const mockNotification = {