forked from BLC/sgeUpdated
Add 'sge-frontend/' from commit '5fa787e054b25ac53edc7ff0275ea7960a709401'
git-subtree-dir: sge-frontend git-subtree-mainline:876c278ac4git-subtree-split:5fa787e054
This commit is contained in:
302
sge-frontend/src/router/Router.js
Normal file
302
sge-frontend/src/router/Router.js
Normal file
@@ -0,0 +1,302 @@
|
||||
import { Suspense, useContext, lazy, useEffect, useState } from "react";
|
||||
import { useLayout } from "../utility/hooks/useLayout";
|
||||
import { AbilityContext } from "../utility/context/Can";
|
||||
import { useRouterTransition } from "../utility/hooks/useRouterTransition";
|
||||
import Spinner from "../@core/components/spinner/Loading-spinner";
|
||||
import LayoutWrapper from "../@core/layouts/components/layout-wrapper";
|
||||
import {
|
||||
BrowserRouter as AppRouter,
|
||||
Route,
|
||||
Switch,
|
||||
Redirect,
|
||||
} from "react-router-dom";
|
||||
import { DefaultRoute, Routes } from "./routes";
|
||||
import BlankLayout from "../@core/layouts/BlankLayout";
|
||||
import VerticalLayout from "../layouts/VerticalLayout";
|
||||
import HorizontalLayout from "../layouts/HorizontalLayout";
|
||||
import { useDispatch, useSelector } from "react-redux";
|
||||
// import LogoutTimer from "../components/logout-timer";
|
||||
// import TokenTimer from "../components/token-timer";
|
||||
import { handleLogout } from "../redux/actions/auth";
|
||||
|
||||
const Router = () => {
|
||||
const dispatch = useDispatch();
|
||||
const authState = useSelector((state) => state.auth);
|
||||
const [isUserLoggedIn, setIsUserLoggedIn] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
const accessTokenExp = parseInt(localStorage.getItem("accessTokenExp"));
|
||||
const accessTokenExpToDate = new Date(accessTokenExp * 1000);
|
||||
const dateNow = new Date(Date.now());
|
||||
|
||||
var difference = accessTokenExpToDate - dateNow;
|
||||
var minuteDifference = Math.floor(difference / (1000 * 60));
|
||||
// console.log("accessTokenExp", accessTokenExp);
|
||||
// console.log("minuteDifference", minuteDifference);
|
||||
if (accessTokenExp && minuteDifference < 0) {
|
||||
dispatch(handleLogout());
|
||||
}
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
const _unsubscribe_check_auth = () => {
|
||||
// TODO: refresh token system
|
||||
if (authState.isLoggedIn === true) {
|
||||
setIsUserLoggedIn(true);
|
||||
} else {
|
||||
const userJSON = `{"name":"${localStorage.getItem("currentUser")}"}`;
|
||||
const user = JSON.parse(userJSON);
|
||||
const accessToken = localStorage.getItem("accessToken");
|
||||
// const refreshToken = localStorage.getItem("refreshToken");
|
||||
if (user && accessToken) {
|
||||
dispatch({
|
||||
type: "LOGIN",
|
||||
payload: {
|
||||
user,
|
||||
accessToken,
|
||||
// refreshToken,
|
||||
id: user.uid,
|
||||
},
|
||||
});
|
||||
} else {
|
||||
setIsUserLoggedIn(false);
|
||||
dispatch({
|
||||
type: "LOGOUT",
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
_unsubscribe_check_auth();
|
||||
}, [authState.isLoggedIn]);
|
||||
|
||||
const [layout, setLayout] = useLayout();
|
||||
const [transition, setTransition] = useRouterTransition();
|
||||
const ability = useContext(AbilityContext);
|
||||
const DefaultLayout =
|
||||
layout === "horizontal" ? "HorizontalLayout" : "VerticalLayout";
|
||||
const Layouts = { BlankLayout, VerticalLayout, HorizontalLayout };
|
||||
const currentActiveItem = null;
|
||||
|
||||
const LayoutRoutesAndPaths = (layout) => {
|
||||
const LayoutRoutes = [];
|
||||
const LayoutPaths = [];
|
||||
|
||||
if (Routes) {
|
||||
Routes.filter((route) => {
|
||||
if (
|
||||
(route.layout === layout ||
|
||||
(route.layout === undefined && DefaultLayout === layout)) &&
|
||||
route.display != false
|
||||
) {
|
||||
LayoutRoutes.push(route);
|
||||
LayoutPaths.push(route.path);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return { LayoutRoutes, LayoutPaths };
|
||||
};
|
||||
|
||||
const ForgotPassword = lazy(() => import("../views/ForgotPassword"));
|
||||
|
||||
const ResetPassword = lazy(() => import("../views/ResetPassword"));
|
||||
|
||||
const NotAuthorized = lazy(() => import("../views/NotAuthorized"));
|
||||
|
||||
// ** Init Error Component
|
||||
const Error = lazy(() => import("../views/Error"));
|
||||
|
||||
/**
|
||||
** Final Route Component Checks for Login & User Role and then redirects to the route
|
||||
*/
|
||||
const FinalRoute = (props) => {
|
||||
const route = props.route;
|
||||
let action, resource;
|
||||
|
||||
// ** Assign vars based on route meta
|
||||
if (route.meta) {
|
||||
action = route.meta.action ? route.meta.action : null;
|
||||
resource = route.meta.resource ? route.meta.resource : null;
|
||||
}
|
||||
|
||||
if (
|
||||
(!isUserLoggedIn && route.meta === undefined) ||
|
||||
(!isUserLoggedIn &&
|
||||
route.meta &&
|
||||
!route.meta.authRoute &&
|
||||
!route.meta.publicRoute)
|
||||
) {
|
||||
/**
|
||||
** If user is not Logged in & route meta is undefined
|
||||
** OR
|
||||
** If user is not Logged in & route.meta.authRoute, !route.meta.publicRoute are undefined
|
||||
** Then redirect user to login
|
||||
*/
|
||||
|
||||
return <Redirect to="/login" />;
|
||||
} /*else if (route.meta && route.meta.authRoute && isUserLoggedIn) {
|
||||
// ** If route has meta and authRole and user is Logged in then redirect user to home page (DefaultRoute)
|
||||
return <Redirect to='/' />
|
||||
} else if (isUserLoggedIn) { // !ability.can(action || 'read', resource)
|
||||
// ** If user is Logged in and doesn't have ability to visit the page redirect the user to Not Authorized
|
||||
return <Redirect to='/misc/not-authorized' />
|
||||
} */ else {
|
||||
// ** If none of the above render component
|
||||
return <route.component {...props} />;
|
||||
}
|
||||
};
|
||||
|
||||
// ** Return Route to Render
|
||||
const ResolveRoutes = () => {
|
||||
return Object.keys(Layouts).map((layout, index) => {
|
||||
// ** Convert Layout parameter to Layout Component
|
||||
// ? Note: make sure to keep layout and component name equal
|
||||
|
||||
const LayoutTag = Layouts[layout];
|
||||
|
||||
// ** Get Routes and Paths of the Layout
|
||||
const { LayoutRoutes, LayoutPaths } = LayoutRoutesAndPaths(layout);
|
||||
|
||||
// ** We have freedom to display different layout for different route
|
||||
// ** We have made LayoutTag dynamic based on layout, we can also replace it with the only layout component,
|
||||
// ** that we want to implement like VerticalLayout or HorizontalLayout
|
||||
// ** We segregated all the routes based on the layouts and Resolved all those routes inside layouts
|
||||
|
||||
// ** RouterProps to pass them to Layouts
|
||||
const routerProps = {};
|
||||
|
||||
return (
|
||||
<Route path={LayoutPaths} key={index}>
|
||||
<LayoutTag
|
||||
routerProps={routerProps}
|
||||
layout={layout}
|
||||
setLayout={setLayout}
|
||||
transition={transition}
|
||||
setTransition={setTransition}
|
||||
currentActiveItem={currentActiveItem}
|
||||
>
|
||||
<Switch>
|
||||
{LayoutRoutes.map((route) => {
|
||||
return (
|
||||
<Route
|
||||
key={route.path}
|
||||
path={route.path}
|
||||
exact={route.exact === true}
|
||||
render={(props) => {
|
||||
// ** Assign props to routerProps
|
||||
Object.assign(routerProps, {
|
||||
...props,
|
||||
meta: route.meta,
|
||||
});
|
||||
|
||||
return (
|
||||
<Suspense fallback={<Spinner />}>
|
||||
{/* Layout Wrapper to add classes based on route's layout, appLayout and className */}
|
||||
<LayoutWrapper
|
||||
layout={DefaultLayout}
|
||||
transition={transition}
|
||||
setTransition={setTransition}
|
||||
/* Conditional props */
|
||||
/*eslint-disable */
|
||||
{...(route.appLayout
|
||||
? {
|
||||
appLayout: route.appLayout,
|
||||
}
|
||||
: {})}
|
||||
{...(route.meta
|
||||
? {
|
||||
routeMeta: route.meta,
|
||||
}
|
||||
: {})}
|
||||
{...(route.className
|
||||
? {
|
||||
wrapperClass: route.className,
|
||||
}
|
||||
: {})}
|
||||
/*eslint-enable */
|
||||
>
|
||||
{/* <route.component {...props} /> */}
|
||||
<FinalRoute route={route} {...props} />
|
||||
</LayoutWrapper>
|
||||
</Suspense>
|
||||
);
|
||||
}}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
</Switch>
|
||||
</LayoutTag>
|
||||
</Route>
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
return isUserLoggedIn === null ? (
|
||||
<Spinner />
|
||||
) : (
|
||||
<AppRouter basename={process.env.REACT_APP_BASENAME}>
|
||||
{/* {authState.isLoggedIn === isUserLoggedIn && isUserLoggedIn && (
|
||||
<>
|
||||
<LogoutTimer />
|
||||
<TokenTimer />
|
||||
</>
|
||||
)} */}
|
||||
<Switch>
|
||||
{/* If user is logged in Redirect user to DefaultRoute else to login */}
|
||||
<Route
|
||||
exact
|
||||
path="/"
|
||||
render={() => {
|
||||
return authState.isLoggedIn === isUserLoggedIn && isUserLoggedIn ? (
|
||||
<Redirect to={DefaultRoute} />
|
||||
) : (
|
||||
<Redirect to="/login" />
|
||||
);
|
||||
}}
|
||||
/>
|
||||
{/*
|
||||
<Route
|
||||
exact
|
||||
path='/'
|
||||
render={() => {
|
||||
return <Redirect to={DefaultRoute} />
|
||||
}}
|
||||
/>
|
||||
*/}
|
||||
{/* Not Auth Route */}
|
||||
<Route
|
||||
exact
|
||||
path="/not-authorized"
|
||||
render={(props) => (
|
||||
<Layouts.BlankLayout>
|
||||
<NotAuthorized />
|
||||
</Layouts.BlankLayout>
|
||||
)}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path="/sifremi-unuttum"
|
||||
render={() => (
|
||||
<Layouts.BlankLayout>
|
||||
<ForgotPassword />
|
||||
</Layouts.BlankLayout>
|
||||
)}
|
||||
/>
|
||||
<Route
|
||||
exact
|
||||
path="/sifre-sifirlama"
|
||||
render={() => (
|
||||
<Layouts.BlankLayout>
|
||||
<ResetPassword />
|
||||
</Layouts.BlankLayout>
|
||||
)}
|
||||
/>
|
||||
{ResolveRoutes()}
|
||||
{/* NotFound Error page */}
|
||||
<Route path="*" component={Error} />
|
||||
</Switch>
|
||||
</AppRouter>
|
||||
);
|
||||
};
|
||||
|
||||
export default Router;
|
||||
185
sge-frontend/src/router/routes/index.js
Normal file
185
sge-frontend/src/router/routes/index.js
Normal file
@@ -0,0 +1,185 @@
|
||||
import { lazy } from "react";
|
||||
|
||||
// ** Document title
|
||||
const TemplateTitle = "%s";
|
||||
|
||||
// ** Default Route
|
||||
const DefaultRoute = "/harita";
|
||||
|
||||
const permissions = JSON.parse(localStorage.getItem("permissions"));
|
||||
const permissionsList = permissions?.map(({ tag }) => tag);
|
||||
|
||||
function permissionCheck(permission) {
|
||||
return permissionsList?.includes(permission);
|
||||
}
|
||||
|
||||
// ** Merge Routes
|
||||
const Routes = [
|
||||
{
|
||||
path: "/harita",
|
||||
component: lazy(() => import("../../views/Map")),
|
||||
},
|
||||
{
|
||||
path: "/kullanicilar",
|
||||
component: lazy(() => import("../../views/UserManagement")),
|
||||
display: permissionCheck("paginate_users_get"),
|
||||
},
|
||||
{
|
||||
path: "/organizasyonlar",
|
||||
component: lazy(() => import("../../views/DataCenterManagement")),
|
||||
display: permissionCheck("paginate_datacenters_get"),
|
||||
},
|
||||
{
|
||||
path: "/roller",
|
||||
component: lazy(() => import("../../views/RoleManagement")),
|
||||
display: permissionCheck("paginate_roles_get"),
|
||||
},
|
||||
{
|
||||
path: "/veri-girisi",
|
||||
component: lazy(() => import("../../views/DataInput")),
|
||||
display: permissionCheck("dataset_create"),
|
||||
},
|
||||
{
|
||||
path: "/raporlar",
|
||||
component: lazy(() => import("../../views/DataSet/MainDataTables")),
|
||||
display: permissionCheck("paginate_datasets_get"),
|
||||
},
|
||||
{
|
||||
path: "/grafikler",
|
||||
component: lazy(() => import("../../views/Graphics")),
|
||||
display: permissionCheck("show_graphics"),
|
||||
},
|
||||
{
|
||||
path: "/emisyon-kaynaklari",
|
||||
component: lazy(() => import("../../views/DataSet/EmissionSource")),
|
||||
display: permissionCheck("paginate_emission_sources_get"),
|
||||
},
|
||||
{
|
||||
path: "/veri-sektorleri",
|
||||
component: lazy(() => import("../../views/DataSet/Sector")),
|
||||
display: permissionCheck("sectors_get"),
|
||||
},
|
||||
{
|
||||
path: "/sektor-alt-birimleri",
|
||||
component: lazy(() => import("../../views/DataSet/SubSector")),
|
||||
display: permissionCheck("sub_sectors_get"),
|
||||
},
|
||||
{
|
||||
path: "/faaliyet-alt-birimleri",
|
||||
component: lazy(() => import("../../views/DataSet/ActivitySubUnit")),
|
||||
display: permissionCheck("activity_sub_units_get"),
|
||||
},
|
||||
{
|
||||
path: "/verimerkezi",
|
||||
component: lazy(() => import("../../views/DataCenter")),
|
||||
},
|
||||
{
|
||||
path: "/alanlar",
|
||||
component: lazy(() => import("../../views/Areas/Areas")),
|
||||
display: permissionCheck("paginate_areas_get"),
|
||||
},
|
||||
{
|
||||
path: "/ulkeler",
|
||||
component: lazy(() => import("../../views/Areas/Countries")),
|
||||
display: permissionCheck("paginate_countries_get"),
|
||||
},
|
||||
{
|
||||
path: "/iller",
|
||||
component: lazy(() => import("../../views/Areas/Cities")),
|
||||
display: permissionCheck("paginate_cities_get"),
|
||||
},
|
||||
{
|
||||
path: "/ilceler",
|
||||
component: lazy(() => import("../../views/Areas/Districts")),
|
||||
display: permissionCheck("paginate_districts_get"),
|
||||
},
|
||||
{
|
||||
path: "/mahalleler",
|
||||
component: lazy(() => import("../../views/Areas/Neighborhoods")),
|
||||
display: permissionCheck("paginate_neighborhoods_get"),
|
||||
},
|
||||
{
|
||||
path: "/profil",
|
||||
component: lazy(() => import("../../views/UserProfile")),
|
||||
},
|
||||
{
|
||||
path: "/kullanici-aktivite",
|
||||
component: lazy(() => import("../../views/UserActivity")),
|
||||
display: permissionCheck("paginate_user_histories"),
|
||||
},
|
||||
{
|
||||
path: "/sistem-aktivite",
|
||||
component: lazy(() => import("../../views/SystemActivity")),
|
||||
display: permissionCheck("activities_get"),
|
||||
},
|
||||
|
||||
{
|
||||
path: "/bildirimler",
|
||||
component: lazy(() => import("../../views/Notifications")),
|
||||
},
|
||||
{
|
||||
path: "/login",
|
||||
component: lazy(() => import("../../views/Login")),
|
||||
layout: "BlankLayout",
|
||||
meta: {
|
||||
authRoute: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/sifremi-unuttum",
|
||||
component: lazy(() => import("../../views/ForgotPassword")),
|
||||
layout: "BlankLayout",
|
||||
},
|
||||
{
|
||||
path: "/sifre-sifirlama",
|
||||
component: lazy(() => import("../../views/ResetPassword")),
|
||||
layout: "BlankLayout",
|
||||
},
|
||||
{
|
||||
path: "/error",
|
||||
component: lazy(() => import("../../views/Error")),
|
||||
layout: "BlankLayout",
|
||||
},
|
||||
{
|
||||
path: "/sorular",
|
||||
component: lazy(() => import("../../views/Survey/Question")),
|
||||
display: permissionCheck("paginate_questions_get"),
|
||||
},
|
||||
{
|
||||
path: "/cevaplar",
|
||||
component: lazy(() => import("../../views/Survey/Answer")),
|
||||
display: permissionCheck("paginate_answers_get"),
|
||||
},
|
||||
{
|
||||
path: "/anketler",
|
||||
component: lazy(() => import("../../views/Survey/Surveys")),
|
||||
display: permissionCheck("paginate_surveys_get"),
|
||||
},
|
||||
{
|
||||
path: "/anket-sonuclari",
|
||||
component: lazy(() => import("../../views/Survey/SavedSurvey")),
|
||||
display: permissionCheck("surveys_get"),
|
||||
},
|
||||
{
|
||||
path: "/surveys/*",
|
||||
component: lazy(() => import("../../views/VerifyAndAccessSurvey")),
|
||||
layout: "BlankLayout",
|
||||
meta: {
|
||||
authRoute: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/surveyPage/*",
|
||||
component: lazy(() => import("../../views/Survey/SurveyPage")),
|
||||
layout: "BlankLayout",
|
||||
meta: {
|
||||
authRoute: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
path: "/iletisim",
|
||||
component: lazy(() => import("../../views/Communication")),
|
||||
},
|
||||
];
|
||||
|
||||
export { DefaultRoute, TemplateTitle, Routes };
|
||||
Reference in New Issue
Block a user