From 3863d0cfb4d0d2ae6878670e5495b8b913baa51c Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Wed, 25 Dec 2024 19:03:04 +0100
Subject: [PATCH 1/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/routes/Accounts.tsx              | 23 ++++-
 .../__snapshots__/Accounts.test.tsx.snap      | 99 ++++++++++++++++++-
 src/renderer/types.ts                         |  1 +
 src/renderer/utils/auth/utils.ts              |  4 +
 4 files changed, 123 insertions(+), 4 deletions(-)

diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index e906ce1a9..9bc9a8d17 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -1,4 +1,5 @@
 import {
+  AlertFillIcon,
   FeedPersonIcon,
   KeyIcon,
   MarkGithubIcon,
@@ -23,6 +24,7 @@ import { type Account, IconColor, Size } from '../types';
 import { getAccountUUID, refreshAccount } from '../utils/auth/utils';
 import { cn } from '../utils/cn';
 import { updateTrayIcon, updateTrayTitle } from '../utils/comms';
+import { Constants } from '../utils/constants';
 import {
   openAccountProfile,
   openDeveloperSettings,
@@ -78,7 +80,7 @@ export const AccountsRoute: FC = () => {
               className="mb-4 flex items-center justify-between rounded-md bg-gray-100 p-2 dark:bg-gray-sidebar"
             >
               <div className="ml-2 text-xs">
-                <div>
+                <div className="flex flex-1 items-center gap-2">
                   <button
                     type="button"
                     className="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
@@ -99,6 +101,25 @@ export const AccountsRoute: FC = () => {
                       ({account.user?.name})
                     </span>
                   </button>
+
+                  <span
+                    hidden={
+                      account.method === 'Personal Access Token' &&
+                      account.hasRequiredScopes === true
+                    }
+                    className="text-xs font-medium italic"
+                  >
+                    <button
+                      type="button"
+                      className="cursor-default"
+                      title={`This account is missing one or more required scopes: \n\t- ${Constants.AUTH_SCOPE.join('\n\t- ')}`}
+                    >
+                      <AlertFillIcon
+                        size={Size.XSMALL}
+                        className={IconColor.RED}
+                      />
+                    </button>
+                  </span>
                 </div>
                 <div>
                   <button
diff --git a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
index a58979d0a..9701613c2 100644
--- a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
@@ -70,7 +70,9 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <div
           class="ml-2 text-xs"
         >
-          <div>
+          <div
+            class="flex flex-1 items-center gap-2"
+          >
             <button
               class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
               title="Open Profile"
@@ -91,6 +93,35 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 )
               </span>
             </button>
+            <span
+              class="text-xs font-medium italic"
+            >
+              <button
+                class="cursor-default"
+                title="This account is missing one or more required scopes: 
+	- read:user
+	- notifications
+	- repo"
+                type="button"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-alert-fill text-red-500"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 12 12"
+                  width="12"
+                >
+                  <path
+                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+                  />
+                </svg>
+              </button>
+            </span>
           </div>
           <div>
             <button
@@ -255,7 +286,9 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <div
           class="ml-2 text-xs"
         >
-          <div>
+          <div
+            class="flex flex-1 items-center gap-2"
+          >
             <button
               class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
               title="Open Profile"
@@ -276,6 +309,35 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 )
               </span>
             </button>
+            <span
+              class="text-xs font-medium italic"
+            >
+              <button
+                class="cursor-default"
+                title="This account is missing one or more required scopes: 
+	- read:user
+	- notifications
+	- repo"
+                type="button"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-alert-fill text-red-500"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 12 12"
+                  width="12"
+                >
+                  <path
+                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+                  />
+                </svg>
+              </button>
+            </span>
           </div>
           <div>
             <button
@@ -440,7 +502,9 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <div
           class="ml-2 text-xs"
         >
-          <div>
+          <div
+            class="flex flex-1 items-center gap-2"
+          >
             <button
               class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
               title="Open Profile"
@@ -461,6 +525,35 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 )
               </span>
             </button>
+            <span
+              class="text-xs font-medium italic"
+            >
+              <button
+                class="cursor-default"
+                title="This account is missing one or more required scopes: 
+	- read:user
+	- notifications
+	- repo"
+                type="button"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-alert-fill text-red-500"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 12 12"
+                  width="12"
+                >
+                  <path
+                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+                  />
+                </svg>
+              </button>
+            </span>
           </div>
           <div>
             <button
diff --git a/src/renderer/types.ts b/src/renderer/types.ts
index 715d77e60..12739bb21 100644
--- a/src/renderer/types.ts
+++ b/src/renderer/types.ts
@@ -50,6 +50,7 @@ export interface Account {
   hostname: Hostname;
   token: Token;
   user: GitifyUser | null;
+  hasRequiredScopes?: boolean;
 }
 
 export type SettingsValue =
diff --git a/src/renderer/utils/auth/utils.ts b/src/renderer/utils/auth/utils.ts
index b131016f8..94b005e01 100644
--- a/src/renderer/utils/auth/utils.ts
+++ b/src/renderer/utils/auth/utils.ts
@@ -169,6 +169,10 @@ export async function refreshAccount(account: Account): Promise<Account> {
     account.version = extractHostVersion(
       res.headers['x-github-enterprise-version'],
     );
+
+    account.hasRequiredScopes = res.headers['x-oauth-scopes']
+      .split(',')
+      .includes(Constants.AUTH_SCOPE);
   } catch (err) {
     log.error(
       '[refreshAccount]: failed to refresh account for user',

From 7f51d821511e810b817ae094bd551b6e78b08a86 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Wed, 25 Dec 2024 22:30:27 +0100
Subject: [PATCH 2/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/utils/auth/utils.ts | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/renderer/utils/auth/utils.ts b/src/renderer/utils/auth/utils.ts
index 94b005e01..2f3280bfa 100644
--- a/src/renderer/utils/auth/utils.ts
+++ b/src/renderer/utils/auth/utils.ts
@@ -170,9 +170,13 @@ export async function refreshAccount(account: Account): Promise<Account> {
       res.headers['x-github-enterprise-version'],
     );
 
-    account.hasRequiredScopes = res.headers['x-oauth-scopes']
-      .split(',')
-      .includes(Constants.AUTH_SCOPE);
+    const accountScopes = res.headers['x-oauth-scopes']
+      ?.split(',')
+      .map((scope) => scope.trim());
+
+    account.hasRequiredScopes = Constants.AUTH_SCOPE.every((scope) =>
+      accountScopes.includes(scope),
+    );
   } catch (err) {
     log.error(
       '[refreshAccount]: failed to refresh account for user',

From 9ed8a98536633a314d8a41d1a07a2bd4cb7e71b6 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 26 Dec 2024 07:55:16 +0100
Subject: [PATCH 3/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/routes/Accounts.tsx | 5 +++--
 src/renderer/utils/auth/utils.ts | 2 +-
 2 files changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index 9bc9a8d17..5f9e56e79 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -111,8 +111,9 @@ export const AccountsRoute: FC = () => {
                   >
                     <button
                       type="button"
-                      className="cursor-default"
-                      title={`This account is missing one or more required scopes: \n\t- ${Constants.AUTH_SCOPE.join('\n\t- ')}`}
+                      className="cursor-pointer"
+                      title={`This account is missing one or more required scopes: \n  - ${Constants.AUTH_SCOPE.join('\n  - ')}`}
+                      onClick={() => openDeveloperSettings(account)}
                     >
                       <AlertFillIcon
                         size={Size.XSMALL}
diff --git a/src/renderer/utils/auth/utils.ts b/src/renderer/utils/auth/utils.ts
index 2f3280bfa..22d114ac4 100644
--- a/src/renderer/utils/auth/utils.ts
+++ b/src/renderer/utils/auth/utils.ts
@@ -172,7 +172,7 @@ export async function refreshAccount(account: Account): Promise<Account> {
 
     const accountScopes = res.headers['x-oauth-scopes']
       ?.split(',')
-      .map((scope) => scope.trim());
+      .map((scope: string) => scope.trim());
 
     account.hasRequiredScopes = Constants.AUTH_SCOPE.every((scope) =>
       accountScopes.includes(scope),

From 8ea27735af5fee0348a9ba45205883affa7f90e2 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 26 Dec 2024 07:58:16 +0100
Subject: [PATCH 4/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/__mocks__/state-mocks.ts         |   1 +
 src/renderer/routes/Accounts.test.tsx         |  28 +
 .../__snapshots__/Accounts.test.tsx.snap      | 870 +++++++++++++++++-
 3 files changed, 887 insertions(+), 12 deletions(-)

diff --git a/src/renderer/__mocks__/state-mocks.ts b/src/renderer/__mocks__/state-mocks.ts
index 4b3eb4232..d167f44b0 100644
--- a/src/renderer/__mocks__/state-mocks.ts
+++ b/src/renderer/__mocks__/state-mocks.ts
@@ -34,6 +34,7 @@ export const mockPersonalAccessTokenAccount: Account = {
   token: 'token-123-456' as Token,
   hostname: Constants.DEFAULT_AUTH_OPTIONS.hostname,
   user: mockGitifyUser,
+  hasRequiredScopes: true,
 };
 
 export const mockOAuthAccount: Account = {
diff --git a/src/renderer/routes/Accounts.test.tsx b/src/renderer/routes/Accounts.test.tsx
index e2b23052f..b1b26e25b 100644
--- a/src/renderer/routes/Accounts.test.tsx
+++ b/src/renderer/routes/Accounts.test.tsx
@@ -57,6 +57,34 @@ describe('renderer/routes/Accounts.tsx', () => {
       expect(screen.getByTestId('accounts')).toMatchSnapshot();
     });
 
+    it('should render with PAT scopes warning', async () => {
+      await act(async () => {
+        render(
+          <AppContext.Provider
+            value={{
+              auth: {
+                accounts: [
+                  {
+                    ...mockPersonalAccessTokenAccount,
+                    hasRequiredScopes: false,
+                  },
+                  mockOAuthAccount,
+                  mockGitHubAppAccount,
+                ],
+              },
+              settings: mockSettings,
+            }}
+          >
+            <MemoryRouter>
+              <AccountsRoute />
+            </MemoryRouter>
+          </AppContext.Provider>,
+        );
+      });
+
+      expect(screen.getByTestId('accounts')).toMatchSnapshot();
+    });
+
     it('should go back by pressing the icon', async () => {
       await act(async () => {
         render(
diff --git a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
index 9701613c2..909187325 100644
--- a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
@@ -95,13 +95,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             </button>
             <span
               class="text-xs font-medium italic"
+              hidden=""
             >
               <button
-                class="cursor-default"
+                class="cursor-pointer"
                 title="This account is missing one or more required scopes: 
-	- read:user
-	- notifications
-	- repo"
+  - read:user
+  - notifications
+  - repo"
                 type="button"
               >
                 <svg
@@ -313,11 +314,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
               class="text-xs font-medium italic"
             >
               <button
-                class="cursor-default"
+                class="cursor-pointer"
                 title="This account is missing one or more required scopes: 
-	- read:user
-	- notifications
-	- repo"
+  - read:user
+  - notifications
+  - repo"
                 type="button"
               >
                 <svg
@@ -529,11 +530,856 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
               class="text-xs font-medium italic"
             >
               <button
-                class="cursor-default"
+                class="cursor-pointer"
                 title="This account is missing one or more required scopes: 
-	- read:user
-	- notifications
-	- repo"
+  - read:user
+  - notifications
+  - repo"
+                type="button"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-alert-fill text-red-500"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 12 12"
+                  width="12"
+                >
+                  <path
+                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+                  />
+                </svg>
+              </button>
+            </span>
+          </div>
+          <div>
+            <button
+              class="mb-1 ml-1 cursor-pointer align-middle"
+              title="Open Host"
+              type="button"
+            >
+              <span
+                class="mr-1"
+                title="GitHub Cloud"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-mark-github"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 16 16"
+                  width="12"
+                >
+                  <path
+                    d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+                  />
+                </svg>
+              </span>
+              github.com
+            </button>
+          </div>
+          <div>
+            <button
+              class="ml-1 cursor-pointer align-middle"
+              title="Open Developer Settings"
+              type="button"
+            >
+              <span
+                class="mr-1"
+                title="GitHub App"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-apps"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 16 16"
+                  width="12"
+                >
+                  <path
+                    d="M1.5 3.25c0-.966.784-1.75 1.75-1.75h2.5c.966 0 1.75.784 1.75 1.75v2.5A1.75 1.75 0 0 1 5.75 7.5h-2.5A1.75 1.75 0 0 1 1.5 5.75Zm7 0c0-.966.784-1.75 1.75-1.75h2.5c.966 0 1.75.784 1.75 1.75v2.5a1.75 1.75 0 0 1-1.75 1.75h-2.5A1.75 1.75 0 0 1 8.5 5.75Zm-7 7c0-.966.784-1.75 1.75-1.75h2.5c.966 0 1.75.784 1.75 1.75v2.5a1.75 1.75 0 0 1-1.75 1.75h-2.5a1.75 1.75 0 0 1-1.75-1.75Zm7 0c0-.966.784-1.75 1.75-1.75h2.5c.966 0 1.75.784 1.75 1.75v2.5a1.75 1.75 0 0 1-1.75 1.75h-2.5a1.75 1.75 0 0 1-1.75-1.75ZM3.25 3a.25.25 0 0 0-.25.25v2.5c0 .138.112.25.25.25h2.5A.25.25 0 0 0 6 5.75v-2.5A.25.25 0 0 0 5.75 3Zm7 0a.25.25 0 0 0-.25.25v2.5c0 .138.112.25.25.25h2.5a.25.25 0 0 0 .25-.25v-2.5a.25.25 0 0 0-.25-.25Zm-7 7a.25.25 0 0 0-.25.25v2.5c0 .138.112.25.25.25h2.5a.25.25 0 0 0 .25-.25v-2.5a.25.25 0 0 0-.25-.25Zm7 0a.25.25 0 0 0-.25.25v2.5c0 .138.112.25.25.25h2.5a.25.25 0 0 0 .25-.25v-2.5a.25.25 0 0 0-.25-.25Z"
+                  />
+                </svg>
+              </span>
+              GitHub App
+            </button>
+          </div>
+        </div>
+        <div>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0 cursor-default"
+            hidden=""
+            title="Primary account"
+            type="button"
+          >
+            <svg
+              aria-label="Primary account"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Set as primary account"
+            type="button"
+          >
+            <svg
+              aria-label="Set as primary account"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Refresh octocat"
+            type="button"
+          >
+            <svg
+              aria-label="Refresh octocat"
+              class="octicon octicon-sync"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M1.705 8.005a.75.75 0 0 1 .834.656 5.5 5.5 0 0 0 9.592 2.97l-1.204-1.204a.25.25 0 0 1 .177-.427h3.646a.25.25 0 0 1 .25.25v3.646a.25.25 0 0 1-.427.177l-1.38-1.38A7.002 7.002 0 0 1 1.05 8.84a.75.75 0 0 1 .656-.834ZM8 2.5a5.487 5.487 0 0 0-4.131 1.869l1.204 1.204A.25.25 0 0 1 4.896 6H1.25A.25.25 0 0 1 1 5.75V2.104a.25.25 0 0 1 .427-.177l1.38 1.38A7.002 7.002 0 0 1 14.95 7.16a.75.75 0 0 1-1.49.178A5.5 5.5 0 0 0 8 2.5Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Logout octocat"
+            type="button"
+          >
+            <svg
+              aria-label="Logout octocat"
+              class="octicon octicon-sign-out"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M2 2.75C2 1.784 2.784 1 3.75 1h2.5a.75.75 0 0 1 0 1.5h-2.5a.25.25 0 0 0-.25.25v10.5c0 .138.112.25.25.25h2.5a.75.75 0 0 1 0 1.5h-2.5A1.75 1.75 0 0 1 2 13.25Zm10.44 4.5-1.97-1.97a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l3.25 3.25a.75.75 0 0 1 0 1.06l-3.25 3.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734l1.97-1.97H6.75a.75.75 0 0 1 0-1.5Z"
+              />
+            </svg>
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    class="flex items-center justify-between bg-gray-200 px-8 py-1 text-sm dark:bg-gray-darker"
+  >
+    <div
+      class="font-semibold italic"
+    >
+      Add new account
+    </div>
+    <div>
+      <button
+        class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+        title="Login with GitHub"
+        type="button"
+      >
+        <svg
+          aria-label="Login with GitHub App"
+          class="octicon octicon-mark-github"
+          display="inline-block"
+          fill="currentColor"
+          focusable="false"
+          height="18"
+          overflow="visible"
+          role="img"
+          style="vertical-align: text-bottom;"
+          viewBox="0 0 16 16"
+          width="18"
+        >
+          <path
+            d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+          />
+        </svg>
+        <svg
+          aria-hidden="true"
+          class="octicon octicon-plus mb-2 ml-1"
+          display="inline-block"
+          fill="currentColor"
+          focusable="false"
+          height="14"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
+          viewBox="0 0 16 16"
+          width="14"
+        >
+          <path
+            d="M7.75 2a.75.75 0 0 1 .75.75V7h4.25a.75.75 0 0 1 0 1.5H8.5v4.25a.75.75 0 0 1-1.5 0V8.5H2.75a.75.75 0 0 1 0-1.5H7V2.75A.75.75 0 0 1 7.75 2Z"
+          />
+        </svg>
+      </button>
+      <button
+        class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+        title="Login with Personal Access Token"
+        type="button"
+      >
+        <svg
+          aria-label="Login with Personal Access Token"
+          class="octicon octicon-key"
+          display="inline-block"
+          fill="currentColor"
+          focusable="false"
+          height="18"
+          overflow="visible"
+          role="img"
+          style="vertical-align: text-bottom;"
+          viewBox="0 0 16 16"
+          width="18"
+        >
+          <path
+            d="M10.5 0a5.499 5.499 0 1 1-1.288 10.848l-.932.932a.749.749 0 0 1-.53.22H7v.75a.749.749 0 0 1-.22.53l-.5.5a.749.749 0 0 1-.53.22H5v.75a.749.749 0 0 1-.22.53l-.5.5a.749.749 0 0 1-.53.22h-2A1.75 1.75 0 0 1 0 14.25v-2c0-.199.079-.389.22-.53l4.932-4.932A5.5 5.5 0 0 1 10.5 0Zm-4 5.5c-.001.431.069.86.205 1.269a.75.75 0 0 1-.181.768L1.5 12.56v1.69c0 .138.112.25.25.25h1.69l.06-.06v-1.19a.75.75 0 0 1 .75-.75h1.19l.06-.06v-1.19a.75.75 0 0 1 .75-.75h1.19l1.023-1.025a.75.75 0 0 1 .768-.18A4 4 0 1 0 6.5 5.5ZM11 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"
+          />
+        </svg>
+        <svg
+          aria-hidden="true"
+          class="octicon octicon-plus mb-2 ml-1"
+          display="inline-block"
+          fill="currentColor"
+          focusable="false"
+          height="14"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
+          viewBox="0 0 16 16"
+          width="14"
+        >
+          <path
+            d="M7.75 2a.75.75 0 0 1 .75.75V7h4.25a.75.75 0 0 1 0 1.5H8.5v4.25a.75.75 0 0 1-1.5 0V8.5H2.75a.75.75 0 0 1 0-1.5H7V2.75A.75.75 0 0 1 7.75 2Z"
+          />
+        </svg>
+      </button>
+      <button
+        class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+        title="Login with OAuth App"
+        type="button"
+      >
+        <svg
+          aria-label="Login with OAuth App"
+          class="octicon octicon-person"
+          display="inline-block"
+          fill="currentColor"
+          focusable="false"
+          height="20"
+          overflow="visible"
+          role="img"
+          style="vertical-align: text-bottom;"
+          viewBox="0 0 16 16"
+          width="20"
+        >
+          <path
+            d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"
+          />
+        </svg>
+        <svg
+          aria-hidden="true"
+          class="octicon octicon-plus mb-2"
+          display="inline-block"
+          fill="currentColor"
+          focusable="false"
+          height="14"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
+          viewBox="0 0 16 16"
+          width="14"
+        >
+          <path
+            d="M7.75 2a.75.75 0 0 1 .75.75V7h4.25a.75.75 0 0 1 0 1.5H8.5v4.25a.75.75 0 0 1-1.5 0V8.5H2.75a.75.75 0 0 1 0-1.5H7V2.75A.75.75 0 0 1 7.75 2Z"
+          />
+        </svg>
+      </button>
+    </div>
+  </div>
+</div>
+`;
+
+exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warning 1`] = `
+<div
+  class="flex h-screen flex-col"
+  data-testid="accounts"
+>
+  <div
+    class="mx-8 mt-2 flex items-center justify-between py-2"
+  >
+    <button
+      class="focus:outline-none"
+      title="Go Back"
+      type="button"
+    >
+      <svg
+        aria-label="Go Back"
+        class="octicon octicon-arrow-left hover:text-gray-400"
+        display="inline-block"
+        fill="currentColor"
+        focusable="false"
+        height="20"
+        overflow="visible"
+        role="img"
+        style="vertical-align: text-bottom;"
+        viewBox="0 0 16 16"
+        width="20"
+      >
+        <path
+          d="M7.78 12.53a.75.75 0 0 1-1.06 0L2.47 8.28a.75.75 0 0 1 0-1.06l4.25-4.25a.751.751 0 0 1 1.042.018.751.751 0 0 1 .018 1.042L4.81 7h7.44a.75.75 0 0 1 0 1.5H4.81l2.97 2.97a.75.75 0 0 1 0 1.06Z"
+        />
+      </svg>
+    </button>
+    <h3
+      class="text-lg font-semibold flex items-center"
+    >
+      <legend
+        class="mb-1 mt-2 font-semibold flex items-center"
+        id="accounts"
+      >
+        <svg
+          aria-hidden="true"
+          class="octicon octicon-person mr-2"
+          display="inline-block"
+          fill="currentColor"
+          focusable="false"
+          height="16"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
+          viewBox="0 0 16 16"
+          width="16"
+        >
+          <path
+            d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"
+          />
+        </svg>
+        Accounts
+      </legend>
+    </h3>
+  </div>
+  <div
+    class="flex-grow overflow-x-auto px-8"
+  >
+    <div
+      class="mt-4 flex flex-col text-sm"
+    >
+      <div
+        class="mb-4 flex items-center justify-between rounded-md bg-gray-100 p-2 dark:bg-gray-sidebar"
+      >
+        <div
+          class="ml-2 text-xs"
+        >
+          <div
+            class="flex flex-1 items-center gap-2"
+          >
+            <button
+              class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
+              title="Open Profile"
+              type="button"
+            >
+              <img
+                alt="octocat's avatar"
+                class="rounded-full object-cover size-6"
+                src="https://avatars.githubusercontent.com/u/583231?v=4"
+              />
+              @
+              octocat
+              <span
+                class="text-xs font-medium italic"
+              >
+                (
+                Mona Lisa Octocat
+                )
+              </span>
+            </button>
+            <span
+              class="text-xs font-medium italic"
+            >
+              <button
+                class="cursor-pointer"
+                title="This account is missing one or more required scopes: 
+  - read:user
+  - notifications
+  - repo"
+                type="button"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-alert-fill text-red-500"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 12 12"
+                  width="12"
+                >
+                  <path
+                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+                  />
+                </svg>
+              </button>
+            </span>
+          </div>
+          <div>
+            <button
+              class="mb-1 ml-1 cursor-pointer align-middle"
+              title="Open Host"
+              type="button"
+            >
+              <span
+                class="mr-1"
+                title="GitHub Cloud"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-mark-github"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 16 16"
+                  width="12"
+                >
+                  <path
+                    d="M8 0c4.42 0 8 3.58 8 8a8.013 8.013 0 0 1-5.45 7.59c-.4.08-.55-.17-.55-.38 0-.27.01-1.13.01-2.2 0-.75-.25-1.23-.54-1.48 1.78-.2 3.65-.88 3.65-3.95 0-.88-.31-1.59-.82-2.15.08-.2.36-1.02-.08-2.12 0 0-.67-.22-2.2.82-.64-.18-1.32-.27-2-.27-.68 0-1.36.09-2 .27-1.53-1.03-2.2-.82-2.2-.82-.44 1.1-.16 1.92-.08 2.12-.51.56-.82 1.28-.82 2.15 0 3.06 1.86 3.75 3.64 3.95-.23.2-.44.55-.51 1.07-.46.21-1.61.55-2.33-.66-.15-.24-.6-.83-1.23-.82-.67.01-.27.38.01.53.34.19.73.9.82 1.13.16.45.68 1.31 2.69.94 0 .67.01 1.3.01 1.49 0 .21-.15.45-.55.38A7.995 7.995 0 0 1 0 8c0-4.42 3.58-8 8-8Z"
+                  />
+                </svg>
+              </span>
+              github.com
+            </button>
+          </div>
+          <div>
+            <button
+              class="ml-1 cursor-pointer align-middle"
+              title="Open Developer Settings"
+              type="button"
+            >
+              <span
+                class="mr-1"
+                title="Personal Access Token"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-key"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 16 16"
+                  width="12"
+                >
+                  <path
+                    d="M10.5 0a5.499 5.499 0 1 1-1.288 10.848l-.932.932a.749.749 0 0 1-.53.22H7v.75a.749.749 0 0 1-.22.53l-.5.5a.749.749 0 0 1-.53.22H5v.75a.749.749 0 0 1-.22.53l-.5.5a.749.749 0 0 1-.53.22h-2A1.75 1.75 0 0 1 0 14.25v-2c0-.199.079-.389.22-.53l4.932-4.932A5.5 5.5 0 0 1 10.5 0Zm-4 5.5c-.001.431.069.86.205 1.269a.75.75 0 0 1-.181.768L1.5 12.56v1.69c0 .138.112.25.25.25h1.69l.06-.06v-1.19a.75.75 0 0 1 .75-.75h1.19l.06-.06v-1.19a.75.75 0 0 1 .75-.75h1.19l1.023-1.025a.75.75 0 0 1 .768-.18A4 4 0 1 0 6.5 5.5ZM11 6a1 1 0 1 1 0-2 1 1 0 0 1 0 2Z"
+                  />
+                </svg>
+              </span>
+              Personal Access Token
+            </button>
+          </div>
+        </div>
+        <div>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0 cursor-default"
+            title="Primary account"
+            type="button"
+          >
+            <svg
+              aria-label="Primary account"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            hidden=""
+            title="Set as primary account"
+            type="button"
+          >
+            <svg
+              aria-label="Set as primary account"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Refresh octocat"
+            type="button"
+          >
+            <svg
+              aria-label="Refresh octocat"
+              class="octicon octicon-sync"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M1.705 8.005a.75.75 0 0 1 .834.656 5.5 5.5 0 0 0 9.592 2.97l-1.204-1.204a.25.25 0 0 1 .177-.427h3.646a.25.25 0 0 1 .25.25v3.646a.25.25 0 0 1-.427.177l-1.38-1.38A7.002 7.002 0 0 1 1.05 8.84a.75.75 0 0 1 .656-.834ZM8 2.5a5.487 5.487 0 0 0-4.131 1.869l1.204 1.204A.25.25 0 0 1 4.896 6H1.25A.25.25 0 0 1 1 5.75V2.104a.25.25 0 0 1 .427-.177l1.38 1.38A7.002 7.002 0 0 1 14.95 7.16a.75.75 0 0 1-1.49.178A5.5 5.5 0 0 0 8 2.5Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Logout octocat"
+            type="button"
+          >
+            <svg
+              aria-label="Logout octocat"
+              class="octicon octicon-sign-out"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M2 2.75C2 1.784 2.784 1 3.75 1h2.5a.75.75 0 0 1 0 1.5h-2.5a.25.25 0 0 0-.25.25v10.5c0 .138.112.25.25.25h2.5a.75.75 0 0 1 0 1.5h-2.5A1.75 1.75 0 0 1 2 13.25Zm10.44 4.5-1.97-1.97a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l3.25 3.25a.75.75 0 0 1 0 1.06l-3.25 3.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734l1.97-1.97H6.75a.75.75 0 0 1 0-1.5Z"
+              />
+            </svg>
+          </button>
+        </div>
+      </div>
+      <div
+        class="mb-4 flex items-center justify-between rounded-md bg-gray-100 p-2 dark:bg-gray-sidebar"
+      >
+        <div
+          class="ml-2 text-xs"
+        >
+          <div
+            class="flex flex-1 items-center gap-2"
+          >
+            <button
+              class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
+              title="Open Profile"
+              type="button"
+            >
+              <img
+                alt="octocat's avatar"
+                class="rounded-full object-cover size-6"
+                src="https://avatars.githubusercontent.com/u/583231?v=4"
+              />
+              @
+              octocat
+              <span
+                class="text-xs font-medium italic"
+              >
+                (
+                Mona Lisa Octocat
+                )
+              </span>
+            </button>
+            <span
+              class="text-xs font-medium italic"
+            >
+              <button
+                class="cursor-pointer"
+                title="This account is missing one or more required scopes: 
+  - read:user
+  - notifications
+  - repo"
+                type="button"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-alert-fill text-red-500"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 12 12"
+                  width="12"
+                >
+                  <path
+                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
+                  />
+                </svg>
+              </button>
+            </span>
+          </div>
+          <div>
+            <button
+              class="mb-1 ml-1 cursor-pointer align-middle"
+              title="Open Host"
+              type="button"
+            >
+              <span
+                class="mr-1"
+                title="GitHub Enterprise Server"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-server"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 16 16"
+                  width="12"
+                >
+                  <path
+                    d="M1.75 1h12.5c.966 0 1.75.784 1.75 1.75v4c0 .372-.116.717-.314 1 .198.283.314.628.314 1v4a1.75 1.75 0 0 1-1.75 1.75H1.75A1.75 1.75 0 0 1 0 12.75v-4c0-.358.109-.707.314-1a1.739 1.739 0 0 1-.314-1v-4C0 1.784.784 1 1.75 1ZM1.5 2.75v4c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25H1.75a.25.25 0 0 0-.25.25Zm.25 5.75a.25.25 0 0 0-.25.25v4c0 .138.112.25.25.25h12.5a.25.25 0 0 0 .25-.25v-4a.25.25 0 0 0-.25-.25ZM7 4.75A.75.75 0 0 1 7.75 4h4.5a.75.75 0 0 1 0 1.5h-4.5A.75.75 0 0 1 7 4.75ZM7.75 10h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1 0-1.5ZM3 4.75A.75.75 0 0 1 3.75 4h.5a.75.75 0 0 1 0 1.5h-.5A.75.75 0 0 1 3 4.75ZM3.75 10h.5a.75.75 0 0 1 0 1.5h-.5a.75.75 0 0 1 0-1.5Z"
+                  />
+                </svg>
+              </span>
+              github.gitify.io
+            </button>
+          </div>
+          <div>
+            <button
+              class="ml-1 cursor-pointer align-middle"
+              title="Open Developer Settings"
+              type="button"
+            >
+              <span
+                class="mr-1"
+                title="OAuth App"
+              >
+                <svg
+                  aria-hidden="true"
+                  class="octicon octicon-person"
+                  display="inline-block"
+                  fill="currentColor"
+                  focusable="false"
+                  height="12"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
+                  viewBox="0 0 16 16"
+                  width="12"
+                >
+                  <path
+                    d="M10.561 8.073a6.005 6.005 0 0 1 3.432 5.142.75.75 0 1 1-1.498.07 4.5 4.5 0 0 0-8.99 0 .75.75 0 0 1-1.498-.07 6.004 6.004 0 0 1 3.431-5.142 3.999 3.999 0 1 1 5.123 0ZM10.5 5a2.5 2.5 0 1 0-5 0 2.5 2.5 0 0 0 5 0Z"
+                  />
+                </svg>
+              </span>
+              OAuth App
+            </button>
+          </div>
+        </div>
+        <div>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0 cursor-default"
+            hidden=""
+            title="Primary account"
+            type="button"
+          >
+            <svg
+              aria-label="Primary account"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Set as primary account"
+            type="button"
+          >
+            <svg
+              aria-label="Set as primary account"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M8 .25a.75.75 0 0 1 .673.418l1.882 3.815 4.21.612a.75.75 0 0 1 .416 1.279l-3.046 2.97.719 4.192a.751.751 0 0 1-1.088.791L8 12.347l-3.766 1.98a.75.75 0 0 1-1.088-.79l.72-4.194L.818 6.374a.75.75 0 0 1 .416-1.28l4.21-.611L7.327.668A.75.75 0 0 1 8 .25Zm0 2.445L6.615 5.5a.75.75 0 0 1-.564.41l-3.097.45 2.24 2.184a.75.75 0 0 1 .216.664l-.528 3.084 2.769-1.456a.75.75 0 0 1 .698 0l2.77 1.456-.53-3.084a.75.75 0 0 1 .216-.664l2.24-2.183-3.096-.45a.75.75 0 0 1-.564-.41L8 2.694Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Refresh octocat"
+            type="button"
+          >
+            <svg
+              aria-label="Refresh octocat"
+              class="octicon octicon-sync"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M1.705 8.005a.75.75 0 0 1 .834.656 5.5 5.5 0 0 0 9.592 2.97l-1.204-1.204a.25.25 0 0 1 .177-.427h3.646a.25.25 0 0 1 .25.25v3.646a.25.25 0 0 1-.427.177l-1.38-1.38A7.002 7.002 0 0 1 1.05 8.84a.75.75 0 0 1 .656-.834ZM8 2.5a5.487 5.487 0 0 0-4.131 1.869l1.204 1.204A.25.25 0 0 1 4.896 6H1.25A.25.25 0 0 1 1 5.75V2.104a.25.25 0 0 1 .427-.177l1.38 1.38A7.002 7.002 0 0 1 14.95 7.16a.75.75 0 0 1-1.49.178A5.5 5.5 0 0 0 8 2.5Z"
+              />
+            </svg>
+          </button>
+          <button
+            class="hover:text-gray-500 py-1 my-1 mx-2 focus:outline-none px-0"
+            title="Logout octocat"
+            type="button"
+          >
+            <svg
+              aria-label="Logout octocat"
+              class="octicon octicon-sign-out"
+              display="inline-block"
+              fill="currentColor"
+              focusable="false"
+              height="20"
+              overflow="visible"
+              role="img"
+              style="vertical-align: text-bottom;"
+              viewBox="0 0 16 16"
+              width="20"
+            >
+              <path
+                d="M2 2.75C2 1.784 2.784 1 3.75 1h2.5a.75.75 0 0 1 0 1.5h-2.5a.25.25 0 0 0-.25.25v10.5c0 .138.112.25.25.25h2.5a.75.75 0 0 1 0 1.5h-2.5A1.75 1.75 0 0 1 2 13.25Zm10.44 4.5-1.97-1.97a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l3.25 3.25a.75.75 0 0 1 0 1.06l-3.25 3.25a.749.749 0 0 1-1.275-.326.749.749 0 0 1 .215-.734l1.97-1.97H6.75a.75.75 0 0 1 0-1.5Z"
+              />
+            </svg>
+          </button>
+        </div>
+      </div>
+      <div
+        class="mb-4 flex items-center justify-between rounded-md bg-gray-100 p-2 dark:bg-gray-sidebar"
+      >
+        <div
+          class="ml-2 text-xs"
+        >
+          <div
+            class="flex flex-1 items-center gap-2"
+          >
+            <button
+              class="flex flex-1 gap-2 items-center justify-center mb-1 cursor-pointer text-sm font-semibold"
+              title="Open Profile"
+              type="button"
+            >
+              <img
+                alt="octocat's avatar"
+                class="rounded-full object-cover size-6"
+                src="https://avatars.githubusercontent.com/u/583231?v=4"
+              />
+              @
+              octocat
+              <span
+                class="text-xs font-medium italic"
+              >
+                (
+                Mona Lisa Octocat
+                )
+              </span>
+            </button>
+            <span
+              class="text-xs font-medium italic"
+            >
+              <button
+                class="cursor-pointer"
+                title="This account is missing one or more required scopes: 
+  - read:user
+  - notifications
+  - repo"
                 type="button"
               >
                 <svg

From 1f587f15859a6b3b29792b554d3e7564b7c6e870 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Thu, 26 Dec 2024 08:12:34 +0100
Subject: [PATCH 5/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/routes/Accounts.test.tsx         |  11 ++
 src/renderer/routes/Accounts.tsx              |  36 ++---
 .../__snapshots__/Accounts.test.tsx.snap      | 147 +-----------------
 3 files changed, 29 insertions(+), 165 deletions(-)

diff --git a/src/renderer/routes/Accounts.test.tsx b/src/renderer/routes/Accounts.test.tsx
index b1b26e25b..e06fd5486 100644
--- a/src/renderer/routes/Accounts.test.tsx
+++ b/src/renderer/routes/Accounts.test.tsx
@@ -58,6 +58,10 @@ describe('renderer/routes/Accounts.tsx', () => {
     });
 
     it('should render with PAT scopes warning', async () => {
+      const openExternalLinkMock = jest
+        .spyOn(comms, 'openExternalLink')
+        .mockImplementation();
+
       await act(async () => {
         render(
           <AppContext.Provider
@@ -83,6 +87,13 @@ describe('renderer/routes/Accounts.tsx', () => {
       });
 
       expect(screen.getByTestId('accounts')).toMatchSnapshot();
+
+      fireEvent.click(screen.getByLabelText('missing-scopes'));
+
+      expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
+      expect(openExternalLinkMock).toHaveBeenCalledWith(
+        'https://github.com/settings/tokens',
+      );
     });
 
     it('should go back by pressing the icon', async () => {
diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index 5f9e56e79..ef7fad938 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -102,25 +102,23 @@ export const AccountsRoute: FC = () => {
                     </span>
                   </button>
 
-                  <span
-                    hidden={
-                      account.method === 'Personal Access Token' &&
-                      account.hasRequiredScopes === true
-                    }
-                    className="text-xs font-medium italic"
-                  >
-                    <button
-                      type="button"
-                      className="cursor-pointer"
-                      title={`This account is missing one or more required scopes: \n  - ${Constants.AUTH_SCOPE.join('\n  - ')}`}
-                      onClick={() => openDeveloperSettings(account)}
-                    >
-                      <AlertFillIcon
-                        size={Size.XSMALL}
-                        className={IconColor.RED}
-                      />
-                    </button>
-                  </span>
+                  {account.method === 'Personal Access Token' &&
+                    account.hasRequiredScopes === false && (
+                      <span className="text-xs font-medium italic">
+                        <button
+                          type="button"
+                          className="cursor-pointer"
+                          title={`This account is missing one or more required scopes: \n  - ${Constants.AUTH_SCOPE.join('\n  - ')}`}
+                          aria-label="missing-scopes"
+                          onClick={() => openDeveloperSettings(account)}
+                        >
+                          <AlertFillIcon
+                            size={Size.XSMALL}
+                            className={IconColor.RED}
+                          />
+                        </button>
+                      </span>
+                    )}
                 </div>
                 <div>
                   <button
diff --git a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
index 909187325..767f6ea55 100644
--- a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
@@ -93,36 +93,6 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 )
               </span>
             </button>
-            <span
-              class="text-xs font-medium italic"
-              hidden=""
-            >
-              <button
-                class="cursor-pointer"
-                title="This account is missing one or more required scopes: 
-  - read:user
-  - notifications
-  - repo"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="octicon octicon-alert-fill text-red-500"
-                  display="inline-block"
-                  fill="currentColor"
-                  focusable="false"
-                  height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
-                  viewBox="0 0 12 12"
-                  width="12"
-                >
-                  <path
-                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
-                  />
-                </svg>
-              </button>
-            </span>
           </div>
           <div>
             <button
@@ -310,35 +280,6 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 )
               </span>
             </button>
-            <span
-              class="text-xs font-medium italic"
-            >
-              <button
-                class="cursor-pointer"
-                title="This account is missing one or more required scopes: 
-  - read:user
-  - notifications
-  - repo"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="octicon octicon-alert-fill text-red-500"
-                  display="inline-block"
-                  fill="currentColor"
-                  focusable="false"
-                  height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
-                  viewBox="0 0 12 12"
-                  width="12"
-                >
-                  <path
-                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
-                  />
-                </svg>
-              </button>
-            </span>
           </div>
           <div>
             <button
@@ -526,35 +467,6 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 )
               </span>
             </button>
-            <span
-              class="text-xs font-medium italic"
-            >
-              <button
-                class="cursor-pointer"
-                title="This account is missing one or more required scopes: 
-  - read:user
-  - notifications
-  - repo"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="octicon octicon-alert-fill text-red-500"
-                  display="inline-block"
-                  fill="currentColor"
-                  focusable="false"
-                  height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
-                  viewBox="0 0 12 12"
-                  width="12"
-                >
-                  <path
-                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
-                  />
-                </svg>
-              </button>
-            </span>
           </div>
           <div>
             <button
@@ -943,6 +855,7 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
               class="text-xs font-medium italic"
             >
               <button
+                aria-label="missing-scopes"
                 class="cursor-pointer"
                 title="This account is missing one or more required scopes: 
   - read:user
@@ -1155,35 +1068,6 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 )
               </span>
             </button>
-            <span
-              class="text-xs font-medium italic"
-            >
-              <button
-                class="cursor-pointer"
-                title="This account is missing one or more required scopes: 
-  - read:user
-  - notifications
-  - repo"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="octicon octicon-alert-fill text-red-500"
-                  display="inline-block"
-                  fill="currentColor"
-                  focusable="false"
-                  height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
-                  viewBox="0 0 12 12"
-                  width="12"
-                >
-                  <path
-                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
-                  />
-                </svg>
-              </button>
-            </span>
           </div>
           <div>
             <button
@@ -1371,35 +1255,6 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 )
               </span>
             </button>
-            <span
-              class="text-xs font-medium italic"
-            >
-              <button
-                class="cursor-pointer"
-                title="This account is missing one or more required scopes: 
-  - read:user
-  - notifications
-  - repo"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  class="octicon octicon-alert-fill text-red-500"
-                  display="inline-block"
-                  fill="currentColor"
-                  focusable="false"
-                  height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
-                  viewBox="0 0 12 12"
-                  width="12"
-                >
-                  <path
-                    d="M4.855.708c.5-.896 1.79-.896 2.29 0l4.675 8.351a1.312 1.312 0 0 1-1.146 1.954H1.33A1.313 1.313 0 0 1 .183 9.058ZM7 7V3H5v4Zm-1 3a1 1 0 1 0 0-2 1 1 0 0 0 0 2Z"
-                  />
-                </svg>
-              </button>
-            </span>
           </div>
           <div>
             <button

From f34f29d582e01ab65de063b8fa3fc524099622f0 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Fri, 27 Dec 2024 07:35:55 +0100
Subject: [PATCH 6/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 .../__snapshots__/Accounts.test.tsx.snap      | 132 ++++++------------
 1 file changed, 39 insertions(+), 93 deletions(-)

diff --git a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
index 5baf3c07d..e8c645738 100644
--- a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
@@ -453,12 +453,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -483,12 +481,10 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-apps"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -510,14 +506,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -533,14 +527,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -557,13 +549,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -580,13 +570,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -616,13 +604,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with GitHub App"
           class="octicon octicon-mark-github"
-          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
-          overflow="visible"
           role="img"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -632,13 +618,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="octicon octicon-plus mb-2 ml-1"
-          display="inline-block"
+          class="mb-2 ml-1"
           fill="currentColor"
           focusable="false"
           height="14"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -655,13 +639,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with Personal Access Token"
           class="octicon octicon-key"
-          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
-          overflow="visible"
           role="img"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -671,13 +653,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="octicon octicon-plus mb-2 ml-1"
-          display="inline-block"
+          class="mb-2 ml-1"
           fill="currentColor"
           focusable="false"
           height="14"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -694,13 +674,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         <svg
           aria-label="Login with OAuth App"
           class="octicon octicon-person"
-          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="20"
-          overflow="visible"
           role="img"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="20"
         >
@@ -710,13 +688,11 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="octicon octicon-plus mb-2"
-          display="inline-block"
+          class="mb-2"
           fill="currentColor"
           focusable="false"
           height="14"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -745,14 +721,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
     >
       <svg
         aria-label="Go Back"
-        class="octicon octicon-arrow-left hover:text-gray-400"
-        display="inline-block"
+        class="hover:text-gray-400"
         fill="currentColor"
         focusable="false"
         height="20"
-        overflow="visible"
         role="img"
-        style="vertical-align: text-bottom;"
+        style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
         viewBox="0 0 16 16"
         width="20"
       >
@@ -770,13 +744,11 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
       >
         <svg
           aria-hidden="true"
-          class="octicon octicon-person mr-2"
-          display="inline-block"
+          class="mr-2"
           fill="currentColor"
           focusable="false"
           height="16"
-          overflow="visible"
-          style="vertical-align: text-bottom;"
+          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
           viewBox="0 0 16 16"
           width="16"
         >
@@ -837,13 +809,11 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
               >
                 <svg
                   aria-hidden="true"
-                  class="octicon octicon-alert-fill text-red-500"
-                  display="inline-block"
+                  class="text-red-500"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 12 12"
                   width="12"
                 >
@@ -867,12 +837,10 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -897,12 +865,10 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-key"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -923,14 +889,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Primary account"
-              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -947,14 +911,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Set as primary account"
-              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -971,13 +933,11 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -994,13 +954,11 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1054,12 +1012,10 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-server"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -1084,12 +1040,10 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-person"
-                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  overflow="visible"
-                  style="vertical-align: text-bottom;"
+                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -1111,14 +1065,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Primary account"
-              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1134,14 +1086,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Set as primary account"
-              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
-              display="inline-block"
+              class="text-yellow-500 dark:text-yellow-300"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1158,13 +1108,11 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1181,13 +1129,11 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
-              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
-              overflow="visible"
               role="img"
-              style="vertical-align: text-bottom;"
+              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
               viewBox="0 0 16 16"
               width="20"
             >

From 0788e82f9d41d62f081484f3bf0710208b845502 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Fri, 27 Dec 2024 09:01:29 +0100
Subject: [PATCH 7/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 .../__snapshots__/Accounts.test.tsx.snap      | 154 ++++++++++++------
 1 file changed, 105 insertions(+), 49 deletions(-)

diff --git a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
index 27dfb1c79..ff500af69 100644
--- a/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
+++ b/src/renderer/routes/__snapshots__/Accounts.test.tsx.snap
@@ -470,7 +470,7 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           </div>
           <div>
             <button
-              class="mb-1 ml-1 cursor-pointer align-middle"
+              class="flex items-center mb-1 ml-1 cursor-pointer align-middle"
               title="Open Host"
               type="button"
             >
@@ -481,10 +481,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -498,7 +500,7 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           </div>
           <div>
             <button
-              class="ml-1 cursor-pointer align-middle"
+              class="flex items-center ml-1 cursor-pointer align-middle"
               title="Open Developer Settings"
               type="button"
             >
@@ -509,10 +511,12 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-apps"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -534,12 +538,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -555,12 +561,14 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
           >
             <svg
               aria-label="Set as primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -577,11 +585,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -598,11 +608,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -623,20 +635,24 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
     >
       Add new account
     </div>
-    <div>
+    <div
+      class="flex items-center"
+    >
       <button
-        class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+        class="flex items-center hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
         title="Login with GitHub"
         type="button"
       >
         <svg
           aria-label="Login with GitHub App"
           class="octicon octicon-mark-github"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
+          overflow="visible"
           role="img"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -646,11 +662,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="mb-2 ml-1"
+          class="octicon octicon-plus mb-2 ml-1"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="14"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -660,18 +678,20 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
       </button>
       <button
-        class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+        class="flex items-center hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
         title="Login with Personal Access Token"
         type="button"
       >
         <svg
           aria-label="Login with Personal Access Token"
           class="octicon octicon-key"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="18"
+          overflow="visible"
           role="img"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="18"
         >
@@ -681,11 +701,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="mb-2 ml-1"
+          class="octicon octicon-plus mb-2 ml-1"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="14"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -695,18 +717,20 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
       </button>
       <button
-        class="hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
+        class="flex items-center hover:text-gray-500 py-1 px-2 my-1 mx-2 focus:outline-none"
         title="Login with OAuth App"
         type="button"
       >
         <svg
           aria-label="Login with OAuth App"
           class="octicon octicon-person"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="20"
+          overflow="visible"
           role="img"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="20"
         >
@@ -716,11 +740,13 @@ exports[`renderer/routes/Accounts.tsx General should render itself & its childre
         </svg>
         <svg
           aria-hidden="true"
-          class="mb-2"
+          class="octicon octicon-plus mb-2"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="14"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="14"
         >
@@ -749,12 +775,14 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
     >
       <svg
         aria-label="Go Back"
-        class="hover:text-gray-400"
+        class="octicon octicon-arrow-left hover:text-gray-400"
+        display="inline-block"
         fill="currentColor"
         focusable="false"
         height="20"
+        overflow="visible"
         role="img"
-        style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+        style="vertical-align: text-bottom;"
         viewBox="0 0 16 16"
         width="20"
       >
@@ -772,11 +800,13 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
       >
         <svg
           aria-hidden="true"
-          class="mr-2"
+          class="octicon octicon-person mr-2"
+          display="inline-block"
           fill="currentColor"
           focusable="false"
           height="16"
-          style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+          overflow="visible"
+          style="vertical-align: text-bottom;"
           viewBox="0 0 16 16"
           width="16"
         >
@@ -837,11 +867,13 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
               >
                 <svg
                   aria-hidden="true"
-                  class="text-red-500"
+                  class="octicon octicon-alert-fill text-red-500"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 12 12"
                   width="12"
                 >
@@ -854,7 +886,7 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           </div>
           <div>
             <button
-              class="mb-1 ml-1 cursor-pointer align-middle"
+              class="flex items-center mb-1 ml-1 cursor-pointer align-middle"
               title="Open Host"
               type="button"
             >
@@ -865,10 +897,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-mark-github"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -882,7 +916,7 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           </div>
           <div>
             <button
-              class="ml-1 cursor-pointer align-middle"
+              class="flex items-center ml-1 cursor-pointer align-middle"
               title="Open Developer Settings"
               type="button"
             >
@@ -893,10 +927,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-key"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -917,12 +953,14 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -939,12 +977,14 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Set as primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -961,11 +1001,13 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -982,11 +1024,13 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1029,7 +1073,7 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           </div>
           <div>
             <button
-              class="mb-1 ml-1 cursor-pointer align-middle"
+              class="flex items-center mb-1 ml-1 cursor-pointer align-middle"
               title="Open Host"
               type="button"
             >
@@ -1040,10 +1084,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-server"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -1057,7 +1103,7 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           </div>
           <div>
             <button
-              class="ml-1 cursor-pointer align-middle"
+              class="flex items-center ml-1 cursor-pointer align-middle"
               title="Open Developer Settings"
               type="button"
             >
@@ -1068,10 +1114,12 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
                 <svg
                   aria-hidden="true"
                   class="octicon octicon-person"
+                  display="inline-block"
                   fill="currentColor"
                   focusable="false"
                   height="12"
-                  style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+                  overflow="visible"
+                  style="vertical-align: text-bottom;"
                   viewBox="0 0 16 16"
                   width="12"
                 >
@@ -1093,12 +1141,14 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star-fill text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1114,12 +1164,14 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
           >
             <svg
               aria-label="Set as primary account"
-              class="text-yellow-500 dark:text-yellow-300"
+              class="octicon octicon-star text-yellow-500 dark:text-yellow-300"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1136,11 +1188,13 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Refresh octocat"
               class="octicon octicon-sync"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >
@@ -1157,11 +1211,13 @@ exports[`renderer/routes/Accounts.tsx General should render with PAT scopes warn
             <svg
               aria-label="Logout octocat"
               class="octicon octicon-sign-out"
+              display="inline-block"
               fill="currentColor"
               focusable="false"
               height="20"
+              overflow="visible"
               role="img"
-              style="display: inline-block; user-select: none; vertical-align: text-bottom; overflow: visible;"
+              style="vertical-align: text-bottom;"
               viewBox="0 0 16 16"
               width="20"
             >

From a6ab3cc165c884c8f6fb674b5442e632ce72c482 Mon Sep 17 00:00:00 2001
From: Adam Setch <adam.setch@outlook.com>
Date: Sat, 28 Dec 2024 08:16:58 +0100
Subject: [PATCH 8/8] feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <adam.setch@outlook.com>
---
 src/renderer/__mocks__/partial-mocks.ts |  1 +
 src/renderer/__mocks__/state-mocks.ts   |  4 +++
 src/renderer/routes/Accounts.tsx        | 33 ++++++++++++-------------
 3 files changed, 21 insertions(+), 17 deletions(-)

diff --git a/src/renderer/__mocks__/partial-mocks.ts b/src/renderer/__mocks__/partial-mocks.ts
index 5db97d316..04ff306bc 100644
--- a/src/renderer/__mocks__/partial-mocks.ts
+++ b/src/renderer/__mocks__/partial-mocks.ts
@@ -13,6 +13,7 @@ export function partialMockNotification(
       hostname: Constants.GITHUB_API_BASE_URL as Hostname,
       token: mockToken,
       user: mockGitifyUser,
+      hasRequiredScopes: true,
     },
     subject: subject as Subject,
   };
diff --git a/src/renderer/__mocks__/state-mocks.ts b/src/renderer/__mocks__/state-mocks.ts
index d167f44b0..c88b8f460 100644
--- a/src/renderer/__mocks__/state-mocks.ts
+++ b/src/renderer/__mocks__/state-mocks.ts
@@ -43,6 +43,7 @@ export const mockOAuthAccount: Account = {
   token: '1234568790' as Token,
   hostname: 'github.gitify.io' as Hostname,
   user: mockGitifyUser,
+  hasRequiredScopes: true,
 };
 
 export const mockGitHubCloudAccount: Account = {
@@ -52,6 +53,7 @@ export const mockGitHubCloudAccount: Account = {
   hostname: Constants.DEFAULT_AUTH_OPTIONS.hostname,
   user: mockGitifyUser,
   version: 'latest',
+  hasRequiredScopes: true,
 };
 
 export const mockGitHubEnterpriseServerAccount: Account = {
@@ -60,6 +62,7 @@ export const mockGitHubEnterpriseServerAccount: Account = {
   token: '1234568790' as Token,
   hostname: 'github.gitify.io' as Hostname,
   user: mockGitifyUser,
+  hasRequiredScopes: true,
 };
 
 export const mockGitHubAppAccount: Account = {
@@ -68,6 +71,7 @@ export const mockGitHubAppAccount: Account = {
   token: '987654321' as Token,
   hostname: Constants.DEFAULT_AUTH_OPTIONS.hostname,
   user: mockGitifyUser,
+  hasRequiredScopes: true,
 };
 
 export const mockAuth: AuthState = {
diff --git a/src/renderer/routes/Accounts.tsx b/src/renderer/routes/Accounts.tsx
index beeb0f0ed..2238401e4 100644
--- a/src/renderer/routes/Accounts.tsx
+++ b/src/renderer/routes/Accounts.tsx
@@ -102,23 +102,22 @@ export const AccountsRoute: FC = () => {
                     </span>
                   </button>
 
-                  {account.method === 'Personal Access Token' &&
-                    account.hasRequiredScopes === false && (
-                      <span className="text-xs font-medium italic">
-                        <button
-                          type="button"
-                          className="cursor-pointer"
-                          title={`This account is missing one or more required scopes: \n  - ${Constants.AUTH_SCOPE.join('\n  - ')}`}
-                          aria-label="missing-scopes"
-                          onClick={() => openDeveloperSettings(account)}
-                        >
-                          <AlertFillIcon
-                            size={Size.XSMALL}
-                            className={IconColor.RED}
-                          />
-                        </button>
-                      </span>
-                    )}
+                  {account.hasRequiredScopes === false && (
+                    <span className="text-xs font-medium italic">
+                      <button
+                        type="button"
+                        className="cursor-pointer"
+                        title={`This account is missing one or more required scopes: \n  - ${Constants.AUTH_SCOPE.join('\n  - ')}`}
+                        aria-label="missing-scopes"
+                        onClick={() => openDeveloperSettings(account)}
+                      >
+                        <AlertFillIcon
+                          size={Size.XSMALL}
+                          className={IconColor.RED}
+                        />
+                      </button>
+                    </span>
+                  )}
                 </div>
                 <div>
                   <button