Store refresh token on login

front/src/App.tsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import People from './pages/people/People';
 import Companies from './pages/companies/Companies';
+import AuthCallback from './pages/auth/Callback';
+import Login from './pages/auth/Login';
 import AppLayout from './layout/AppLayout';
 import { Routes, Route, Navigate } from 'react-router-dom';
 
@@ -26,6 +28,8 @@ function App() {
             <Route path="/" element={<Navigate to="/people" replace />} />
             <Route path="/people" element={<People />} />
             <Route path="/companies" element={<Companies />} />
+            <Route path="/auth/callback" element={<AuthCallback />} />
+            <Route path="/auth/login" element={<Login />} />
           </Routes>
         </AppLayout>
       }

front/src/pages/auth/Callback.tsx

@@ -0,0 +1,17 @@
+import { useEffect } from 'react';
+import { useSearchParams, useNavigate } from 'react-router-dom';
+
+function Callback() {
+  const [searchParams] = useSearchParams();
+  const refreshToken = searchParams.get('refreshToken');
+  localStorage.setItem('refreshToken', refreshToken || '');
+
+  const navigate = useNavigate();
+  useEffect(() => {
+    navigate('/');
+  }, [navigate]);
+
+  return <></>;
+}
+
+export default Callback;

front/src/pages/auth/Login.tsx

@@ -0,0 +1,17 @@
+import { useEffect } from 'react';
+import { useNavigate } from 'react-router-dom';
+
+function Login() {
+  const refreshToken = localStorage.getItem('refreshToken');
+  const navigate = useNavigate();
+  useEffect(() => {
+    if (!refreshToken) {
+      window.location.href = process.env.REACT_APP_LOGIN_PROVIDER_URL || '';
+    }
+    navigate('/');
+  }, [refreshToken, navigate]);
+
+  return <></>;
+}
+
+export default Login;

front/src/pages/auth/__stories__/Callback.stories.tsx

@@ -0,0 +1,19 @@
+import { MemoryRouter } from 'react-router-dom';
+import Callback from '../Callback';
+import { ThemeProvider } from '@emotion/react';
+import { lightTheme } from '../../../layout/styles/themes';
+
+const component = {
+  title: 'Callback',
+  component: Callback,
+};
+
+export default component;
+
+export const CallbackDefault = () => (
+  <ThemeProvider theme={lightTheme}>
+    <MemoryRouter>
+      <Callback />
+    </MemoryRouter>
+  </ThemeProvider>
+);

front/src/pages/auth/__stories__/Login.stories.tsx

@@ -0,0 +1,19 @@
+import { MemoryRouter } from 'react-router-dom';
+import Login from '../Login';
+import { ThemeProvider } from '@emotion/react';
+import { lightTheme } from '../../../layout/styles/themes';
+
+const component = {
+  title: 'Login',
+  component: Login,
+};
+
+export default component;
+
+export const LoginDefault = () => (
+  <ThemeProvider theme={lightTheme}>
+    <MemoryRouter>
+      <Login />
+    </MemoryRouter>
+  </ThemeProvider>
+);

front/src/pages/auth/__tests__/Callback.test.tsx

@@ -0,0 +1,7 @@
+import { render } from '@testing-library/react';
+
+import { CallbackDefault } from '../__stories__/Callback.stories';
+
+it('Checks the Callback page render', () => {
+  render(<CallbackDefault />);
+});

front/src/pages/auth/__tests__/Login.test.tsx

@@ -0,0 +1,15 @@
+import { render } from '@testing-library/react';
+import { LoginDefault } from '../__stories__/Login.stories';
+
+const assignMock = jest.fn();
+
+delete window.location;
+window.location = { assign: assignMock };
+
+afterEach(() => {
+  assignMock.mockClear();
+});
+
+it('Checks the Login page render', () => {
+  render(<LoginDefault />);
+});