From 0a00e12b58f744d568219477671d29ecceffc1dc Mon Sep 17 00:00:00 2001
From: Ebube <chukwumdiebubeojinta@gmail.com>
Date: Mon, 24 Apr 2023 15:40:46 +0100
Subject: [PATCH 1/2] added session expiration

---
 .env                                      |  3 +-
 src/components/AuthPages/SignUp/index.jsx |  4 +-
 src/middleware/AuthRoute.jsx              | 50 ++++++++++++++++++++++-
 3 files changed, 53 insertions(+), 4 deletions(-)

diff --git a/.env b/.env
index 5e1b33c..426eb40 100644
--- a/.env
+++ b/.env
@@ -17,7 +17,8 @@ REACT_APP_USERS_ENDPOINT="https://apigate.lotus.g1.wrenchboard.com/svs/user"
 
 #"https://devapi.mermsemr.com/en/desktop/api/v2/myfituser"
 
-REACT_APP_SESSION_EXPIRE_MINUTES=5
+REACT_APP_SESSION_EXPIRE_MINUTES=300000
+REACT_APP_SESSION_EXPIRE_CHECKER=60000
 
 REACT_APP_LOGIN_ERROR_TIMEOUT=7000
 
diff --git a/src/components/AuthPages/SignUp/index.jsx b/src/components/AuthPages/SignUp/index.jsx
index f902d38..3cd6a12 100644
--- a/src/components/AuthPages/SignUp/index.jsx
+++ b/src/components/AuthPages/SignUp/index.jsx
@@ -113,7 +113,7 @@ export default function SignUp() {
   return (
     <>
       <div className="layout-wrapper login">
-        <div className="main-wrapper w-full xl:h-screen h-full xl:py-10 py-12">
+        <div className="main-wrapper w-full xl:h-screen h-full xl:py-10 py-12 overflow-y-auto">
           <div className=" h-full">
             <div className="flex-1 flex justify-center items-center">
               <div className="w-full">
@@ -122,7 +122,7 @@ export default function SignUp() {
                     <img src={WrenchBoard} alt="wrenchboard" className="h-10 mx-auto" />
                   </Link>
                 </div>
-                <div className="content-wrapper login shadow-md w-full lg:max-w-[600px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px]  rounded-[0.475rem] sm:p-7 p-5">
+                <div className="content-wrapper login shadow-md w-full lg:max-w-[600px] mx-auto flex justify-center items-center xl:bg-white dark:bg-dark-white 2xl:w-[828px]  rounded-[0.475rem] sm:p-7 p-5 mb-7">
                   <div>
                     <div className="title-area flex flex-col justify-center items-center relative text-center mb-7">
                       <h1 className="text-[#181c32] font-semibold dark:text-white mb-3" style={{
diff --git a/src/middleware/AuthRoute.jsx b/src/middleware/AuthRoute.jsx
index 9f557fc..6d67366 100644
--- a/src/middleware/AuthRoute.jsx
+++ b/src/middleware/AuthRoute.jsx
@@ -1,7 +1,55 @@
-import { Navigate, Outlet } from "react-router-dom";
+import { useEffect, useState } from "react";
+import { Navigate, Outlet, useLocation, useNavigate } from "react-router-dom";
 
 const AuthRoute = ({ redirectPath = "/login", children }) => {
+  const [lastActivityTime, setLastActivityTime] = useState(Date.now());
   const isLogin = localStorage.getItem("email");
+
+  const navigate = useNavigate();
+  const { pathname } = useLocation();
+
+
+  //Removing Data stored at localStorage after session expires
+  const expireSession = () => {
+    localStorage.removeItem("email");
+    localStorage.removeItem('session_token');
+    localStorage.removeItem('firstname');
+    localStorage.removeItem('member_id');
+    localStorage.removeItem('lastname');
+    localStorage.removeItem('state');
+    localStorage.removeItem('last_login');
+    localStorage.removeItem('uid');
+    localStorage.removeItem('session');
+    localStorage.removeItem('city');
+    localStorage.removeItem('country');
+    localStorage.removeItem('loglevel');
+    localStorage.removeItem('zip_code');
+    localStorage.removeItem('added');
+    navigate("/login", { replace: true }); // redirects user to login page after session expires
+  };
+
+  const checkInactivity = setInterval(() => {
+    if (Date.now() - lastActivityTime > process.env.REACT_APP_SESSION_EXPIRE_MINUTES) {
+      expireSession()
+    }
+  }, process.env.REACT_APP_SESSION_EXPIRE_CHECKER) // Checks for inactivity every minute
+
+  // Reset last activity time on user input
+  const resetTime = () => {
+    setLastActivityTime(Date.now());
+  }
+  window.addEventListener('mousemove', resetTime)
+  window.addEventListener('keydown', resetTime)
+
+  useEffect(() => {
+    // cleaning up listeners
+    return () => {
+      clearInterval(checkInactivity)
+      window.removeEventListener('mouseover', resetTime)
+      window.removeEventListener('keydown', resetTime)
+    }
+  }, [pathname, lastActivityTime])
+
   if (!isLogin) {
     return <Navigate to={redirectPath} replace />;
   }

From f42fabbfbbe2ea5886809ddfb2d172476d01b9c9 Mon Sep 17 00:00:00 2001
From: Ebube <chukwumdiebubeojinta@gmail.com>
Date: Mon, 24 Apr 2023 16:08:19 +0100
Subject: [PATCH 2/2] fixed typo

---
 src/middleware/AuthRoute.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/middleware/AuthRoute.jsx b/src/middleware/AuthRoute.jsx
index 6d67366..f7b4b9c 100644
--- a/src/middleware/AuthRoute.jsx
+++ b/src/middleware/AuthRoute.jsx
@@ -45,7 +45,7 @@ const AuthRoute = ({ redirectPath = "/login", children }) => {
     // cleaning up listeners
     return () => {
       clearInterval(checkInactivity)
-      window.removeEventListener('mouseover', resetTime)
+      window.removeEventListener('mousemove', resetTime)
       window.removeEventListener('keydown', resetTime)
     }
   }, [pathname, lastActivityTime])