MERMS/MermsFirstOffice
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

Turnstile

Browse Source
This commit is contained in:
Olusesan Ameye
2026-05-23 14:50:37 -04:00
parent 39c99f68bc
commit 7ca70d7f55
5 changed files with 29 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env
+3 -1
View File
@@ -7,7 +7,7 @@ INSTAGRAM_URL=https://www.instagram.com
# BACKEND END POINTS # BACKEND END POINTS
REACT_APP_MAIN_API="https://devapi.mermsemr.com" REACT_APP_MAIN_API="https://devapi.mermsemr.com"
# REACT_APP_MAIN_API="http://localhost:14700" #REACT_APP_MAIN_API="http://localhost:14700"
# ENQUIRIES CONTACTS # ENQUIRIES CONTACTS
VITE_CALL_ENDPOINT='09099000000' VITE_CALL_ENDPOINT='09099000000'
@@ -20,4 +20,6 @@ VITE_BANK_NAME_SHORT='FCMB'
# Inactivity timeout/logout AT 10MINS # Inactivity timeout/logout AT 10MINS
REACT_APP_TIMEOUT=600000 REACT_APP_TIMEOUT=600000
#CLOUDFLARE
REACT_APP_TURNSTILE_SITE_KEY=0x4AAAAAADQV82wuocFR-u5O
.env.development
+3
View File
@@ -19,3 +19,6 @@ VITE_BANK_NAME_SHORT='FCMB'
# Inactivity timeout/logout AT 10MINS # Inactivity timeout/logout AT 10MINS
REACT_APP_TIMEOUT=600000 REACT_APP_TIMEOUT=600000
#CLOUDFLARE
REACT_APP_TURNSTILE_SITE_KEY=0x4AAAAAADQV82wuocFR-u5O
.env.production
+5 -2
View File
@@ -6,8 +6,8 @@ TWITTER_URL=https://twitter.com
INSTAGRAM_URL=https://www.instagram.com INSTAGRAM_URL=https://www.instagram.com
# BACKEND END POINTS # BACKEND END POINTS
REACT_APP_MAIN_API="https://api.mermsemr.com" # REACT_APP_MAIN_API="https://api.mermsemr.com"
#REACT_APP_MAIN_API="http://localhost:14700" REACT_APP_MAIN_API="http://localhost:14700"
# ENQUIRIES CONTACTS # ENQUIRIES CONTACTS
VITE_CALL_ENDPOINT='09099000000' VITE_CALL_ENDPOINT='09099000000'
@@ -19,3 +19,6 @@ VITE_BANK_NAME_SHORT='FCMB'
# Inactivity timeout/logout AT 10MINS # Inactivity timeout/logout AT 10MINS
REACT_APP_TIMEOUT=600000 REACT_APP_TIMEOUT=600000
#CLOUDFLARE
REACT_APP_TURNSTILE_SITE_KEY=0x4AAAAAADQV82wuocFR-u5O
package.json
+1
View File
@@ -5,6 +5,7 @@
"dependencies": { "dependencies": {
"@reduxjs/toolkit": "^2.5.1", "@reduxjs/toolkit": "^2.5.1",
"@tanstack/react-query": "^5.66.0", "@tanstack/react-query": "^5.66.0",
"@marsidev/react-turnstile": "^1.5.2",
"apexcharts": "^4.5.0", "apexcharts": "^4.5.0",
"axios": "^1.7.9", "axios": "^1.7.9",
"cra-template": "1.2.0", "cra-template": "1.2.0",
src/components/auth/LoginCom.jsx
+15 -5
View File
@@ -4,6 +4,7 @@ import {useNavigate} from 'react-router-dom'
import {useMutation} from '@tanstack/react-query' import {useMutation} from '@tanstack/react-query'
import {Formik, Form} from 'formik' import {Formik, Form} from 'formik'
import * as Yup from "yup"; import * as Yup from "yup";
import {Turnstile} from '@marsidev/react-turnstile'
import InputText from '../InputText' import InputText from '../InputText'
import {updateUserDetails} from "../../store/UserDetails"; import {updateUserDetails} from "../../store/UserDetails";
@@ -30,6 +31,7 @@ export default function LoginCom() {
const navigate = useNavigate() const navigate = useNavigate()
const [loading, setLoading] = useState(false) const [loading, setLoading] = useState(false)
const [turnstileToken, setTurnstileToken] = useState(null)
const login = useMutation({ const login = useMutation({
mutationFn: (fields) => { mutationFn: (fields) => {
@@ -53,9 +55,9 @@ export default function LoginCom() {
}) })
//FUNCTION TO HANDLE LOGIN //FUNCTION TO HANDLE LOGIN
const handleSubmit = (values, helper) => { const handleSubmit = (values) => {
login.mutate(values) if (!turnstileToken) return
// handleLogin() login.mutate({...values, cf_turnstile_response: turnstileToken})
}; };
return ( return (
@@ -107,9 +109,17 @@ export default function LoginCom() {
/> />
{/* <p className='text-sm text-end font-medium text-primary'>Forget password ?</p> */} {/* <p className='text-sm text-end font-medium text-primary'>Forget password ?</p> */}
</div> </div>
<div className="text-center col-12 mt-3">
<Turnstile
siteKey={process.env.REACT_APP_TURNSTILE_SITE_KEY}
onSuccess={setTurnstileToken}
onExpire={() => setTurnstileToken(null)}
onError={() => setTurnstileToken(null)}
/>
</div>
<div className='h-10 mb-10'> <div className='h-10 mb-10'>
<button type='submit' disabled={login.isPending} <button type='submit' disabled={login.isPending || !turnstileToken}
className='w-full h-full bg-primary text-white font-bold rounded-md'>{login.isPending || loading ? 'loading...' : 'Login'}</button> className='w-full h-full bg-primary text-white font-bold rounded-md disabled:opacity-50 disabled:cursor-not-allowed'>{login.isPending || loading ? 'loading...' : 'Login'}</button>
</div> </div>
{login.error && {login.error &&