feat: improve enterprise login

src/routes/LoginEnterprise.test.tsx

@@ -2,7 +2,6 @@ import { fireEvent, render, screen } from '@testing-library/react';
 import { MemoryRouter } from 'react-router-dom';
 import * as TestRenderer from 'react-test-renderer';
 const { ipcRenderer } = require('electron');
-import { mockedEnterpriseAccounts } from '../__mocks__/mockedData';
 import { AppContext } from '../context/App';
 import type { AuthState } from '../types';
 import { LoginEnterpriseRoute, validate } from './LoginEnterprise';
@@ -75,35 +74,6 @@ describe('routes/LoginEnterprise.tsx', () => {
     expect(validate(values).clientSecret).toBe('Invalid client secret.');
   });
 
-  it('should receive a logged-in enterprise account', () => {
-    const { rerender } = render(
-      <AppContext.Provider value={{ accounts: mockAccounts }}>
-        <MemoryRouter>
-          <LoginEnterpriseRoute />
-        </MemoryRouter>
-      </AppContext.Provider>,
-    );
-
-    rerender(
-      <AppContext.Provider
-        value={{
-          accounts: {
-            enterpriseAccounts: mockedEnterpriseAccounts,
-            user: null,
-          },
-        }}
-      >
-        <MemoryRouter>
-          <LoginEnterpriseRoute />
-        </MemoryRouter>
-      </AppContext.Provider>,
-    );
-
-    expect(ipcRenderer.send).toHaveBeenCalledTimes(1);
-    expect(ipcRenderer.send).toHaveBeenCalledWith('reopen-window');
-    expect(mockNavigate).toHaveBeenNthCalledWith(1, -1);
-  });
-
   it('should render the form with errors', () => {
     render(
       <AppContext.Provider value={{ accounts: mockAccounts }}>

src/routes/LoginEnterprise.tsx

@@ -1,8 +1,6 @@
-const ipcRenderer = require('electron').ipcRenderer;
-
 import { ArrowLeftIcon } from '@primer/octicons-react';
 
-import { type FC, useCallback, useContext, useEffect } from 'react';
+import { type FC, useCallback, useContext } from 'react';
 import { Form, type FormRenderProps } from 'react-final-form';
 import { useNavigate } from 'react-router-dom';
 
@@ -52,19 +50,9 @@ export const validate = (values: IValues): IFormErrors => {
 };
 
 export const LoginEnterpriseRoute: FC = () => {
-  const {
-    accounts: { enterpriseAccounts },
-    loginEnterprise,
-  } = useContext(AppContext);
+  const { loginEnterprise } = useContext(AppContext);
   const navigate = useNavigate();
 
-  useEffect(() => {
-    if (enterpriseAccounts.length) {
-      ipcRenderer.send('reopen-window');
-      navigate(-1);
-    }
-  }, [enterpriseAccounts]);
-
   const renderForm = (formProps: FormRenderProps) => {
     const { handleSubmit, submitting, pristine } = formProps;
 
@@ -99,6 +87,7 @@ export const LoginEnterpriseRoute: FC = () => {
   const login = useCallback(async (data: IValues) => {
     try {
       await loginEnterprise(data as AuthOptions);
+      navigate(-1);
     } catch (err) {
       // Skip
     }

src/routes/Settings.test.tsx

@@ -499,6 +499,28 @@ describe('routes/Settings.tsx', () => {
       );
     });
 
+    it('should go to the personal token login route', async () => {
+      await act(async () => {
+        render(
+          <AppContext.Provider
+            value={{
+              settings: mockSettings,
+              accounts: mockAccounts,
+            }}
+          >
+            <MemoryRouter>
+              <SettingsRoute />
+            </MemoryRouter>
+          </AppContext.Provider>,
+        );
+      });
+
+      fireEvent.click(screen.getByTitle('Login with Personal Token'));
+      expect(mockNavigate).toHaveBeenNthCalledWith(1, '/login-token', {
+        replace: true,
+      });
+    });
+
     it('should go to the enterprise login route', async () => {
       await act(async () => {
         render(
@@ -539,7 +561,7 @@ describe('routes/Settings.tsx', () => {
         );
       });
 
-      fireEvent.click(screen.getByTitle('Logout from octocat'));
+      fireEvent.click(screen.getByTitle('Logout'));
 
       expect(logoutMock).toHaveBeenCalledTimes(1);
 

src/routes/Settings.tsx

@@ -1,5 +1,6 @@
 import {
   ArrowLeftIcon,
+  OrganizationIcon,
   PersonAddIcon,
   SignOutIcon,
   XCircleIcon,
@@ -28,6 +29,7 @@ import {
   updateTrayTitle,
 } from '../utils/comms';
 import Constants from '../utils/constants';
+import { isGitHubLoggedIn } from '../utils/helpers';
 import { setTheme } from '../utils/theme';
 
 export const SettingsRoute: FC = () => {
@@ -75,13 +77,15 @@ export const SettingsRoute: FC = () => {
 
   useMemo(() => {
     (async () => {
-      const response = await getRootHypermediaLinks(
-        Constants.DEFAULT_AUTH_OPTIONS.hostname,
-        accounts.token,
-      );
+      if (isGitHubLoggedIn(accounts)) {
+        const response = await getRootHypermediaLinks(
+          Constants.DEFAULT_AUTH_OPTIONS.hostname,
+          accounts.token,
+        );
 
-      if (response.headers['x-oauth-scopes'].includes('repo'))
-        setRepoScope(true);
+        if (response.headers['x-oauth-scopes'].includes('repo'))
+          setRepoScope(true);
+      }
     })();
   }, [accounts.token]);
 
@@ -96,6 +100,10 @@ export const SettingsRoute: FC = () => {
     ipcRenderer.send('app-quit');
   }, []);
 
+  const goToPersonalToken = useCallback(() => {
+    return navigate('/login-token', { replace: true });
+  }, []);
+
   const goToEnterprise = useCallback(() => {
     return navigate('/login-enterprise', { replace: true });
   }, []);
@@ -309,13 +317,21 @@ export const SettingsRoute: FC = () => {
           Gitify v{appVersion}
         </button>
         <div>
+          <button
+            type="button"
+            className={footerButtonClass}
+            title="Login with Personal Token"
+            onClick={goToPersonalToken}
+          >
+            <PersonAddIcon size={20} aria-label="Login with Personal Token" />
+          </button>
           <button
             type="button"
             className={footerButtonClass}
             title="Login with GitHub Enterprise"
             onClick={goToEnterprise}
           >
-            <PersonAddIcon
+            <OrganizationIcon
               size={20}
               aria-label="Login with GitHub Enterprise"
             />
@@ -324,14 +340,11 @@ export const SettingsRoute: FC = () => {
           <button
             type="button"
             className={footerButtonClass}
-            title={`Logout from ${accounts.user.login}`}
+            title="Logout"
             role="button"
             onClick={logoutUser}
           >
-            <SignOutIcon
-              size={18}
-              aria-label={`Logout from ${accounts.user.login}`}
-            />
+            <SignOutIcon size={18} aria-label="Logout" />
           </button>
 
           <button