adjusted line

.env

@@ -16,4 +16,6 @@ REACT_APP_PREVIEW_DOCS_URL=https://preview.keenthemes.com/metronic8/react/docs
 REACT_APP_THEME_API_URL=https://preview.keenthemes.com/theme-api/api
 REACT_APP_TERMS_LINK='https://www.float.sg/terms'
 REACT_APP_CONTACT_LINK='https://www.float.sg/contact'
-REACT_APP_ABOUT_LINK='https://www.float.sg/about'
+REACT_APP_ABOUT_LINK='https://www.float.sg/about'
+
+REACT_APP_LOGOUT_SESSION_TIMEOUT=300000

src/app/modules/auth/components/Login.tsx

@@ -23,8 +23,8 @@ const loginSchema = Yup.object().shape({
 })
 
 const initialValues = {
-  email: 'johndoe@email.com',
-  password: '****',
+  email: '',
+  password: '',
 }
 
 /*
@@ -125,11 +125,19 @@ export function Login() {
       </div>
       {/* end::Separator */}
 
+      {formik.status ? (
+        <div className='mb-lg-15 alert alert-danger'>
+          <div className='alert-text font-weight-bold'>{formik.status}</div>
+        </div>
+      ) : (
+        null
+      )}
+
       {/* begin::Form group */}
       <div className='fv-row mb-8'>
         <label className='form-label fs-6 fw-bolder text-dark'>Email</label>
         <input
-          placeholder='Email'
+          placeholder='floatuser@email.com'
           {...formik.getFieldProps('email')}
           className={clsx(
             'form-control bg-transparent',
@@ -155,6 +163,7 @@ export function Login() {
         <label className='form-label fw-bolder text-dark fs-6 mb-0'>Password</label>
         <input
           type='password'
+          placeHolder="●●●●●●"
           autoComplete='off'
           {...formik.getFieldProps('password')}
           className={clsx(

src/app/modules/auth/core/Auth.tsx

@@ -8,6 +8,7 @@ import {
   Dispatch,
   SetStateAction,
 } from 'react'
+import {useLocation} from 'react-router-dom'
 import {LayoutSplashScreen} from '../../../../_res/layout/core'
 import {AuthModel, UserModel} from './_models'
 import * as authHelper from './AuthHelpers'
@@ -61,6 +62,7 @@ const AuthProvider: FC<WithChildren> = ({children}) => {
 }
 
 const AuthInit: FC<WithChildren> = ({children}) => {
+  const {pathname} = useLocation()
   const {auth, logout, setCurrentUser} = useAuth()
   const didRequest = useRef(false)
   const [showSplashScreen, setShowSplashScreen] = useState(true)
@@ -95,8 +97,17 @@ const AuthInit: FC<WithChildren> = ({children}) => {
       logout()
       setShowSplashScreen(false)
     }
+
+    // adding a timeout for 5mins 
+    const logOutSession = setTimeout(() => {
+      logout()
+    }, Number(process.env.REACT_APP_LOGOUT_SESSION_TIMEOUT))
+    
+    return (() => {
+      clearInterval(logOutSession)
+    })
     // eslint-disable-next-line
-  }, [])
+  }, [pathname])
 
   return showSplashScreen ? <LayoutSplashScreen /> : <>{children}</>
 }