diff --git a/src/typesGithub.ts b/src/typesGithub.ts
index 3f4ac637f..98dfa7f51 100644
--- a/src/typesGithub.ts
+++ b/src/typesGithub.ts
@@ -28,8 +28,11 @@ export type IssueStateType =
   | 'completed'
   | 'reopened'
   | 'not_planned';
+
 export type PullRequestStateType = 'closed' | 'open' | 'merged' | 'draft';
+
 export type StateType = IssueStateType | PullRequestStateType;
+
 export type ViewerSubscription = 'IGNORED' | 'SUBSCRIBED' | 'UNSUBSCRIBED';
 
 export interface Notification {
diff --git a/src/utils/__snapshots__/github-api.test.ts.snap b/src/utils/__snapshots__/github-api.test.ts.snap
index 8b1b1033a..327ef366d 100644
--- a/src/utils/__snapshots__/github-api.test.ts.snap
+++ b/src/utils/__snapshots__/github-api.test.ts.snap
@@ -1,5 +1,26 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
+exports[`./utils/github-api.ts should format the notification color 1`] = `"text-red-500"`;
+
+exports[`./utils/github-api.ts should format the notification color 2`] = `"text-purple-500"`;
+
+exports[`./utils/github-api.ts should format the notification color 3`] = `"text-gray-600"`;
+
+exports[`./utils/github-api.ts should format the notification color 4`] = `"text-purple-500"`;
+
+exports[`./utils/github-api.ts should format the notification color 5`] = `"text-gray-300"`;
+
+exports[`./utils/github-api.ts should format the notification color 6`] = `"text-green-500"`;
+
+exports[`./utils/github-api.ts should format the notification color 7`] = `"text-green-500"`;
+
+exports[`./utils/github-api.ts should format the notification color 8`] = `
+{
+  "description": "The reason for this notification is not supported by the app.",
+  "type": "Unknown",
+}
+`;
+
 exports[`./utils/github-api.ts should format the notification reason 1`] = `
 {
   "description": "You were assigned to the issue.",
diff --git a/src/utils/github-api.test.ts b/src/utils/github-api.test.ts
index fec6cca3b..25ccac95c 100644
--- a/src/utils/github-api.test.ts
+++ b/src/utils/github-api.test.ts
@@ -1,4 +1,8 @@
-import { formatReason, getNotificationTypeIcon } from './github-api';
+import {
+  formatReason,
+  getNotificationTypeIcon,
+  getNotificationTypeIconColor,
+} from './github-api';
 import { Reason, SubjectType } from '../typesGithub';
 
 describe('./utils/github-api.ts', () => {
@@ -62,4 +66,15 @@ describe('./utils/github-api.ts', () => {
       'QuestionIcon',
     );
   });
+
+  it('should format the notification color', () => {
+    expect(getNotificationTypeIconColor('closed')).toMatchSnapshot();
+    expect(getNotificationTypeIconColor('completed')).toMatchSnapshot();
+    expect(getNotificationTypeIconColor('draft')).toMatchSnapshot();
+    expect(getNotificationTypeIconColor('merged')).toMatchSnapshot();
+    expect(getNotificationTypeIconColor('not_planned')).toMatchSnapshot();
+    expect(getNotificationTypeIconColor('open')).toMatchSnapshot();
+    expect(getNotificationTypeIconColor('reopened')).toMatchSnapshot();
+    expect(formatReason('something_else_unknown' as Reason)).toMatchSnapshot();
+  });
 });
diff --git a/src/utils/github-api.ts b/src/utils/github-api.ts
index 462f39e78..ea1adca02 100644
--- a/src/utils/github-api.ts
+++ b/src/utils/github-api.ts
@@ -119,18 +119,18 @@ export function getNotificationTypeIconColor(state: StateType): string {
   switch (state) {
     case 'closed':
       return 'text-red-500';
-    case 'open':
-      return 'text-green-500';
-    case 'merged':
-      return 'text-purple-500';
-    case 'reopened':
-      return 'text-green-500';
-    case 'not_planned':
-      return 'text-gray-300';
     case 'completed':
       return 'text-purple-500';
     case 'draft':
       return 'text-gray-600';
+    case 'merged':
+      return 'text-purple-500';
+    case 'not_planned':
+      return 'text-gray-300';
+    case 'open':
+      return 'text-green-500';
+    case 'reopened':
+      return 'text-green-500';
     default:
       return 'text-gray-300';
   }