From fa653591afa120adc84e75af5455b78230238298 Mon Sep 17 00:00:00 2001
From: Arthur Dufour <dufourarthur.perso@gmail.com>
Date: Sun, 18 Feb 2024 13:13:23 +0100
Subject: [PATCH 1/3] feat: mark repository as done

---
 src/components/Repository.tsx | 22 +++++++++++++---
 src/context/App.tsx           |  9 +++++++
 src/hooks/useNotifications.ts | 47 +++++++++++++++++++++++++++++++++++
 3 files changed, 75 insertions(+), 3 deletions(-)

diff --git a/src/components/Repository.tsx b/src/components/Repository.tsx
index 3cdb5820a..7cf0ed8ca 100644
--- a/src/components/Repository.tsx
+++ b/src/components/Repository.tsx
@@ -1,5 +1,5 @@
 import React, { useCallback, useContext } from 'react';
-import { ReadIcon } from '@primer/octicons-react';
+import { ReadIcon, CheckIcon } from '@primer/octicons-react';
 import { CSSTransition, TransitionGroup } from 'react-transition-group';
 
 import { AppContext } from '../context/App';
@@ -18,7 +18,8 @@ export const RepositoryNotifications: React.FC<IProps> = ({
   repoNotifications,
   hostname,
 }) => {
-  const { markRepoNotifications } = useContext(AppContext);
+  const { markRepoNotifications, markRepoNotificationsDone } =
+    useContext(AppContext);
 
   const openBrowser = useCallback(() => {
     const url = repoNotifications[0].repository.html_url;
@@ -30,6 +31,11 @@ export const RepositoryNotifications: React.FC<IProps> = ({
     markRepoNotifications(repoSlug, hostname);
   }, [repoNotifications, hostname]);
 
+  const markRepoAsDone = useCallback(() => {
+    const repoSlug = repoNotifications[0].repository.full_name;
+    markRepoNotificationsDone(repoSlug, hostname);
+  }, [repoNotifications, hostname]);
+
   const avatarUrl = repoNotifications[0].repository.owner.avatar_url;
 
   return (
@@ -40,7 +46,17 @@ export const RepositoryNotifications: React.FC<IProps> = ({
           <span onClick={openBrowser}>{repoName}</span>
         </div>
 
-        <div className="flex justify-center items-center">
+        <div className="flex justify-center items-center gap-2">
+          <button
+            className="focus:outline-none h-full hover:text-green-500"
+            title="Mark Repository as Done"
+            onClick={markRepoAsDone}
+          >
+            <CheckIcon size={16} aria-label="Mark Repository as Done" />
+          </button>
+
+          <div className="w-[14px]" />
+
           <button
             className="focus:outline-none h-full hover:text-green-500"
             title="Mark Repository as Read"
diff --git a/src/context/App.tsx b/src/context/App.tsx
index d009a1604..2573e8fa1 100644
--- a/src/context/App.tsx
+++ b/src/context/App.tsx
@@ -56,6 +56,7 @@ interface AppContextState {
   markNotificationDone: (id: string, hostname: string) => Promise<void>;
   unsubscribeNotification: (id: string, hostname: string) => Promise<void>;
   markRepoNotifications: (id: string, hostname: string) => Promise<void>;
+  markRepoNotificationsDone: (id: string, hostname: string) => Promise<void>;
 
   settings: SettingsState;
   updateSetting: (name: keyof SettingsState, value: any) => void;
@@ -75,6 +76,7 @@ export const AppProvider = ({ children }: { children: React.ReactNode }) => {
     markNotificationDone,
     unsubscribeNotification,
     markRepoNotifications,
+    markRepoNotificationsDone,
   } = useNotifications(settings.colors);
 
   useEffect(() => {
@@ -197,6 +199,12 @@ export const AppProvider = ({ children }: { children: React.ReactNode }) => {
     [accounts, notifications],
   );
 
+  const markRepoNotificationsDoneWithAccounts = useCallback(
+    async (repoSlug: string, hostname: string) =>
+      await markRepoNotificationsDone(accounts, repoSlug, hostname),
+    [accounts, notifications],
+  );
+
   return (
     <AppContext.Provider
       value={{
@@ -215,6 +223,7 @@ export const AppProvider = ({ children }: { children: React.ReactNode }) => {
         markNotificationDone: markNotificationDoneWithAccounts,
         unsubscribeNotification: unsubscribeNotificationWithAccounts,
         markRepoNotifications: markRepoNotificationsWithAccounts,
+        markRepoNotificationsDone: markRepoNotificationsDoneWithAccounts,
 
         settings,
         updateSetting,
diff --git a/src/hooks/useNotifications.ts b/src/hooks/useNotifications.ts
index 41875fb8b..a7b2f6cc7 100644
--- a/src/hooks/useNotifications.ts
+++ b/src/hooks/useNotifications.ts
@@ -43,6 +43,11 @@ interface NotificationsState {
     repoSlug: string,
     hostname: string,
   ) => Promise<void>;
+  markRepoNotificationsDone: (
+    accounts: AuthState,
+    repoSlug: string,
+    hostname: string,
+  ) => Promise<void>;
   isFetching: boolean;
   requestFailed: boolean;
 }
@@ -312,6 +317,47 @@ export const useNotifications = (colors: boolean): NotificationsState => {
     [notifications],
   );
 
+  const markRepoNotificationsDone = useCallback(
+    async (accounts, repoSlug, hostname) => {
+      setIsFetching(true);
+
+      try {
+        const accountIndex = notifications.findIndex(
+          (accountNotifications) => accountNotifications.hostname === hostname,
+        );
+
+        if (accountIndex !== -1) {
+          const notificationsToRemove = notifications[
+            accountIndex
+          ].notifications.filter(
+            (notification) => notification.repository.full_name === repoSlug,
+          );
+
+          for (const notification of notificationsToRemove) {
+            await markNotificationDone(
+              accounts,
+              notification.id,
+              notifications[accountIndex].hostname,
+            );
+          }
+        }
+
+        const updatedNotifications = removeNotifications(
+          repoSlug,
+          notifications,
+          hostname,
+        );
+
+        setNotifications(updatedNotifications);
+        setTrayIconColor(updatedNotifications);
+        setIsFetching(false);
+      } catch (err) {
+        setIsFetching(false);
+      }
+    },
+    [notifications],
+  );
+
   return {
     isFetching,
     requestFailed,
@@ -322,5 +368,6 @@ export const useNotifications = (colors: boolean): NotificationsState => {
     markNotificationDone,
     unsubscribeNotification,
     markRepoNotifications,
+    markRepoNotificationsDone,
   };
 };

From 344ac52b34c3c4f7acb75c094c9f46fedcfa850f Mon Sep 17 00:00:00 2001
From: Arthur Dufour <dufourarthur.perso@gmail.com>
Date: Sun, 18 Feb 2024 13:13:55 +0100
Subject: [PATCH 2/3] tests: add tests for `markRepoNotificationsDone`

---
 src/components/Repository.test.tsx            |  20 +++-
 .../__snapshots__/Repository.test.tsx.snap    |  34 +++++-
 src/hooks/useNotifications.test.ts            | 103 ++++++++++++++++++
 3 files changed, 154 insertions(+), 3 deletions(-)

diff --git a/src/components/Repository.test.tsx b/src/components/Repository.test.tsx
index 58a8fdb0e..9eaa7aec5 100644
--- a/src/components/Repository.test.tsx
+++ b/src/components/Repository.test.tsx
@@ -14,6 +14,7 @@ jest.mock('./NotificationRow', () => ({
 
 describe('components/Repository.tsx', () => {
   const markRepoNotifications = jest.fn();
+  const markRepoNotificationsDone = jest.fn();
 
   const props = {
     hostname: 'github.com',
@@ -52,17 +53,32 @@ describe('components/Repository.tsx', () => {
   });
 
   it('should mark a repo as read', function () {
-    const { getByRole } = render(
+    const { getByTitle } = render(
       <AppContext.Provider value={{ markRepoNotifications }}>
         <RepositoryNotifications {...props} />
       </AppContext.Provider>,
     );
 
-    fireEvent.click(getByRole('button'));
+    fireEvent.click(getByTitle('Mark Repository as Read'));
 
     expect(markRepoNotifications).toHaveBeenCalledWith(
       'manosim/notifications-test',
       'github.com',
     );
   });
+
+  it('should mark a repo as done', function () {
+    const { getByTitle } = render(
+      <AppContext.Provider value={{ markRepoNotificationsDone }}>
+        <RepositoryNotifications {...props} />
+      </AppContext.Provider>,
+    );
+
+    fireEvent.click(getByTitle('Mark Repository as Done'));
+
+    expect(markRepoNotificationsDone).toHaveBeenCalledWith(
+      'manosim/notifications-test',
+      'github.com',
+    );
+  });
 });
diff --git a/src/components/__snapshots__/Repository.test.tsx.snap b/src/components/__snapshots__/Repository.test.tsx.snap
index 2960f4ad7..8222bc734 100644
--- a/src/components/__snapshots__/Repository.test.tsx.snap
+++ b/src/components/__snapshots__/Repository.test.tsx.snap
@@ -19,8 +19,40 @@ exports[`components/Repository.tsx should render itself & its children 1`] = `
       </span>
     </div>
     <div
-      className="flex justify-center items-center"
+      className="flex justify-center items-center gap-2"
     >
+      <button
+        className="focus:outline-none h-full hover:text-green-500"
+        onClick={[Function]}
+        title="Mark Repository as Done"
+      >
+        <svg
+          aria-hidden="false"
+          aria-label="Mark Repository as Done"
+          className="octicon octicon-check"
+          fill="currentColor"
+          focusable="false"
+          height={16}
+          role="img"
+          style={
+            {
+              "display": "inline-block",
+              "overflow": "visible",
+              "userSelect": "none",
+              "verticalAlign": "text-bottom",
+            }
+          }
+          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>
+      <div
+        className="w-[14px]"
+      />
       <button
         className="focus:outline-none h-full hover:text-green-500"
         onClick={[Function]}
diff --git a/src/hooks/useNotifications.test.ts b/src/hooks/useNotifications.test.ts
index c6f2b753d..cc0e77c0c 100644
--- a/src/hooks/useNotifications.test.ts
+++ b/src/hooks/useNotifications.test.ts
@@ -636,4 +636,107 @@ describe('hooks/useNotifications.ts', () => {
       });
     });
   });
+
+  describe('markRepoNotificationsDone', () => {
+    const repoSlug = 'manosim/gitify';
+    const id = 'notification-123';
+
+    describe('github.com', () => {
+      const accounts = { ...mockAccounts, enterpriseAccounts: [] };
+      const hostname = 'github.com';
+
+      it("should mark a repository's notifications as done with success - github.com", async () => {
+        nock('https://api.github.com/')
+          .delete(`/notifications/threads/${id}`)
+          .reply(200);
+
+        const { result } = renderHook(() => useNotifications(false));
+
+        act(() => {
+          result.current.markRepoNotificationsDone(
+            accounts,
+            repoSlug,
+            hostname,
+          );
+        });
+
+        await waitFor(() => {
+          expect(result.current.isFetching).toBe(false);
+        });
+
+        expect(result.current.notifications.length).toBe(0);
+      });
+
+      it("should mark a repository's notifications as done with failure - github.com", async () => {
+        nock('https://api.github.com/')
+          .delete(`/notifications/threads/${id}`)
+          .reply(400);
+
+        const { result } = renderHook(() => useNotifications(false));
+
+        act(() => {
+          result.current.markRepoNotificationsDone(
+            accounts,
+            repoSlug,
+            hostname,
+          );
+        });
+
+        await waitFor(() => {
+          expect(result.current.isFetching).toBe(false);
+        });
+
+        expect(result.current.notifications.length).toBe(0);
+      });
+    });
+
+    describe('enterprise', () => {
+      const accounts = { ...mockAccounts, token: null };
+      const hostname = 'github.gitify.io';
+
+      it("should mark a repository's notifications as done with success - enterprise", async () => {
+        nock('https://api.github.com/')
+          .delete(`/notifications/threads/${id}`)
+          .reply(200);
+
+        const { result } = renderHook(() => useNotifications(false));
+
+        act(() => {
+          result.current.markRepoNotificationsDone(
+            accounts,
+            repoSlug,
+            hostname,
+          );
+        });
+
+        await waitFor(() => {
+          expect(result.current.isFetching).toBe(false);
+        });
+
+        expect(result.current.notifications.length).toBe(0);
+      });
+
+      it("should mark a repository's notifications as done with failure - enterprise", async () => {
+        nock('https://api.github.com/')
+          .delete(`/notifications/threads/${id}`)
+          .reply(400);
+
+        const { result } = renderHook(() => useNotifications(false));
+
+        act(() => {
+          result.current.markRepoNotificationsDone(
+            accounts,
+            repoSlug,
+            hostname,
+          );
+        });
+
+        await waitFor(() => {
+          expect(result.current.isFetching).toBe(false);
+        });
+
+        expect(result.current.notifications.length).toBe(0);
+      });
+    });
+  });
 });

From bb609b9b829494e9a1b15ecd315a541d74d1d960 Mon Sep 17 00:00:00 2001
From: Arthur Dufour <dufourarthur.perso@gmail.com>
Date: Mon, 19 Feb 2024 13:02:03 +0100
Subject: [PATCH 3/3] refactor: parallelize calls

---
 src/hooks/useNotifications.ts | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/src/hooks/useNotifications.ts b/src/hooks/useNotifications.ts
index a7b2f6cc7..e1194b96e 100644
--- a/src/hooks/useNotifications.ts
+++ b/src/hooks/useNotifications.ts
@@ -333,13 +333,15 @@ export const useNotifications = (colors: boolean): NotificationsState => {
             (notification) => notification.repository.full_name === repoSlug,
           );
 
-          for (const notification of notificationsToRemove) {
-            await markNotificationDone(
-              accounts,
-              notification.id,
-              notifications[accountIndex].hostname,
-            );
-          }
+          await Promise.all(
+            notificationsToRemove.map((notification) =>
+              markNotificationDone(
+                accounts,
+                notification.id,
+                notifications[accountIndex].hostname,
+              ),
+            ),
+          );
         }
 
         const updatedNotifications = removeNotifications(