Compare commits

8 Commits

4 changed files with 33 additions and 15 deletions
+4 -1
View File
@@ -17,4 +17,7 @@ REACT_APP_THEME_API_URL=https://preview.keenthemes.com/theme-api/api
REACT_APP_SITE_CONTACT_US=https://www.float.sg/contact
REACT_APP_SITE_TERMS=https://www.float.sg/terms
REACT_APP_SITE_ABOUT_US=https://www.float.sg/about
REACT_APP_SITE_ABOUT_US=https://www.float.sg/about
REACT_APP_LOGIN_ERROR_TIMEOUT=5000
REACT_APP_SESSION_TIMEOUT=300000
@@ -22,19 +22,19 @@ const SidebarLogo = () => {
{config.layoutType === 'dark-sidebar' ? (
<img
alt='Logo'
src={toAbsoluteUrl('/media/logos/default-dark.svg')}
src={toAbsoluteUrl('/media/logos/logo.png')}
className='h-25px app-sidebar-logo-default'
/>
) : (
<>
<img
alt='Logo'
src={toAbsoluteUrl('/media/logos/default.svg')}
src={toAbsoluteUrl('/media/logos/logo.png')}
className='h-25px app-sidebar-logo-default theme-light-show'
/>
<img
alt='Logo'
src={toAbsoluteUrl('/media/logos/default-dark.svg')}
src={toAbsoluteUrl('/media/logos/logo.png')}
className='h-25px app-sidebar-logo-default theme-dark-show'
/>
</>
+14 -10
View File
@@ -49,18 +49,20 @@ export function Login() {
setStatus('The login details are incorrect')
setSubmitting(false)
setLoading(false)
console.log(auth) //remove later
return
}
saveAuth(auth)
setCurrentUser(auth.profile)
console.log(auth) //remove later
} catch (error) {
console.error(error)
saveAuth(undefined)
setStatus('The login details are incorrect')
setSubmitting(false)
setLoading(false)
} finally {
setTimeout(()=>{
setStatus('')
}, Number(process.env.REACT_APP_LOGIN_ERROR_TIMEOUT))
}
},
})
@@ -130,14 +132,6 @@ 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>
@@ -221,6 +215,16 @@ export function Login() {
</div>
{/* end::Action */}
{/* error message */}
{formik.status ? (
<div className='mb-lg-15 alert alert-danger'>
<div className='alert-text font-weight-bold'>{formik.status}</div>
</div>
) : (
null
)}
{/* end of error message */}
<div className='text-gray-500 text-center fw-semibold fs-6'>
Not a Member yet?{' '}
<Link to='/auth/registration' className='link-primary'>
+12 -1
View File
@@ -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,11 +62,17 @@ const AuthProvider: FC<WithChildren> = ({children}) => {
}
const AuthInit: FC<WithChildren> = ({children}) => {
const pathname = useLocation().pathname
const {auth, logout, setCurrentUser} = useAuth()
const didRequest = useRef(false)
const [showSplashScreen, setShowSplashScreen] = useState(true)
// We should request user by authToken (IN OUR EXAMPLE IT'S API_TOKEN) before rendering the application
useEffect(() => {
// function to expire session after 5 mins
let logoutSession = setTimeout(()=>{ //expire session after 5 mins
logout()
}, Number(process.env.REACT_APP_SESSION_TIMEOUT))
const requestUser = async (apiToken: string) => {
try {
if (!didRequest.current) {
@@ -96,7 +103,11 @@ const AuthInit: FC<WithChildren> = ({children}) => {
setShowSplashScreen(false)
}
// eslint-disable-next-line
}, [])
return ()=>{ // clears session timeout side effect
clearInterval(logoutSession)
}
}, [pathname])
return showSplashScreen ? <LayoutSplashScreen /> : <>{children}</>
}