feat(accounts): warn when missing scopes

Signed-off-by: Adam Setch <[email protected]>

Author: setchy

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

src/renderer/routes/__snapshots__/Accounts.test.tsx.snap

@@ -50,6 +50,7 @@ export interface Account {
   hostname: Hostname;
   token: Token;
   user: GitifyUser | null;
+  hasRequiredScopes?: boolean;
 }
 
 export type SettingsValue =

src/renderer/types.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',