feat: better notification type icons (#748)

Author: adufr

src/components/NotificationRow.tsx

@@ -49,7 +49,10 @@ export const NotificationRow: React.FC<IProps> = ({
   };
 
   const reason = formatReason(notification.reason);
-  const NotificationIcon = getNotificationTypeIcon(notification.subject.type);
+  const NotificationIcon = getNotificationTypeIcon(
+    notification.subject.type,
+    notification.subject.state,
+  );
   const iconColor = getNotificationTypeIconColor(notification.subject.state);
   const realIconColor = settings
     ? (settings.colors && iconColor) || ''

src/utils/github-api.test.ts

@@ -27,9 +27,30 @@ describe('./utils/github-api.ts', () => {
     expect(getNotificationTypeIcon('Issue').displayName).toBe(
       'IssueOpenedIcon',
     );
+    expect(getNotificationTypeIcon('Issue', 'draft').displayName).toBe(
+      'IssueDraftIcon',
+    );
+    expect(getNotificationTypeIcon('Issue', 'closed').displayName).toBe(
+      'IssueClosedIcon',
+    );
+    expect(getNotificationTypeIcon('Issue', 'completed').displayName).toBe(
+      'IssueClosedIcon',
+    );
+    expect(getNotificationTypeIcon('Issue', 'reopened').displayName).toBe(
+      'IssueReopenedIcon',
+    );
     expect(getNotificationTypeIcon('PullRequest').displayName).toBe(
       'GitPullRequestIcon',
     );
+    expect(getNotificationTypeIcon('PullRequest', 'draft').displayName).toBe(
+      'GitPullRequestDraftIcon',
+    );
+    expect(getNotificationTypeIcon('PullRequest', 'closed').displayName).toBe(
+      'GitPullRequestClosedIcon',
+    );
+    expect(getNotificationTypeIcon('PullRequest', 'merged').displayName).toBe(
+      'GitMergeIcon',
+    );
     expect(getNotificationTypeIcon('Release').displayName).toBe('TagIcon');
     expect(
       getNotificationTypeIcon('RepositoryVulnerabilityAlert').displayName,

src/utils/github-api.ts

@@ -2,8 +2,14 @@ import {
   AlertIcon,
   CommentDiscussionIcon,
   GitCommitIcon,
+  GitMergeIcon,
+  GitPullRequestClosedIcon,
+  GitPullRequestDraftIcon,
   GitPullRequestIcon,
+  IssueClosedIcon,
+  IssueDraftIcon,
   IssueOpenedIcon,
+  IssueReopenedIcon,
   MailIcon,
   OcticonProps,
   QuestionIcon,
@@ -66,6 +72,7 @@ export function formatReason(reason: Reason): {
 
 export function getNotificationTypeIcon(
   type: SubjectType,
+  state?: StateType,
 ): React.FC<OcticonProps> {
   switch (type) {
     case 'CheckSuite':
@@ -75,9 +82,28 @@ export function getNotificationTypeIcon(
     case 'Discussion':
       return CommentDiscussionIcon;
     case 'Issue':
-      return IssueOpenedIcon;
+      switch (state) {
+        case 'draft':
+          return IssueDraftIcon;
+        case 'closed':
+        case 'completed':
+          return IssueClosedIcon;
+        case 'reopened':
+          return IssueReopenedIcon;
+        default:
+          return IssueOpenedIcon;
+      }
     case 'PullRequest':
-      return GitPullRequestIcon;
+      switch (state) {
+        case 'draft':
+          return GitPullRequestDraftIcon;
+        case 'closed':
+          return GitPullRequestClosedIcon;
+        case 'merged':
+          return GitMergeIcon;
+        default:
+          return GitPullRequestIcon;
+      }
     case 'Release':
       return TagIcon;
     case 'RepositoryInvitation':