summaryrefslogtreecommitdiff
path: root/client/src/pages/Enrollment/Agreement/Agreement.jsx
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/pages/Enrollment/Agreement/Agreement.jsx')
-rw-r--r--client/src/pages/Enrollment/Agreement/Agreement.jsx21
1 files changed, 18 insertions, 3 deletions
diff --git a/client/src/pages/Enrollment/Agreement/Agreement.jsx b/client/src/pages/Enrollment/Agreement/Agreement.jsx
index 704b0d5..69fc9c2 100644
--- a/client/src/pages/Enrollment/Agreement/Agreement.jsx
+++ b/client/src/pages/Enrollment/Agreement/Agreement.jsx
@@ -11,6 +11,7 @@ import { useMutation } from 'react-query'
import { ToastContainer, toast } from 'react-toastify'
import PopUpModal from '../../../components/Modal/Modal'
import 'react-toastify/dist/ReactToastify.css'
+import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay'
const Agreement = ({ unverified, setUnverified }) => {
const { t } = useTranslation()
@@ -46,7 +47,12 @@ const Agreement = ({ unverified, setUnverified }) => {
}, 30000)
}
- const description = ['CLICK_ON_SEND_OTP', 'YOU_WILL_RECIEVE_AN_OTP_ON_YOUR_MOBILE_NUMBER', 'YOU_CAN_RESEND_THE_OTP_AFTER_30_SECONDS_IF_YOU_HAVENT_RECEIVED_IT_YET', 'CLICK_ON_VERIFY_OTP_TO_VERIFY_YOUR_MOBILE_NUMBER']
+ const description = [
+ 'CLICK_ON_SEND_OTP',
+ 'YOU_WILL_RECIEVE_AN_OTP_ON_YOUR_MOBILE_NUMBER',
+ 'YOU_CAN_RESEND_THE_OTP_AFTER_30_SECONDS_IF_YOU_HAVENT_RECEIVED_IT_YET',
+ 'CLICK_ON_VERIFY_OTP_TO_VERIFY_YOUR_MOBILE_NUMBER'
+ ]
return (
<>
@@ -56,13 +62,20 @@ const Agreement = ({ unverified, setUnverified }) => {
theme={'colored'}
/>
<Header subheading={t('ENROLLMENT')} />
+ <AudioAutoplay
+ audio={`${process.env.PUBLIC_URL}/assets/audios/otp-verification`}
+ />
<PopUpModal
title="VERIFY_YOUR_MOBILE_NUMBER"
image={`${process.env.PUBLIC_URL}/assets/images/agreement.svg`}
description={
<>
<ul>
- {description.map((item) => (<li className="list__item" key='id'>{t(item)}</li>))}
+ {description.map((item) => (
+ <li className="list__item" key="id">
+ {t(item)}
+ </li>
+ ))}
</ul>
</>
}
@@ -73,7 +86,9 @@ const Agreement = ({ unverified, setUnverified }) => {
/>
</div>
<div className={styles.card__elements}>
- <Typography sx={{ fontSize: '1.5rem' }}>{t('PLEASE_VERIFY_YOUR_IDENTITY')}</Typography>
+ <Typography sx={{ fontSize: '1.5rem' }}>
+ {t('PLEASE_VERIFY_YOUR_IDENTITY')}
+ </Typography>
<Button
color="primary"
size="large"