feat(auth): support fine-grained personal access tokens

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

Author: setchy

src/routes/LoginWithPersonalAccessToken.test.tsx

@@ -89,7 +89,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
         target: { value: '' },
       });
 
-      fireEvent.click(screen.getByText('Generate a PAT'));
+      fireEvent.click(screen.getByText('Generate a PAT (classic)'));
 
       expect(openExternalLinkMock).toHaveBeenCalledTimes(0);
     });
@@ -107,7 +107,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
         </AppContext.Provider>,
       );
 
-      fireEvent.click(screen.getByText('Generate a PAT'));
+      fireEvent.click(screen.getByText('Generate a PAT (classic)'));
 
       expect(openExternalLinkMock).toHaveBeenCalledTimes(1);
     });

src/routes/LoginWithPersonalAccessToken.tsx

@@ -10,7 +10,9 @@ import { AppContext } from '../context/App';
 import { type Hostname, Size, type Token } from '../types';
 import type { LoginPersonalAccessTokenOptions } from '../utils/auth/types';
 import {
-  getNewTokenURL,
+  getNewClassicTokenURL,
+  getNewFineGrainedTokenURL,
+  isValidFineGrainedToken,
   isValidHostname,
   isValidToken,
 } from '../utils/auth/utils';
@@ -37,7 +39,10 @@ export const validate = (values: IValues): IFormErrors => {
 
   if (!values.token) {
     errors.token = 'Required';
-  } else if (!isValidToken(values.token)) {
+  } else if (
+    !isValidToken(values.token) &&
+    !isValidFineGrainedToken(values.token)
+  ) {
     errors.token = 'Invalid token.';
   }
 
@@ -65,13 +70,23 @@ export const LoginWithPersonalAccessToken: FC = () => {
               </div>
               <div className="mt-3">
                 <Button
-                  label="Generate a PAT"
+                  label="Generate a PAT (classic)"
                   disabled={!values.hostname}
                   icon={{ icon: KeyIcon, size: Size.XSMALL }}
-                  url={getNewTokenURL(values.hostname)}
+                  url={getNewClassicTokenURL(values.hostname)}
                   size="xs"
                 >
-                  Generate a PAT
+                  Generate a PAT (classic)
+                </Button>{' '}
+                or{' '}
+                <Button
+                  label="Generate a PAT (fine-grained)"
+                  disabled={!values.hostname}
+                  icon={{ icon: KeyIcon, size: Size.XSMALL }}
+                  url={getNewFineGrainedTokenURL(values.hostname)}
+                  size="xs"
+                >
+                  Generate a PAT (fine-grained)
                 </Button>
                 <span className="mx-1">
                   on GitHub then paste your{' '}

src/routes/__snapshots__/LoginWithPersonalAccessToken.test.tsx.snap

@@ -18,7 +18,11 @@ import type {
 import * as apiRequests from '../api/request';
 import type { AuthMethod } from './types';
 import * as auth from './utils';
-import { getNewOAuthAppURL, getNewTokenURL } from './utils';
+import {
+  getNewClassicTokenURL,
+  getNewFineGrainedTokenURL,
+  getNewOAuthAppURL,
+} from './utils';
 
 const browserWindow = new remote.BrowserWindow();
 
@@ -283,24 +287,42 @@ describe('utils/auth/utils.ts', () => {
     ).toBe('https://github.com/settings');
   });
 
-  describe('getNewTokenURL', () => {
-    it('should generate new PAT url - github cloud', () => {
+  describe('getNewClassicTokenURL', () => {
+    it('should generate new PAT (classic) url - github cloud', () => {
       expect(
-        getNewTokenURL('github.com' as Hostname).startsWith(
+        getNewClassicTokenURL('github.com' as Hostname).startsWith(
           'https://github.com/settings/tokens/new',
         ),
       ).toBeTruthy();
     });
 
-    it('should generate new PAT url - github server', () => {
+    it('should generate new PAT (classic) url - github server', () => {
       expect(
-        getNewTokenURL('github.gitify.io' as Hostname).startsWith(
+        getNewClassicTokenURL('github.gitify.io' as Hostname).startsWith(
           'https://github.gitify.io/settings/tokens/new',
         ),
       ).toBeTruthy();
     });
   });
 
+  describe('getNewFineGrainedTokenURL', () => {
+    it('should generate new PAT (fine-grained) url - github cloud', () => {
+      expect(
+        getNewFineGrainedTokenURL('github.com' as Hostname).startsWith(
+          'https://github.com/settings/personal-access-tokens/new',
+        ),
+      ).toBeTruthy();
+    });
+
+    it('should generate new PAT (fine-grained) url - github server', () => {
+      expect(
+        getNewFineGrainedTokenURL('github.gitify.io' as Hostname).startsWith(
+          'https://github.gitify.io/settings/personal-access-tokens/new',
+        ),
+      ).toBeTruthy();
+    });
+  });
+
   describe('getNewOAuthAppURL', () => {
     it('should generate new oauth app url - github cloud', () => {
       expect(
@@ -369,6 +391,26 @@ describe('utils/auth/utils.ts', () => {
     });
   });
 
+  describe('isValidFineGrainedToken', () => {
+    it('should validate fine-grained token - valid', () => {
+      expect(
+        auth.isValidFineGrainedToken(
+          'github_pat_1234567890123456789012_asdfghjklPOIUYTREWQ0987654321asdfghjklasdfghjklasdfghjkl123' as Token,
+        ),
+      ).toBeTruthy();
+    });
+
+    it('should validate fine-grained token - empty', () => {
+      expect(auth.isValidFineGrainedToken('' as Token)).toBeFalsy();
+    });
+
+    it('should validate fine-grained token - invalid', () => {
+      expect(
+        auth.isValidFineGrainedToken('1234567890asdfg' as Token),
+      ).toBeFalsy();
+    });
+  });
+
   describe('hasAccounts', () => {
     it('should return true', () => {
       expect(auth.hasAccounts(mockAuth)).toBeTruthy();

src/utils/auth/utils.test.ts

@@ -194,7 +194,7 @@ export function getDeveloperSettingsURL(account: Account): Link {
   return settingsURL.toString() as Link;
 }
 
-export function getNewTokenURL(hostname: Hostname): Link {
+export function getNewClassicTokenURL(hostname: Hostname): Link {
   const date = format(new Date(), 'PP p');
   const newTokenURL = new URL(`https://${hostname}/settings/tokens/new`);
   newTokenURL.searchParams.append('description', `Gitify (Created on ${date})`);
@@ -203,6 +203,17 @@ export function getNewTokenURL(hostname: Hostname): Link {
   return newTokenURL.toString() as Link;
 }
 
+export function getNewFineGrainedTokenURL(hostname: Hostname): Link {
+  const date = format(new Date(), 'PP p');
+  const newTokenURL = new URL(
+    `https://${hostname}/settings/personal-access-tokens/new`,
+  );
+  newTokenURL.searchParams.append('description', `Gitify (Created on ${date})`);
+  newTokenURL.searchParams.append('scopes', Constants.AUTH_SCOPE.join(','));
+
+  return newTokenURL.toString() as Link;
+}
+
 export function getNewOAuthAppURL(hostname: Hostname): Link {
   const date = format(new Date(), 'PP p');
   const newOAuthAppURL = new URL(
@@ -238,6 +249,10 @@ export function isValidToken(token: Token) {
   return /^[A-Z0-9_]{40}$/i.test(token);
 }
 
+export function isValidFineGrainedToken(token: Token) {
+  return /^github_pat_[A-Z0-9]{22}_[A-Z0-9]{59}$/i.test(token);
+}
+
 export function getAccountUUID(account: Account): string {
   return btoa(`${account.hostname}-${account.user.id}-${account.method}`);
 }