refactor: set reason details upon GitifyNotification transformation

src/renderer/__mocks__/notifications-mocks.ts

@@ -2,6 +2,7 @@ import { Constants } from '../constants';
 import type {
   AccountNotifications,
   GitifyNotification,
+  GitifyReason,
   GitifyRepository,
   GitifySubject,
   Hostname,
@@ -53,6 +54,11 @@ export function createPartialMockNotification(
       user: mockGitifyUser,
       hasRequiredScopes: true,
     },
+    reason: {
+      code: 'subscribed',
+      title: 'Updated',
+      description: "You're watching the repository.",
+    } as GitifyReason,
     subject: subject as GitifySubject,
     repository: {
       name: 'notifications-test',

src/renderer/components/notifications/NotificationFooter.tsx

@@ -5,7 +5,6 @@ import { RelativeTime, Stack, Text } from '@primer/react';
 import { type GitifyNotification, Opacity, Size } from '../../types';
 import { cn } from '../../utils/cn';
 import { openUserProfile } from '../../utils/links';
-import { getReasonDetails } from '../../utils/reason';
 import { AvatarWithFallback } from '../avatars/AvatarWithFallback';
 import { MetricGroup } from '../metrics/MetricGroup';
 
@@ -16,8 +15,6 @@ interface NotificationFooterProps {
 export const NotificationFooter: FC<NotificationFooterProps> = ({
   notification,
 }: NotificationFooterProps) => {
-  const reason = getReasonDetails(notification.reason);
-
   return (
     <Stack
       align="center"
@@ -57,8 +54,8 @@ export const NotificationFooter: FC<NotificationFooterProps> = ({
       )}
 
       <Stack direction="horizontal" gap="none">
-        <Text className="pr-1" title={reason.description}>
-          {reason.title}
+        <Text className="pr-1" title={notification.reason.description}>
+          {notification.reason.title}
         </Text>
         <RelativeTime datetime={notification.updatedAt} />
       </Stack>

src/renderer/types.ts

@@ -277,7 +277,7 @@ export interface GitifyNotification {
   /** When the notification was last updated */
   updatedAt: string;
   /** Reason for receiving the notification */
-  reason: Reason;
+  reason: GitifyReason;
   /** Subject details (what the notification is about) */
   subject: GitifySubject;
   /** Repository context */
@@ -288,6 +288,18 @@ export interface GitifyNotification {
   order: number;
 }
 
+/**
+ * Notification reason details
+ */
+export interface GitifyReason {
+  /** Reason code */
+  code: Reason;
+  /** Reason title */
+  title: string;
+  /** Reason description */
+  description: string;
+}
+
 /**
  * Subject information combining REST and GraphQL enriched data.
  */

src/renderer/utils/api/__mocks__/response-mocks.ts

@@ -51,7 +51,11 @@ export const mockGitHubNotifications: GitifyNotification[] = [
     order: 0,
     id: '138661096',
     unread: true,
-    reason: 'subscribed',
+    reason: {
+      code: 'subscribed',
+      title: 'Updated',
+      description: "You're watching the repository.",
+    },
     updatedAt: '2017-05-20T17:51:57Z',
     subject: {
       title: 'I am a robot and this is a test!',
@@ -83,7 +87,11 @@ export const mockGitHubNotifications: GitifyNotification[] = [
     order: 1,
     id: '148827438',
     unread: true,
-    reason: 'author',
+    reason: {
+      code: 'author',
+      title: 'Authored',
+      description: 'You created the thread.',
+    },
     updatedAt: '2017-05-20T17:06:34Z',
     subject: {
       title: 'Improve the UI',
@@ -119,7 +127,11 @@ export const mockEnterpriseNotifications: GitifyNotification[] = [
     order: 0,
     id: '3',
     unread: true,
-    reason: 'subscribed',
+    reason: {
+      code: 'subscribed',
+      title: 'Updated',
+      description: "You're watching the repository.",
+    },
     updatedAt: '2017-05-20T13:02:48Z',
     subject: {
       title: 'Release 0.0.1',
@@ -136,7 +148,11 @@ export const mockEnterpriseNotifications: GitifyNotification[] = [
     order: 1,
     id: '4',
     unread: true,
-    reason: 'subscribed',
+    reason: {
+      code: 'subscribed',
+      title: 'Updated',
+      description: "You're watching the repository.",
+    },
     updatedAt: '2017-05-20T15:52:20Z',
     subject: {
       title: 'Bump Version',

src/renderer/utils/api/transform.ts

@@ -2,13 +2,15 @@ import type {
   Account,
   GitifyNotification,
   GitifyOwner,
+  GitifyReason,
   GitifyRepository,
   GitifySubject,
   Link,
   Reason,
   SubjectType,
   UserType,
 } from '../../types';
+import { getReasonDetails } from '../reason';
 import type { RawGitHubNotification } from './types';
 
 /**
@@ -27,14 +29,24 @@ export function transformNotification(
     id: raw.id,
     unread: raw.unread,
     updatedAt: raw.updated_at,
-    reason: raw.reason as Reason,
+    reason: transformReason(raw.reason),
     subject: transformSubject(raw.subject),
     repository: transformRepository(raw.repository),
     account,
     order,
   };
 }
 
+function transformReason(raw: RawGitHubNotification['reason']): GitifyReason {
+  const reasonDetails = getReasonDetails(raw as Reason);
+
+  return {
+    code: raw as Reason,
+    title: reasonDetails.title,
+    description: reasonDetails.description,
+  };
+}
+
 function transformSubject(
   raw: RawGitHubNotification['subject'],
 ): GitifySubject {

src/renderer/utils/notifications/filters/filter.test.ts

@@ -76,8 +76,8 @@ describe('renderer/utils/notifications/filters/filter.ts', () => {
       });
 
       it('should filter notifications by reasons when provided', async () => {
-        mockNotifications[0].reason = 'subscribed';
-        mockNotifications[1].reason = 'manual';
+        mockNotifications[0].reason.code = 'subscribed';
+        mockNotifications[1].reason.code = 'manual';
         const result = filterBaseNotifications(mockNotifications, {
           ...mockSettings,
           filterReasons: ['manual'],

src/renderer/utils/notifications/filters/reason.ts

@@ -42,6 +42,6 @@ export const reasonFilter: Filter<Reason> = {
     notification: GitifyNotification,
     reason: Reason,
   ): boolean {
-    return notification.reason === reason;
+    return notification.reason.code === reason;
   },
 };