diff --git a/src/app.tsx b/src/app.tsx
index ba4c4e721..4dfd4aad5 100644
--- a/src/app.tsx
+++ b/src/app.tsx
@@ -12,8 +12,8 @@ import { AppContext, AppProvider } from './context/App';
 import { AccountsRoute } from './routes/Accounts';
 import { FiltersRoute } from './routes/Filters';
 import { LoginRoute } from './routes/Login';
-import { LoginWithOAuthApp } from './routes/LoginWithOAuthApp';
-import { LoginWithPersonalAccessToken } from './routes/LoginWithPersonalAccessToken';
+import { LoginWithOAuthAppRoute } from './routes/LoginWithOAuthApp';
+import { LoginWithPersonalAccessTokenRoute } from './routes/LoginWithPersonalAccessToken';
 import { NotificationsRoute } from './routes/Notifications';
 import { SettingsRoute } from './routes/Settings';
 
@@ -71,9 +71,12 @@ export const App = () => {
             <Route path="/login" element={<LoginRoute />} />
             <Route
               path="/login-personal-access-token"
-              element={<LoginWithPersonalAccessToken />}
+              element={<LoginWithPersonalAccessTokenRoute />}
+            />
+            <Route
+              path="/login-oauth-app"
+              element={<LoginWithOAuthAppRoute />}
             />
-            <Route path="/login-oauth-app" element={<LoginWithOAuthApp />} />
           </Routes>
         </div>
       </Router>
diff --git a/src/routes/LoginWithOAuthApp.test.tsx b/src/routes/LoginWithOAuthApp.test.tsx
index 3dc1a2ad2..b1bce2b7e 100644
--- a/src/routes/LoginWithOAuthApp.test.tsx
+++ b/src/routes/LoginWithOAuthApp.test.tsx
@@ -3,7 +3,7 @@ import { MemoryRouter } from 'react-router-dom';
 import { AppContext } from '../context/App';
 import type { AuthState, ClientID, ClientSecret, Hostname } from '../types';
 import * as comms from '../utils/comms';
-import { LoginWithOAuthApp, validate } from './LoginWithOAuthApp';
+import { LoginWithOAuthAppRoute, validate } from './LoginWithOAuthApp';
 
 const mockNavigate = jest.fn();
 jest.mock('react-router-dom', () => ({
@@ -30,7 +30,7 @@ describe('routes/LoginWithOAuthApp.tsx', () => {
     const tree = render(
       <AppContext.Provider value={{ auth: mockAuth }}>
         <MemoryRouter>
-          <LoginWithOAuthApp />
+          <LoginWithOAuthAppRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
@@ -42,7 +42,7 @@ describe('routes/LoginWithOAuthApp.tsx', () => {
     render(
       <AppContext.Provider value={{ auth: mockAuth }}>
         <MemoryRouter>
-          <LoginWithOAuthApp />
+          <LoginWithOAuthAppRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
@@ -81,7 +81,7 @@ describe('routes/LoginWithOAuthApp.tsx', () => {
       render(
         <AppContext.Provider value={{ auth: mockAuth }}>
           <MemoryRouter>
-            <LoginWithOAuthApp />
+            <LoginWithOAuthAppRoute />
           </MemoryRouter>
         </AppContext.Provider>,
       );
@@ -95,7 +95,7 @@ describe('routes/LoginWithOAuthApp.tsx', () => {
       render(
         <AppContext.Provider value={{ auth: mockAuth }}>
           <MemoryRouter>
-            <LoginWithOAuthApp />
+            <LoginWithOAuthAppRoute />
           </MemoryRouter>
         </AppContext.Provider>,
       );
@@ -120,7 +120,7 @@ describe('routes/LoginWithOAuthApp.tsx', () => {
         }}
       >
         <MemoryRouter>
-          <LoginWithOAuthApp />
+          <LoginWithOAuthAppRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
@@ -147,7 +147,7 @@ describe('routes/LoginWithOAuthApp.tsx', () => {
     render(
       <AppContext.Provider value={{ auth: mockAuth }}>
         <MemoryRouter>
-          <LoginWithOAuthApp />
+          <LoginWithOAuthAppRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
@@ -173,7 +173,7 @@ describe('routes/LoginWithOAuthApp.tsx', () => {
     render(
       <AppContext.Provider value={{ auth: mockAuth }}>
         <MemoryRouter>
-          <LoginWithOAuthApp />
+          <LoginWithOAuthAppRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
diff --git a/src/routes/LoginWithOAuthApp.tsx b/src/routes/LoginWithOAuthApp.tsx
index 1e0cbbaf6..de44218d2 100644
--- a/src/routes/LoginWithOAuthApp.tsx
+++ b/src/routes/LoginWithOAuthApp.tsx
@@ -59,7 +59,7 @@ export const validate = (values: IValues): IFormErrors => {
   return errors;
 };
 
-export const LoginWithOAuthApp: FC = () => {
+export const LoginWithOAuthAppRoute: FC = () => {
   const navigate = useNavigate();
 
   const { loginWithOAuthApp } = useContext(AppContext);
diff --git a/src/routes/LoginWithPersonalAccessToken.test.tsx b/src/routes/LoginWithPersonalAccessToken.test.tsx
index afcb05b78..cc97037df 100644
--- a/src/routes/LoginWithPersonalAccessToken.test.tsx
+++ b/src/routes/LoginWithPersonalAccessToken.test.tsx
@@ -9,7 +9,7 @@ import { MemoryRouter } from 'react-router-dom';
 import { AppContext } from '../context/App';
 import * as comms from '../utils/comms';
 import {
-  LoginWithPersonalAccessToken,
+  LoginWithPersonalAccessTokenRoute,
   validate,
 } from './LoginWithPersonalAccessToken';
 
@@ -32,7 +32,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
   it('renders correctly', () => {
     const tree = render(
       <MemoryRouter>
-        <LoginWithPersonalAccessToken />
+        <LoginWithPersonalAccessTokenRoute />
       </MemoryRouter>,
     );
 
@@ -42,7 +42,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
   it('let us go back', () => {
     render(
       <MemoryRouter>
-        <LoginWithPersonalAccessToken />
+        <LoginWithPersonalAccessTokenRoute />
       </MemoryRouter>,
     );
 
@@ -80,7 +80,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
           }}
         >
           <MemoryRouter>
-            <LoginWithPersonalAccessToken />
+            <LoginWithPersonalAccessTokenRoute />
           </MemoryRouter>
         </AppContext.Provider>,
       );
@@ -102,7 +102,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
           }}
         >
           <MemoryRouter>
-            <LoginWithPersonalAccessToken />
+            <LoginWithPersonalAccessTokenRoute />
           </MemoryRouter>
         </AppContext.Provider>,
       );
@@ -123,7 +123,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
         }}
       >
         <MemoryRouter>
-          <LoginWithPersonalAccessToken />
+          <LoginWithPersonalAccessTokenRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
@@ -155,7 +155,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
         }}
       >
         <MemoryRouter>
-          <LoginWithPersonalAccessToken />
+          <LoginWithPersonalAccessTokenRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
@@ -181,7 +181,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
   it('should render the form with errors', () => {
     render(
       <MemoryRouter>
-        <LoginWithPersonalAccessToken />
+        <LoginWithPersonalAccessTokenRoute />
       </MemoryRouter>,
     );
 
@@ -206,7 +206,7 @@ describe('routes/LoginWithPersonalAccessToken.tsx', () => {
         }}
       >
         <MemoryRouter>
-          <LoginWithPersonalAccessToken />
+          <LoginWithPersonalAccessTokenRoute />
         </MemoryRouter>
       </AppContext.Provider>,
     );
diff --git a/src/routes/LoginWithPersonalAccessToken.tsx b/src/routes/LoginWithPersonalAccessToken.tsx
index 2f76d4f1b..cebc284fd 100644
--- a/src/routes/LoginWithPersonalAccessToken.tsx
+++ b/src/routes/LoginWithPersonalAccessToken.tsx
@@ -44,7 +44,7 @@ export const validate = (values: IValues): IFormErrors => {
   return errors;
 };
 
-export const LoginWithPersonalAccessToken: FC = () => {
+export const LoginWithPersonalAccessTokenRoute: FC = () => {
   const { loginWithPersonalAccessToken } = useContext(AppContext);
   const navigate = useNavigate();
   const [isValidToken, setIsValidToken] = useState<boolean>(true);