From 2c1c0ceea6b6b14b16d92fbc8680901e77e32da4 Mon Sep 17 00:00:00 2001
From: pal-sig <88981777+pal-sig@users.noreply.github.com>
Date: Mon, 11 Oct 2021 16:21:15 +0530
Subject: [PATCH] fix: isLogged is now accounted into the reducer and
 redirection logic is moved to the AppLayout (#322)

---
 frontend/src/AppRoutes/index.tsx   | 17 +----------------
 frontend/src/modules/AppLayout.tsx | 14 ++++++++++++++
 frontend/src/store/reducers/app.ts |  2 ++
 frontend/src/types/reducer/app.ts  |  1 +
 4 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/frontend/src/AppRoutes/index.tsx b/frontend/src/AppRoutes/index.tsx
index a99c68b9d1..78ce774500 100644
--- a/frontend/src/AppRoutes/index.tsx
+++ b/frontend/src/AppRoutes/index.tsx
@@ -1,12 +1,10 @@
 import NotFound from 'components/NotFound';
 import Spinner from 'components/Spinner';
-import { IS_LOGGED_IN } from 'constants/auth';
-import ROUTES from 'constants/routes';
 import history from 'lib/history';
 import AppLayout from 'modules/AppLayout';
 import { RouteProvider } from 'modules/RouteProvider';
 import React, { Suspense } from 'react';
-import { Redirect, Route, Router, Switch } from 'react-router-dom';
+import { Route, Router, Switch } from 'react-router-dom';
 
 import routes from './routes';
 
@@ -21,19 +19,6 @@ const App = (): JSX.Element => (
 								<Route key={index} exact={exact} path={path} component={component} />
 							);
 						})}
-
-						{/* This logic should be moved to app layout */}
-						<Route
-							path="/"
-							exact
-							render={(): JSX.Element => {
-								return localStorage.getItem(IS_LOGGED_IN) === 'yes' ? (
-									<Redirect to={ROUTES.APPLICATION} />
-								) : (
-									<Redirect to={ROUTES.SIGN_UP} />
-								);
-							}}
-						/>
 						<Route path="*" exact component={NotFound} />
 					</Switch>
 				</Suspense>
diff --git a/frontend/src/modules/AppLayout.tsx b/frontend/src/modules/AppLayout.tsx
index 425eb4b939..f2f707cf31 100644
--- a/frontend/src/modules/AppLayout.tsx
+++ b/frontend/src/modules/AppLayout.tsx
@@ -1,7 +1,12 @@
 import { Layout } from 'antd';
 import SideNav from 'components/SideNav';
+import ROUTES from 'constants/routes';
+import history from 'lib/history';
 import React, { ReactNode, useEffect } from 'react';
+import { useSelector } from 'react-redux';
 import { useLocation } from 'react-router-dom';
+import { AppState } from 'store/reducers';
+import AppReducer from 'types/reducer/app';
 
 import TopNav from './Nav/TopNav';
 import { useRoute } from './RouteProvider';
@@ -16,11 +21,20 @@ const BaseLayout: React.FC<BaseLayoutProps> = ({ children }) => {
 	const location = useLocation();
 	const { dispatch } = useRoute();
 	const currentYear = new Date().getFullYear();
+	const { isLoggedIn } = useSelector<AppState, AppReducer>((state) => state.app);
 
 	useEffect(() => {
 		dispatch({ type: 'ROUTE_IS_LOADED', payload: location.pathname });
 	}, [location, dispatch]);
 
+	useEffect(() => {
+		if (isLoggedIn) {
+			history.push(ROUTES.APPLICATION);
+		} else {
+			history.push(ROUTES.SIGN_UP);
+		}
+	}, [isLoggedIn]);
+
 	return (
 		<Layout style={{ minHeight: '100vh' }}>
 			<SideNav />
diff --git a/frontend/src/store/reducers/app.ts b/frontend/src/store/reducers/app.ts
index 9516a5ed0b..6910a20f1e 100644
--- a/frontend/src/store/reducers/app.ts
+++ b/frontend/src/store/reducers/app.ts
@@ -1,8 +1,10 @@
+import { IS_LOGGED_IN } from 'constants/auth';
 import { AppAction, SWITCH_DARK_MODE } from 'types/actions/app';
 import InitialValueTypes from 'types/reducer/app';
 
 const InitialValue: InitialValueTypes = {
 	isDarkMode: true,
+	isLoggedIn: localStorage.getItem(IS_LOGGED_IN) === 'yes',
 };
 
 const appReducer = (
diff --git a/frontend/src/types/reducer/app.ts b/frontend/src/types/reducer/app.ts
index dde2550e7f..2ec974c399 100644
--- a/frontend/src/types/reducer/app.ts
+++ b/frontend/src/types/reducer/app.ts
@@ -1,3 +1,4 @@
 export default interface AppReducer {
 	isDarkMode: boolean;
+	isLoggedIn: boolean;
 }