From fbacbf2a06f3d5523b992cad202c392908366b80 Mon Sep 17 00:00:00 2001
From: KelvinTegelaar <Kelvin@limenetworks.nl>
Date: Fri, 12 Apr 2024 14:52:19 +0200
Subject: [PATCH] corrected app.jsx

---
 src/App.jsx | 36 +++++++++++++++++++++++-------------
 1 file changed, 23 insertions(+), 13 deletions(-)

diff --git a/src/App.jsx b/src/App.jsx
index 3e151c25580c..db95409b5c98 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -11,16 +11,10 @@ import en from 'javascript-time-ago/locale/en.json'
 TimeAgo.addDefaultLocale(en)
 import { library } from '@fortawesome/fontawesome-svg-core'
 import { fas } from '@fortawesome/free-solid-svg-icons'
-import routes from 'src/routes'
-import { useAuthCheck } from './components/utilities/CippauthCheck'
-import importsMap from './importsMap'
 
 library.add(fas)
 
-const dynamicImport = (path) => {
-  return importsMap[path] || null
-}
-
+// Containers
 const DefaultLayout = React.lazy(() => import('./layout/DefaultLayout'))
 
 // Pages
@@ -31,7 +25,6 @@ const Page500 = React.lazy(() => import('./views/pages/page500/Page500'))
 const PageLogOut = React.lazy(() => import('src/views/pages/LogoutRedirect/PageLogOut'))
 const Login = React.lazy(() => import('./views/pages/login/Login'))
 const Logout = React.lazy(() => import('./views/pages/login/Logout'))
-//we loop through the routes array, dynamicly create the component by using dynamicImport, add the component to the route array as 'component' key.
 
 const App = () => {
   return (
@@ -57,12 +50,29 @@ const App = () => {
             }
           >
             {routes.map((route, idx) => {
-              const allowedRoles = route.allowedRoles
-              const Routecomponent = dynamicImport(route.path)
-              console.log('route', route)
-              console.log('Routecomponent', Routecomponent)
               return (
                 route.component && (
+                  <Route
+                    key={`route-${idx}`}
+                    path={route.path}
+                    exact={route.exact}
+                    name={route.name}
+                    element={
+                      <Suspense fallback={<Skeleton />}>
+                        <Helmet>
+                          <title>CIPP - {route.name}</title>
+                        </Helmet>
+                        <ErrorBoundary key={route.name}>
+                          <route.component />
+                        </ErrorBoundary>
+                      </Suspense>
+                    }
+                  />
+                )
+              )
+            })}
+            {adminRoutes.map((route, idx) => {
+              return (
                 route.component && (
                   <Route
                     key={`route-${idx}`}
@@ -76,7 +86,7 @@ const App = () => {
                             <title>CIPP - {route.name}</title>
                           </Helmet>
                           <ErrorBoundary key={route.name}>
-                            <Routecomponent />
+                            <route.component />
                           </ErrorBoundary>
                         </Suspense>
                       </PrivateRoute>