Skip to content
Snippets Groups Projects
Commit afbf588b authored by Embruch, Gerd's avatar Embruch, Gerd
Browse files

added private routes

parent cae31b08
No related branches found
No related tags found
No related merge requests found
......@@ -23,6 +23,5 @@ cp ./.env.template.local ./.env.production.local
- [PM2](https://pm2.keymetrics.io/)
# Roadmap
- [ ] create private routes
- [ ] fix errors
- [ ] complete pages incl. password request and RAGChat
- [ ] fix errors
\ No newline at end of file
......@@ -389,9 +389,8 @@ cp ./.env.template.local ./.env.production.local
</ul>
<h1 id="roadmap">Roadmap</h1>
<ul>
<li><input type="checkbox" id="checkbox0"><label for="checkbox0">create private routes</label></li>
<li><input type="checkbox" id="checkbox0"><label for="checkbox0">complete pages incl. password request and RAGChat</label></li>
<li><input type="checkbox" id="checkbox1"><label for="checkbox1">fix errors</label></li>
<li><input type="checkbox" id="checkbox2"><label for="checkbox2">complete pages incl. password request and RAGChat</label></li>
</ul>
</body>
......
......@@ -55,6 +55,7 @@ function AuthState({ children }) {
value={{
login,
logout,
currentUser,
USER_ACTIONS,
dispatchCurrentUser
}}>
......
import React from 'react';
import { Navigate, useLocation } from 'react-router-dom';
import { useAuth } from '../contexts/Auth/AuthState';
function PrivateRoute({ children }) {
// #################################
// HOOKS
// #################################
// ### MAKE USE OF location
const location = useLocation();
// #################################
// FUNCTIONS
// #################################
// ### IMPORT CurrentUser FUNCTION FROM AuthContext
const { currentUser } = useAuth();
// #################################
// OUTPUT
// #################################
// if user is logged in, load children
// otherwise load login page, but remember originally requested page in location state.redirectTo
return currentUser ? children : <Navigate to='/login' replace state={{ redirectTo: location }} />;
}
export default PrivateRoute;
\ No newline at end of file
import { lazy, Suspense } from 'react';
import PrivateRoute from './PrivateRoute';
/**
* Lazily load the mentioned component which resides in the page directory
......@@ -8,15 +9,16 @@ import { lazy, Suspense } from 'react';
export function loadComponent(componentPath, lazyLoad, privateRoute) {
lazyLoad = typeof lazyLoad !== "undefined" ? lazyLoad : true;
privateRoute = typeof privateRoute !== "undefined" ? privateRoute : false;
// It is not possible to use a fully dynamic import statement, such as import(foo). Because foo could potentially be any path to any file in your system or project.
// The import() must contain at least some information about where the module is located.
const Component = lazyLoad ? lazy(() => import(/* @vite-ignore */`../pages/${componentPath}`)) : import(/* @vite-ignore */`../pages/${componentPath}`);
let element = privateRoute ? <PrivateRoute><Component /></PrivateRoute> : <Component />;
let element = lazyLoad ? <Suspense fallback={<span>Loading...</span>}><Component /></Suspense> : <Component />;
element = lazyLoad ? <Suspense fallback={<span>Loading...</span>}>{element}</Suspense> : element;
// Wrapping around the suspense component is mandatory
return element;
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment