refactor console page - closes #234

Signed-off-by: Marcin Fabrykowski <git@fabrykowski.pl>

app/src/Console.js → app/src/components/console.jsx

@@ -2,13 +2,11 @@ import { Link, Navigate, useNavigate } from 'react-router-dom';
 import { Component, useState, useEffect } from 'react';
 import { useCookies } from "react-cookie";
 import { BrowserRouter, Routes, Route } from "react-router-dom";
-import RegisterPage from './pages/Register';
-import { LoginOrRegister } from './components/loginregister';
+import { LoginOrRegister } from '../components/loginregister';
 
 const Console = () => {
   const [cookies, setCookie] = useCookies();
   const [count, setCount] = useState(0);
-  const [name, setName] = useState("Marcin");
   const [user, setUser] = useState({});
 
   function getUserInfo() {
@@ -23,12 +21,11 @@ const Console = () => {
   if(!user.name) {
     console.log("No user, showing login/register");
     return(
-      <LoginOrRegister/>
+        <Navigate to='register'/>
     )
   }
-
   return (
-    <h1>Consolee</h1>
+    <h1>Consoleeeee</h1>
     )
 }
 

app/src/components/loginregister.jsx

+import { Link } from 'react-router-dom';
 import RegisterForm from '../components/registerForm';
 function LoginOrRegister() {
+  
   return <div>
-    <a href="/login">Login</a><br/>
+    <Link to='/console/login'>Login</Link><br/>
     or<br/>
     <RegisterForm/>
   </div>

app/src/index.js

@@ -2,9 +2,8 @@ import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';
 import App2 from './App';
-import Console from './Console';
-import RegisterPage from './pages/Register';
-import { LoginPageRedirect, LoginPageCallback } from './pages/LoginPage';
+import ConsolePage from './pages/ConsolePage';
+import { LoginPageCallback } from './pages/LoginPage';
 import reportWebVitals from './reportWebVitals';
 import { BrowserRouter, Routes, Route } from "react-router-dom";
 
@@ -22,9 +21,7 @@ export default function App() {
       <Routes>
         <Route path="/">
           <Route index element={<App2 />} />
-          <Route path="console/*" element={<Console />}/>
-          <Route path="register" element={<RegisterPage />} />
-          <Route path="login" element={<LoginPageRedirect />} />
+          <Route path="console/*" element={<ConsolePage />}/>
           <Route path="oauth2/callback" element={<LoginPageCallback />} />
         </Route>
       </Routes> 

app/src/pages/ConsolePage.js

+import { Link, Navigate, useNavigate } from 'react-router-dom';
+import { Component, useState, useEffect } from 'react';
+import { useCookies } from "react-cookie";
+import { BrowserRouter, Routes, Route } from "react-router-dom";
+import Console from '../components/console';
+import RegisterPage from './Register';
+import { LoginPageRedirect } from './LoginPage';
+
+const ConsolePage = () => {
+
+  return (
+      <Routes>
+        <Route>
+          <Route index element={<Console/> }/>
+          <Route path="login" element={<LoginPageRedirect/> }/>
+          <Route path="register" element={<RegisterPage/> }/>
+        </Route>
+      </Routes>
+    )
+}
+
+export default ConsolePage;

app/src/Console.test.js → app/src/pages/ConsolePage.test.js

 import { render, screen, waitFor, getByText} from '@testing-library/react';
-import Console from './Console';
-import { LoginOrRegister } from './components/loginregister';
-import { BrowserRouter, Routes, Route } from "react-router-dom";
-//import Cookies from 'universal-cookie';
-import { Cookies, useCookies, withCookies, CookiesProvider } from 'react-cookie';
+import ConsolePage from './ConsolePage';
+import { Cookies, CookiesProvider } from 'react-cookie';
+import { MemoryRouter, BrowserRouter, Routes, Route } from "react-router-dom";
 
 test('show login/register page if not logged', () => {
   render(
-    <Console/>
+      <MemoryRouter>
+        <ConsolePage/>
+      </MemoryRouter>
   )
   expect(screen.getByText(/register/i)).toBeInTheDocument();
   let login = screen.getByRole("link", {name: /login/i})
   expect(login).toBeInTheDocument();
-  expect(login).toHaveAttribute("href", "/login");
+  expect(login).toHaveAttribute("href", "/console/login");
 });
 
 test('show console page when logged in', () => {
   const cookies = new Cookies()
   cookies.set("accessToken", "sometoken")
   render(
-    <CookiesProvider cookies={cookies}>
-      <Console/>
-    </CookiesProvider>
+    <MemoryRouter>
+      <ConsolePage/>
+    </MemoryRouter>
   )
   expect(screen.queryByText(/register/i)).not.toBeInTheDocument();
   expect(() => screen.getByText(/login/i)).toThrow();

app/src/pages/Register.js

 import './Register.css';
 import RegisterForm from '../components/registerForm';
+import { LoginOrRegister } from '../components/loginregister';
 
 function RegisterPage() {
   return (
-    <RegisterForm/>
+    <LoginOrRegister/>
+//    <RegisterForm/>
   );
 }