diff options
66 files changed, 264 insertions, 54 deletions
diff --git a/admin/src/components/Accordion/Accordion.module.css b/admin/src/components/Accordion/Accordion.module.css index 2745cb4..0cf2603 100644 --- a/admin/src/components/Accordion/Accordion.module.css +++ b/admin/src/components/Accordion/Accordion.module.css @@ -1,5 +1,5 @@ .accordion { - width: 1500px; + width: 800px; margin: 2rem auto; } diff --git a/admin/src/services/apiservice.js b/admin/src/services/apiservice.js index ff5819f..c000755 100644 --- a/admin/src/services/apiservice.js +++ b/admin/src/services/apiservice.js @@ -23,3 +23,8 @@ export const deleteUser = async (id) => { const response = await apiClient.delete(`/user/${id}`); return response; }; + +export const updatingUsers = async () => { + const response = await apiClient.get(`/users/updating`); + return response; +}; diff --git a/client/public/assets/audios/aadhaar-update-status-is-approved-english.mp3 b/client/public/assets/audios/aadhaar-update-status-is-approved-english.mp3 Binary files differnew file mode 100644 index 0000000..d706c2c --- /dev/null +++ b/client/public/assets/audios/aadhaar-update-status-is-approved-english.mp3 diff --git a/client/public/assets/audios/aadhaar-update-status-is-approved-hindi.mp3 b/client/public/assets/audios/aadhaar-update-status-is-approved-hindi.mp3 Binary files differnew file mode 100644 index 0000000..b1f5d10 --- /dev/null +++ b/client/public/assets/audios/aadhaar-update-status-is-approved-hindi.mp3 diff --git a/client/public/assets/audios/aadhaar-update-status-is-pending-english.mp3 b/client/public/assets/audios/aadhaar-update-status-is-pending-english.mp3 Binary files differnew file mode 100644 index 0000000..2e4488e --- /dev/null +++ b/client/public/assets/audios/aadhaar-update-status-is-pending-english.mp3 diff --git a/client/public/assets/audios/aadhaar-update-status-is-pending-hindi.mp3 b/client/public/assets/audios/aadhaar-update-status-is-pending-hindi.mp3 Binary files differnew file mode 100644 index 0000000..2bc8c9c --- /dev/null +++ b/client/public/assets/audios/aadhaar-update-status-is-pending-hindi.mp3 diff --git a/client/public/assets/audios/address-english.mp3 b/client/public/assets/audios/address-english.mp3 Binary files differnew file mode 100644 index 0000000..b21045c --- /dev/null +++ b/client/public/assets/audios/address-english.mp3 diff --git a/client/public/assets/audios/address-hindi.mp3 b/client/public/assets/audios/address-hindi.mp3 Binary files differnew file mode 100644 index 0000000..016f7e5 --- /dev/null +++ b/client/public/assets/audios/address-hindi.mp3 diff --git a/client/public/assets/audios/address-update-english.mp3 b/client/public/assets/audios/address-update-english.mp3 Binary files differnew file mode 100644 index 0000000..5f02861 --- /dev/null +++ b/client/public/assets/audios/address-update-english.mp3 diff --git a/client/public/assets/audios/address-update-hindi.mp3 b/client/public/assets/audios/address-update-hindi.mp3 Binary files differnew file mode 100644 index 0000000..dbae311 --- /dev/null +++ b/client/public/assets/audios/address-update-hindi.mp3 diff --git a/client/public/assets/audios/biometric-update-english.mp3 b/client/public/assets/audios/biometric-update-english.mp3 Binary files differnew file mode 100644 index 0000000..0a9d769 --- /dev/null +++ b/client/public/assets/audios/biometric-update-english.mp3 diff --git a/client/public/assets/audios/biometric-update-hindi.mp3 b/client/public/assets/audios/biometric-update-hindi.mp3 Binary files differnew file mode 100644 index 0000000..263abf0 --- /dev/null +++ b/client/public/assets/audios/biometric-update-hindi.mp3 diff --git a/client/public/assets/audios/check-status-main-screen-english.mp3 b/client/public/assets/audios/check-status-main-screen-english.mp3 Binary files differnew file mode 100644 index 0000000..3a286bf --- /dev/null +++ b/client/public/assets/audios/check-status-main-screen-english.mp3 diff --git a/client/public/assets/audios/check-status-main-screen-hindi.mp3 b/client/public/assets/audios/check-status-main-screen-hindi.mp3 Binary files differnew file mode 100644 index 0000000..5319019 --- /dev/null +++ b/client/public/assets/audios/check-status-main-screen-hindi.mp3 diff --git a/client/public/assets/audios/choose-demographic-or-biometric-english.mp3 b/client/public/assets/audios/choose-demographic-or-biometric-english.mp3 Binary files differnew file mode 100644 index 0000000..99a3471 --- /dev/null +++ b/client/public/assets/audios/choose-demographic-or-biometric-english.mp3 diff --git a/client/public/assets/audios/choose-demographic-or-biometric-hindi.mp3 b/client/public/assets/audios/choose-demographic-or-biometric-hindi.mp3 Binary files differnew file mode 100644 index 0000000..fa70e0d --- /dev/null +++ b/client/public/assets/audios/choose-demographic-or-biometric-hindi.mp3 diff --git a/client/public/assets/audios/demographic-personal-details-to-be-updated-english.mp3 b/client/public/assets/audios/demographic-personal-details-to-be-updated-english.mp3 Binary files differnew file mode 100644 index 0000000..e47a633 --- /dev/null +++ b/client/public/assets/audios/demographic-personal-details-to-be-updated-english.mp3 diff --git a/client/public/assets/audios/demographic-personal-details-to-be-updated-hindi.mp3 b/client/public/assets/audios/demographic-personal-details-to-be-updated-hindi.mp3 Binary files differnew file mode 100644 index 0000000..d2c5c07 --- /dev/null +++ b/client/public/assets/audios/demographic-personal-details-to-be-updated-hindi.mp3 diff --git a/client/public/assets/audios/enrollment-steps-completion- hindi.mp3 b/client/public/assets/audios/enrollment-steps-completion- hindi.mp3 Binary files differnew file mode 100644 index 0000000..1d0b5e8 --- /dev/null +++ b/client/public/assets/audios/enrollment-steps-completion- hindi.mp3 diff --git a/client/public/assets/audios/enrollment-steps-completion-english.mp3 b/client/public/assets/audios/enrollment-steps-completion-english.mp3 Binary files differnew file mode 100644 index 0000000..82b9e42 --- /dev/null +++ b/client/public/assets/audios/enrollment-steps-completion-english.mp3 diff --git a/client/public/assets/audios/enter-aadhar-no-english.mp3 b/client/public/assets/audios/enter-aadhar-no-english.mp3 Binary files differnew file mode 100644 index 0000000..43cf014 --- /dev/null +++ b/client/public/assets/audios/enter-aadhar-no-english.mp3 diff --git a/client/public/assets/audios/enter-aadhar-no-hindi.mp3 b/client/public/assets/audios/enter-aadhar-no-hindi.mp3 Binary files differnew file mode 100644 index 0000000..3ef7abe --- /dev/null +++ b/client/public/assets/audios/enter-aadhar-no-hindi.mp3 diff --git a/client/public/assets/audios/main-screen-english.mp3 b/client/public/assets/audios/main-screen-english.mp3 Binary files differnew file mode 100644 index 0000000..67d56a7 --- /dev/null +++ b/client/public/assets/audios/main-screen-english.mp3 diff --git a/client/public/assets/audios/main-screen-hindi.mp3 b/client/public/assets/audios/main-screen-hindi.mp3 Binary files differnew file mode 100644 index 0000000..87225c3 --- /dev/null +++ b/client/public/assets/audios/main-screen-hindi.mp3 diff --git a/client/public/assets/audios/mobile-and-email-id-english.mp3 b/client/public/assets/audios/mobile-and-email-id-english.mp3 Binary files differnew file mode 100644 index 0000000..c2183fa --- /dev/null +++ b/client/public/assets/audios/mobile-and-email-id-english.mp3 diff --git a/client/public/assets/audios/mobile-and-email-id-hindi.mp3 b/client/public/assets/audios/mobile-and-email-id-hindi.mp3 Binary files differnew file mode 100644 index 0000000..dd5144d --- /dev/null +++ b/client/public/assets/audios/mobile-and-email-id-hindi.mp3 diff --git a/client/public/assets/audios/otp-verification-english.mp3 b/client/public/assets/audios/otp-verification-english.mp3 Binary files differnew file mode 100644 index 0000000..e326920 --- /dev/null +++ b/client/public/assets/audios/otp-verification-english.mp3 diff --git a/client/public/assets/audios/otp-verification-hindi.mp3 b/client/public/assets/audios/otp-verification-hindi.mp3 Binary files differnew file mode 100644 index 0000000..5f1e83f --- /dev/null +++ b/client/public/assets/audios/otp-verification-hindi.mp3 diff --git a/client/public/assets/audios/personal-details-english.mp3 b/client/public/assets/audios/personal-details-english.mp3 Binary files differnew file mode 100644 index 0000000..f2ff785 --- /dev/null +++ b/client/public/assets/audios/personal-details-english.mp3 diff --git a/client/public/assets/audios/personal-details-hindi.mp3 b/client/public/assets/audios/personal-details-hindi.mp3 Binary files differnew file mode 100644 index 0000000..ca7b56d --- /dev/null +++ b/client/public/assets/audios/personal-details-hindi.mp3 diff --git a/client/public/assets/audios/photograph-update-english.mp3 b/client/public/assets/audios/photograph-update-english.mp3 Binary files differnew file mode 100644 index 0000000..103899d --- /dev/null +++ b/client/public/assets/audios/photograph-update-english.mp3 diff --git a/client/public/assets/audios/photograph-update-hindi.mp3 b/client/public/assets/audios/photograph-update-hindi.mp3 Binary files differnew file mode 100644 index 0000000..103899d --- /dev/null +++ b/client/public/assets/audios/photograph-update-hindi.mp3 diff --git a/client/public/assets/audios/update-document-english.mp3 b/client/public/assets/audios/update-document-english.mp3 Binary files differnew file mode 100644 index 0000000..e705465 --- /dev/null +++ b/client/public/assets/audios/update-document-english.mp3 diff --git a/client/public/assets/audios/update-document-hindi.mp3 b/client/public/assets/audios/update-document-hindi.mp3 Binary files differnew file mode 100644 index 0000000..6eaef7a --- /dev/null +++ b/client/public/assets/audios/update-document-hindi.mp3 diff --git a/client/public/assets/audios/update-message-notification-english.mp3 b/client/public/assets/audios/update-message-notification-english.mp3 Binary files differnew file mode 100644 index 0000000..4e7b702 --- /dev/null +++ b/client/public/assets/audios/update-message-notification-english.mp3 diff --git a/client/public/assets/audios/update-message-notification-hindi.mp3 b/client/public/assets/audios/update-message-notification-hindi.mp3 Binary files differnew file mode 100644 index 0000000..d17a3e3 --- /dev/null +++ b/client/public/assets/audios/update-message-notification-hindi.mp3 diff --git a/client/public/assets/audios/your-aadhar-enrollment-status-approved-english.mp3 b/client/public/assets/audios/your-aadhar-enrollment-status-approved-english.mp3 Binary files differnew file mode 100644 index 0000000..df74357 --- /dev/null +++ b/client/public/assets/audios/your-aadhar-enrollment-status-approved-english.mp3 diff --git a/client/public/assets/audios/your-aadhar-enrollment-status-approved-hindi.mp3 b/client/public/assets/audios/your-aadhar-enrollment-status-approved-hindi.mp3 Binary files differnew file mode 100644 index 0000000..c989fdc --- /dev/null +++ b/client/public/assets/audios/your-aadhar-enrollment-status-approved-hindi.mp3 diff --git a/client/public/assets/audios/your-aadhar-enrollment-status-pending-english.mp3 b/client/public/assets/audios/your-aadhar-enrollment-status-pending-english.mp3 Binary files differnew file mode 100644 index 0000000..51488a3 --- /dev/null +++ b/client/public/assets/audios/your-aadhar-enrollment-status-pending-english.mp3 diff --git a/client/public/assets/audios/your-aadhar-enrollment-status-pending-hindi.mp3 b/client/public/assets/audios/your-aadhar-enrollment-status-pending-hindi.mp3 Binary files differnew file mode 100644 index 0000000..b733490 --- /dev/null +++ b/client/public/assets/audios/your-aadhar-enrollment-status-pending-hindi.mp3 diff --git a/client/src/pages/CheckStatus/CheckStatus.jsx b/client/src/pages/CheckStatus/CheckStatus.jsx index 1732d21..3a37310 100644 --- a/client/src/pages/CheckStatus/CheckStatus.jsx +++ b/client/src/pages/CheckStatus/CheckStatus.jsx @@ -10,6 +10,7 @@ import { userContext } from '../../context/User' import styles from './CheckStatus.module.css' import { useNavigate } from 'react-router-dom' +import AudioAutoplay from '../../components/AudioAutoplay/AudioAutoplay' const CheckStatus = () => { const { t } = useTranslation() @@ -28,6 +29,9 @@ const CheckStatus = () => { theme={'colored'} /> <Header subheading={t('STATUS')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/check-status-main-screen`} + /> <div className={styles.status}> <div className={styles.formone__radio}> <span className={styles.formone__status}> diff --git a/client/src/pages/CheckStatus/EnrollmentStatus.jsx b/client/src/pages/CheckStatus/EnrollmentStatus.jsx index d1e1f4d..90fa118 100644 --- a/client/src/pages/CheckStatus/EnrollmentStatus.jsx +++ b/client/src/pages/CheckStatus/EnrollmentStatus.jsx @@ -6,6 +6,7 @@ import styles from './EnrollmentStatus.module.css' import { Button } from '@mui/material' import { useNavigate } from 'react-router-dom' import { userContext } from '../../context/User' +import AudioAutoplay from '../../components/AudioAutoplay/AudioAutoplay' const EnrollmentStatus = () => { const { t } = useTranslation() @@ -20,6 +21,9 @@ const EnrollmentStatus = () => { <h3 className={styles.status__title}>{t('STATUS')}</h3> {!userData?.verified ? ( <> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/your-aadhaar-enrollment-status-pending`} + /> <img src={`${process.env.PUBLIC_URL}/assets/images/pending.svg`} alt="" @@ -36,6 +40,9 @@ const EnrollmentStatus = () => { </> ) : ( <> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/your-aadhaar-enrollment-status-approved`} + /> <img src={`${process.env.PUBLIC_URL}/assets/images/approved.svg`} alt="" diff --git a/client/src/pages/CheckStatus/StatusOtp.jsx b/client/src/pages/CheckStatus/StatusOtp.jsx index 4955ab4..4a36550 100644 --- a/client/src/pages/CheckStatus/StatusOtp.jsx +++ b/client/src/pages/CheckStatus/StatusOtp.jsx @@ -10,6 +10,7 @@ import { getUserByAadhaar, sendOTP, getUser } from '../../services/apiservice' import SubmitButton from '../../components/SubmitButton/SubmitButton' import { toast, ToastContainer } from 'react-toastify' import PopUpModal from '../../components/Modal/Modal' +import AudioAutoplay from '../../components/AudioAutoplay/AudioAutoplay' import styles from './StatusOtp.module.css' import Spinner from '../../components/Spinner/Spinner' @@ -69,7 +70,7 @@ const StatusOtp = () => { } }) if (isLoading) { - return <Spinner heading='STATUS' /> + return <Spinner heading="STATUS" /> } if (isError) { @@ -86,7 +87,7 @@ const StatusOtp = () => { }) if (isLoading) { - return <Spinner heading='STATUS' /> + return <Spinner heading="STATUS" /> } if (isError) { @@ -98,7 +99,12 @@ const StatusOtp = () => { } } - 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 ( <> @@ -108,13 +114,20 @@ const StatusOtp = () => { theme={'colored'} /> <Header subheading={`${t('STATUS')}`} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/otp-verification`} + /> <PopUpModal title="VERIFY_YOUR_MOBILE_NUMBER" image={`${process.env.PUBLIC_URL}/assets/images/otp.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> </> } diff --git a/client/src/pages/CheckStatus/UpdateStatus.jsx b/client/src/pages/CheckStatus/UpdateStatus.jsx index a9a4b58..73e33d8 100644 --- a/client/src/pages/CheckStatus/UpdateStatus.jsx +++ b/client/src/pages/CheckStatus/UpdateStatus.jsx @@ -6,6 +6,7 @@ import styles from './EnrollmentStatus.module.css' import { Button } from '@mui/material' import { useNavigate } from 'react-router-dom' import { userContext } from '../../context/User' +import AudioAutoplay from '../../components/AudioAutoplay/AudioAutoplay' const UpdateStatus = () => { const { t } = useTranslation() @@ -20,6 +21,9 @@ const UpdateStatus = () => { <h3 className={styles.status__title}>{t('STATUS')}</h3> {userData?.isUpdating ? ( <> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/aadhaar-update-status-is-pending`} + /> <img src={`${process.env.PUBLIC_URL}/assets/images/pending.svg`} alt="" @@ -36,6 +40,9 @@ const UpdateStatus = () => { </> ) : ( <> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/aadhaar-update-status-is-approved`} + /> <img src={`${process.env.PUBLIC_URL}/assets/images/approved.svg`} alt="" diff --git a/client/src/pages/Enrollment/Address/Address.jsx b/client/src/pages/Enrollment/Address/Address.jsx index cb2db5a..194b66b 100644 --- a/client/src/pages/Enrollment/Address/Address.jsx +++ b/client/src/pages/Enrollment/Address/Address.jsx @@ -6,6 +6,7 @@ import Select from 'react-select' import { userContext } from '../../../context/User' import { useTranslation } from 'react-i18next' import PopUpModal from '../../../components/Modal/Modal' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' import styles from './Address.module.css' @@ -46,18 +47,29 @@ const Address = () => { }) } - const description = ['ENTER_YOUR_DETAILS_ACCORDING_TO_THE_RELEVANT_FIELDS', 'SELECT_THE_STATE_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST', 'SELECT_THE_DISTRICT_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST'] + const description = [ + 'ENTER_YOUR_DETAILS_ACCORDING_TO_THE_RELEVANT_FIELDS', + 'SELECT_THE_STATE_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST', + 'SELECT_THE_DISTRICT_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST' + ] return ( <> <Header subheading={t('ENROLLMENT')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/address`} + /> <PopUpModal title="FILL_YOUR_INFORMATION" image={`${process.env.PUBLIC_URL}/assets/images/address.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> </> } 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" diff --git a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx index d76bcb0..598b8b7 100644 --- a/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx +++ b/client/src/pages/Enrollment/DocumentScanner/DocumentScanner.jsx @@ -9,6 +9,7 @@ import { userContext } from '../../../context/User' import { toast } from 'react-toastify' import PopUpModal from '../../../components/Modal/Modal' import { useStyles } from './styles' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const DocumentScanner = () => { const { t } = useTranslation() @@ -147,6 +148,9 @@ const DocumentScanner = () => { return ( <> <Header subheading={t('ENROLLMENT')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/document`} + /> <PopUpModal title="SCAN_YOUR_DOCUMENTS" image={`${process.env.PUBLIC_URL}/assets/images/document.svg`} @@ -165,7 +169,9 @@ const DocumentScanner = () => { {t('ENSURE_THAT_YOUR_DOCUMENTS_ARE_IN_THE_CENTER_OF_THE_FRAME')} </li> <li className="list__item"> - {t('YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_SCANNED_ALL_THE_REQUIRED_DOCUMENTS')} + {t( + 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_SCANNED_ALL_THE_REQUIRED_DOCUMENTS' + )} </li> </ul> </> diff --git a/client/src/pages/Enrollment/FinalSlip/FinalSlip.jsx b/client/src/pages/Enrollment/FinalSlip/FinalSlip.jsx index c3c032e..df4b29f 100644 --- a/client/src/pages/Enrollment/FinalSlip/FinalSlip.jsx +++ b/client/src/pages/Enrollment/FinalSlip/FinalSlip.jsx @@ -4,12 +4,16 @@ import CardScanner from '../../../components/Card/CardScanner' import styles from './FinalSlip.module.css' import { Grid, Typography } from '@mui/material' import { useTranslation } from 'react-i18next' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const FinalSlip = () => { const { t } = useTranslation() return ( <> <Header subheading={t('ENROLLMENT')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/enrollment-steps-completion`} + /> <div className={styles.card__container}> <CardScanner image={`${process.env.PUBLIC_URL}/assets/images/slip.svg`} diff --git a/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx b/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx index 9bf9adb..b0827ca 100644 --- a/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx +++ b/client/src/pages/Enrollment/Fingerprint/Fingerprint.jsx @@ -6,12 +6,16 @@ import { Button, Grid, Typography } from '@mui/material' import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { useTranslation } from 'react-i18next' import PopUpModal from '../../../components/Modal/Modal' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const Fingerprint = () => { const { t } = useTranslation() return ( <> <Header subheading={t('ENROLLMENT')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/fingerprint`} + /> <PopUpModal title="Scan your Fingerprints" image={`${process.env.PUBLIC_URL}/assets/images/fingerprint_scan.svg`} diff --git a/client/src/pages/Enrollment/FormOne/FormOne.jsx b/client/src/pages/Enrollment/FormOne/FormOne.jsx index b6ab85d..abd52e9 100644 --- a/client/src/pages/Enrollment/FormOne/FormOne.jsx +++ b/client/src/pages/Enrollment/FormOne/FormOne.jsx @@ -46,7 +46,9 @@ const FormOne = () => { return ( <> <Header subheading={t('ENROLLMENT')} /> - <AudioAutoplay audio={`${process.env.PUBLIC_URL}/assets/audios/iris`} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/personal-details`} + /> <PopUpModal title="FILL_YOUR_INFORMATION" image={`${process.env.PUBLIC_URL}/assets/images/id.svg`} diff --git a/client/src/pages/Enrollment/FormTwo/FormTwo.jsx b/client/src/pages/Enrollment/FormTwo/FormTwo.jsx index e7c8ae1..e245666 100644 --- a/client/src/pages/Enrollment/FormTwo/FormTwo.jsx +++ b/client/src/pages/Enrollment/FormTwo/FormTwo.jsx @@ -6,21 +6,32 @@ import { userContext } from '../../../context/User' import styles from './FormTwo.module.css' import PopUpModal from '../../../components/Modal/Modal' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const FormTwo = () => { const { t } = useTranslation() const { userData, setUserData } = userContext() - const description = ['ENTER_YOUR_10_DIGIT_MOBILE_NUMBER_WITHOUT_ANY_PREFIX_OR_COUNTRY_ID', 'ENTER_YOUR_EMAIL_ID'] + const description = [ + 'ENTER_YOUR_10_DIGIT_MOBILE_NUMBER_WITHOUT_ANY_PREFIX_OR_COUNTRY_ID', + 'ENTER_YOUR_EMAIL_ID' + ] return ( <> <Header subheading={t('ENROLLMENT')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/mobile-and-email-id`} + /> <PopUpModal title="FILL_YOUR_INFORMATION" image={`${process.env.PUBLIC_URL}/assets/images/communication.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> </> } diff --git a/client/src/pages/Enrollment/IrisScan/IrisScan.jsx b/client/src/pages/Enrollment/IrisScan/IrisScan.jsx index 24ce25c..840fe14 100644 --- a/client/src/pages/Enrollment/IrisScan/IrisScan.jsx +++ b/client/src/pages/Enrollment/IrisScan/IrisScan.jsx @@ -6,12 +6,14 @@ import { Button, Grid, Typography } from '@mui/material' import SubmitButton from '../../../components/SubmitButton/SubmitButton' import PopUpModal from '../../../components/Modal/Modal' import { useTranslation } from 'react-i18next' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const IrisScan = () => { const { t } = useTranslation() return ( <> <Header subheading={t('ENROLLMENT')} /> + <AudioAutoplay audio={`${process.env.PUBLIC_URL}/assets/audios/iris`} /> <PopUpModal title="Scan your Iris" image={`${process.env.PUBLIC_URL}/assets/images/iris_scan.svg`} diff --git a/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx b/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx index b5a800b..ddd656c 100644 --- a/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx +++ b/client/src/pages/Enrollment/PhotoCapture/PhotoCapture.jsx @@ -9,6 +9,7 @@ import { Button, Grid, Typography } from '@mui/material' import { t } from 'i18next' import { userContext } from '../../../context/User' import PopUpModal from '../../../components/Modal/Modal' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const PhotoCapture = () => { const navigate = useNavigate() @@ -20,18 +21,29 @@ const PhotoCapture = () => { setUserData({ ...userData, photo: imageSrc }) }) - const description = ['ENSURE_THAT_YOUR_PHOTO_IS_CLEAR_AND_IN_FOCUS', 'ALSO_ENSURE_THAT_YOU_ARE_IN_THE_CENTER_OF_YOUR_PHOTO', 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_CAPTURED_A_CLEAR_AND_CENTERED_PHOTO'] + const description = [ + 'ENSURE_THAT_YOUR_PHOTO_IS_CLEAR_AND_IN_FOCUS', + 'ALSO_ENSURE_THAT_YOU_ARE_IN_THE_CENTER_OF_YOUR_PHOTO', + 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_CAPTURED_A_CLEAR_AND_CENTERED_PHOTO' + ] return ( <> <Header subheading={t('ENROLLMENT')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/photograph`} + /> <PopUpModal title="CAPTURE_YOUR_PHOTO" image={`${process.env.PUBLIC_URL}/assets/images/photo.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> </> } diff --git a/client/src/pages/Home/Home.jsx b/client/src/pages/Home/Home.jsx index 9370c9f..8f9351a 100644 --- a/client/src/pages/Home/Home.jsx +++ b/client/src/pages/Home/Home.jsx @@ -5,6 +5,7 @@ import Card from '../../components/Card/Card' import Header from '../../components/Header/Header' import ExtendedPopUpModal from '../../components/Modal/ExtendedModal' import styles from './Home.module.css' +import AudioAutoplay from '../../components/AudioAutoplay/AudioAutoplay' const Home = ({ page, setPage }) => { const { t } = useTranslation() @@ -13,6 +14,9 @@ const Home = ({ page, setPage }) => { return ( <> <Header subheading={t('MERA_AADHAAR_MERI_PEHCHAN')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/main-screen`} + /> <ExtendedPopUpModal title="Choose the appropriate card" description1="For enrollment of new Aadhaar card" diff --git a/client/src/pages/Update/Address/Address.jsx b/client/src/pages/Update/Address/Address.jsx index ad0c023..29c2fda 100644 --- a/client/src/pages/Update/Address/Address.jsx +++ b/client/src/pages/Update/Address/Address.jsx @@ -8,6 +8,7 @@ import PopUpModal from '../../../components/Modal/Modal' import { useTranslation } from 'react-i18next' import { userContext } from '../../../context/User' import styles from './Address.module.css' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const Address = () => { const { userData, setUserData } = userContext() @@ -56,18 +57,29 @@ const Address = () => { setEditable2(!editable2) } - const description = ['UPDATE_THE_REQUIRED_DETAILS_IN_THE_RELEVANT_FIELDS_BY_CLICKING_THE_EDIT_BUTTON', 'IF_REQUIRED_SELECT_THE_STATE_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST', 'IF_REQUIRED_SELECT_THE_DISTRICT_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST_THIS_WONT_SHOW_ANY_OPTIONS_UNTIL_YOU_HAVE_SELECTED_THE_STATE'] + const description = [ + 'UPDATE_THE_REQUIRED_DETAILS_IN_THE_RELEVANT_FIELDS_BY_CLICKING_THE_EDIT_BUTTON', + 'IF_REQUIRED_SELECT_THE_STATE_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST', + 'IF_REQUIRED_SELECT_THE_DISTRICT_YOU_BELONG_TO_FROM_THE_DROPDOWN_LIST_THIS_WONT_SHOW_ANY_OPTIONS_UNTIL_YOU_HAVE_SELECTED_THE_STATE' + ] return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/address-update`} + /> <PopUpModal title="FILL_YOUR_INFORMATION" image={`${process.env.PUBLIC_URL}/assets/images/address.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> </> } diff --git a/client/src/pages/Update/Agreement/Agreement.jsx b/client/src/pages/Update/Agreement/Agreement.jsx index 720d8a0..8de9738 100644 --- a/client/src/pages/Update/Agreement/Agreement.jsx +++ b/client/src/pages/Update/Agreement/Agreement.jsx @@ -15,6 +15,7 @@ import PopUpModal from '../../../components/Modal/Modal' import 'react-toastify/dist/ReactToastify.css' import Error from '../../Error/Error' import Spinner from '../../../components/Spinner/Spinner' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const Agreement = () => { const { t } = useTranslation() @@ -36,7 +37,7 @@ const Agreement = () => { }) }, onLoading: () => { - return <Spinner heading='UPDATE' /> + return <Spinner heading="UPDATE" /> }, onError: () => { return <Error message={t('SOMETHING_WENT_WRONG_PLEASE_TRY_AGAIN')} /> @@ -81,7 +82,12 @@ const Agreement = () => { }, 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 ( <> @@ -91,13 +97,20 @@ const Agreement = () => { 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> </> } diff --git a/client/src/pages/Update/BiometricSelect/BiometricSelect.jsx b/client/src/pages/Update/BiometricSelect/BiometricSelect.jsx index 89d2bfb..cf6cae8 100644 --- a/client/src/pages/Update/BiometricSelect/BiometricSelect.jsx +++ b/client/src/pages/Update/BiometricSelect/BiometricSelect.jsx @@ -5,20 +5,31 @@ import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { Link } from 'react-router-dom' import PopUpModal from '../../../components/Modal/Modal' import { useTranslation } from 'react-i18next' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const BiometricSelect = ({ page, setPage }) => { const { t } = useTranslation() - const description = ['CLICK_ON_THE_EDIT_BUTTON_TO_UPDATE_THE_REQUIRED_BIOMETRICS', 'YOU_CAN_EDIT_YOUR_PHOTOGRAPH_/_FINGERPRINTS_/_IRIS_SCANS'] + const description = [ + 'CLICK_ON_THE_EDIT_BUTTON_TO_UPDATE_THE_REQUIRED_BIOMETRICS', + 'YOU_CAN_EDIT_YOUR_PHOTOGRAPH_/_FINGERPRINTS_/_IRIS_SCANS' + ] return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/biometric-update`} + /> <PopUpModal title="SELECT_THE_OPTION_TO_BE_EDITED" image={`${process.env.PUBLIC_URL}/assets/images/biometrics.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> </> } diff --git a/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx b/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx index 4ee8a0a..86674af 100644 --- a/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx +++ b/client/src/pages/Update/DocumentScanner/DocumentScanner.jsx @@ -9,6 +9,7 @@ import { useTranslation } from 'react-i18next' import { userContext } from '../../../context/User' import { toast } from 'react-toastify' import { useStyles } from './styles' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const DocumentScanner = () => { const { userData, oriUserData, setUserData } = userContext() @@ -199,30 +200,39 @@ const DocumentScanner = () => { return ( <> <Header subheading={t('UPDATE')} /> - {steps.length !== 0 && (<PopUpModal - title="SCAN_YOUR_DOCUMENTS" - image={`${process.env.PUBLIC_URL}/assets/images/document.svg`} - description={ - <> - <ul> - <li className="list__item"> - {t('CONSISTS_OF_3_STEPS')} - <ul> - <li>{t('PROOF_OF_IDENTITY')} </li> - <li>{t(t('PROOF_OF_ADDRESS'))}</li> - <li>{t('PROOF_OF_DOB')} </li> - </ul> - </li> - <li className="list__item"> - {t('ENSURE_THAT_YOUR_DOCUMENTS_ARE_IN_THE_CENTER_OF_THE_FRAME')} - </li> - <li className="list__item"> - {t('YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_SCANNED_ALL_THE_REQUIRED_DOCUMENTS')} - </li> - </ul> - </> - } - />)} + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/update-document`} + /> + {steps.length !== 0 && ( + <PopUpModal + title="SCAN_YOUR_DOCUMENTS" + image={`${process.env.PUBLIC_URL}/assets/images/document.svg`} + description={ + <> + <ul> + <li className="list__item"> + {t('CONSISTS_OF_3_STEPS')} + <ul> + <li>{t('PROOF_OF_IDENTITY')} </li> + <li>{t(t('PROOF_OF_ADDRESS'))}</li> + <li>{t('PROOF_OF_DOB')} </li> + </ul> + </li> + <li className="list__item"> + {t( + 'ENSURE_THAT_YOUR_DOCUMENTS_ARE_IN_THE_CENTER_OF_THE_FRAME' + )} + </li> + <li className="list__item"> + {t( + 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_SCANNED_ALL_THE_REQUIRED_DOCUMENTS' + )} + </li> + </ul> + </> + } + /> + )} <div className={styles.stepper__container}> <div className={styles.box}> <Stepper activeStep={activeStep} sx={{ width: '60%' }}> diff --git a/client/src/pages/Update/FinalSlip/FinalSlip.jsx b/client/src/pages/Update/FinalSlip/FinalSlip.jsx index 4212be4..2014ce2 100644 --- a/client/src/pages/Update/FinalSlip/FinalSlip.jsx +++ b/client/src/pages/Update/FinalSlip/FinalSlip.jsx @@ -6,6 +6,7 @@ import { Grid, Typography } from '@mui/material' import { useTranslation } from 'react-i18next' import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { useNavigate } from 'react-router-dom' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const FinalSlip = () => { const { t } = useTranslation() @@ -13,6 +14,9 @@ const FinalSlip = () => { return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/update-message-notification`} + /> <div className={styles.card__container}> <CardScanner image={`${process.env.PUBLIC_URL}/assets/images/slip.svg`} diff --git a/client/src/pages/Update/Fingerprint/Fingerprint.jsx b/client/src/pages/Update/Fingerprint/Fingerprint.jsx index 933e944..607d809 100644 --- a/client/src/pages/Update/Fingerprint/Fingerprint.jsx +++ b/client/src/pages/Update/Fingerprint/Fingerprint.jsx @@ -6,12 +6,16 @@ import { Button, Grid, Typography } from '@mui/material' import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { useTranslation } from 'react-i18next' import PopUpModal from '../../../components/Modal/Modal' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const Fingerprint = () => { const { t } = useTranslation() return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/fingerprint`} + /> <PopUpModal title="Scan your Fingerprints" image={`${process.env.PUBLIC_URL}/assets/images/fingerprint_scan.svg`} diff --git a/client/src/pages/Update/FormOne/FormOne.jsx b/client/src/pages/Update/FormOne/FormOne.jsx index 29a91d6..c1786fc 100644 --- a/client/src/pages/Update/FormOne/FormOne.jsx +++ b/client/src/pages/Update/FormOne/FormOne.jsx @@ -6,6 +6,7 @@ import EditButton from '../../../components/EditButton/EditButton' import Gender from '../../../components/Gender/Gender' import { useTranslation } from 'react-i18next' import { userContext } from '../../../context/User' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' import PopUpModal from '../../../components/Modal/Modal' import { MobileDatePicker } from '@mui/x-date-pickers/MobileDatePicker' import { TextField } from '@mui/material' @@ -36,18 +37,30 @@ const FormOne = () => { } }, [userData.gender]) - const description = ['SELECT_YOUR_RESIDENCY_BY_SELECTING_THE_APPROPRIATE_CHECKBOX', 'ENTER_YOUR_FULL_NAME_WITHOUT_ANY_TITLE_OR_SALUTATION', 'SELECT_YOUR_GENDER_BY_CLICKING_ON_THE_APPROPRIATE_CARD', 'SELECT_YOUR_DATE_OF_BIRTH_FROM_THE_PROVIDED_CALENDER'] + const description = [ + 'SELECT_YOUR_RESIDENCY_BY_SELECTING_THE_APPROPRIATE_CHECKBOX', + 'ENTER_YOUR_FULL_NAME_WITHOUT_ANY_TITLE_OR_SALUTATION', + 'SELECT_YOUR_GENDER_BY_CLICKING_ON_THE_APPROPRIATE_CARD', + 'SELECT_YOUR_DATE_OF_BIRTH_FROM_THE_PROVIDED_CALENDER' + ] return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/demographic-personal-details-to-be-updated`} + /> <PopUpModal title="FILL_YOUR_INFORMATION" image={`${process.env.PUBLIC_URL}/assets/images/id.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> </> } diff --git a/client/src/pages/Update/IrisScan/IrisScan.jsx b/client/src/pages/Update/IrisScan/IrisScan.jsx index 05a34b3..f27ef59 100644 --- a/client/src/pages/Update/IrisScan/IrisScan.jsx +++ b/client/src/pages/Update/IrisScan/IrisScan.jsx @@ -6,12 +6,14 @@ import { Button, Grid, Typography } from '@mui/material' import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { useTranslation } from 'react-i18next' import PopUpModal from '../../../components/Modal/Modal' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const IrisScan = () => { const { t } = useTranslation() return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay audio={`${process.env.PUBLIC_URL}/assets/audios/iris`} /> <PopUpModal title="Scan your Iris" image={`${process.env.PUBLIC_URL}/assets/images/iris_scan.svg`} diff --git a/client/src/pages/Update/Otp/Otp.jsx b/client/src/pages/Update/Otp/Otp.jsx index ca792fa..bf1b38d 100644 --- a/client/src/pages/Update/Otp/Otp.jsx +++ b/client/src/pages/Update/Otp/Otp.jsx @@ -11,6 +11,7 @@ import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { toast, ToastContainer } from 'react-toastify' import PopUpModal from '../../../components/Modal/Modal' import Spinner from '../../../components/Spinner/Spinner' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' import styles from './Otp.module.css' @@ -64,7 +65,7 @@ const Otp = () => { } if (isLoading) { - return <Spinner heading='UPDATE'/> + return <Spinner heading="UPDATE" /> } if (isError) { @@ -75,7 +76,12 @@ const Otp = () => { setOriUserData(data?.data) } - 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 ( <> @@ -85,13 +91,20 @@ const Otp = () => { theme={'colored'} /> <Header subheading={`${t('UPDATE')}`} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/otp-verification`} + /> <PopUpModal title="VERIFY_YOUR_MOBILE_NUMBER" image={`${process.env.PUBLIC_URL}/assets/images/otp.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> </> } diff --git a/client/src/pages/Update/PhotoCapture/PhotoCapture.jsx b/client/src/pages/Update/PhotoCapture/PhotoCapture.jsx index 4fd4117..b53752c 100644 --- a/client/src/pages/Update/PhotoCapture/PhotoCapture.jsx +++ b/client/src/pages/Update/PhotoCapture/PhotoCapture.jsx @@ -9,6 +9,7 @@ import { Button, Grid, Typography } from '@mui/material' import { useTranslation } from 'react-i18next' import { userContext } from '../../../context/User' import PopUpModal from '../../../components/Modal/Modal' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' const PhotoCapture = () => { const { t } = useTranslation() @@ -30,18 +31,29 @@ const PhotoCapture = () => { } } - const description = ['ENSURE_THAT_YOUR_PHOTO_IS_CLEAR_AND_IN_FOCUS', 'ALSO_ENSURE_THAT_YOU_ARE_IN_THE_CENTER_OF_YOUR_PHOTO', 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_CAPTURED_A_CLEAR_AND_CENTERED_PHOTO'] + const description = [ + 'ENSURE_THAT_YOUR_PHOTO_IS_CLEAR_AND_IN_FOCUS', + 'ALSO_ENSURE_THAT_YOU_ARE_IN_THE_CENTER_OF_YOUR_PHOTO', + 'YOU_WONT_BE_ABLE_TO_PROCEED_UNTIL_YOU_HAVE_CAPTURED_A_CLEAR_AND_CENTERED_PHOTO' + ] return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/photograph-update`} + /> <PopUpModal title="CAPTURE_YOUR_PHOTO" image={`${process.env.PUBLIC_URL}/assets/images/photo.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> </> } diff --git a/client/src/pages/Update/Update.jsx b/client/src/pages/Update/Update.jsx index ecf1677..577573d 100644 --- a/client/src/pages/Update/Update.jsx +++ b/client/src/pages/Update/Update.jsx @@ -8,6 +8,7 @@ import { useNavigate } from 'react-router-dom' import { useTranslation } from 'react-i18next' import { ToastContainer, toast } from 'react-toastify' import { validAadhaar } from '../../constants/RegEx' +import AudioAutoplay from '../../components/AudioAutoplay/AudioAutoplay' const Update = () => { const { aadhaarNumber, setAadhaarNumber } = userContext() @@ -23,6 +24,9 @@ const Update = () => { theme={'colored'} /> <Header subheading={`${t('UPDATE')}`} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/enter-aadhaar-no`} + /> <div className={styles.subheading__container}> <h3 className={styles.subheading}> {t('PROVIDE_YOUR_AADHAAR_NUMBER')} diff --git a/client/src/pages/Update/UpdateSelect/UpdateSelect.jsx b/client/src/pages/Update/UpdateSelect/UpdateSelect.jsx index 3b6a717..5143662 100644 --- a/client/src/pages/Update/UpdateSelect/UpdateSelect.jsx +++ b/client/src/pages/Update/UpdateSelect/UpdateSelect.jsx @@ -5,6 +5,7 @@ import Card from '../../../components/Card/Card' import Header from '../../../components/Header/Header' import SubmitButton from '../../../components/SubmitButton/SubmitButton' import { userContext } from '../../../context/User' +import AudioAutoplay from '../../../components/AudioAutoplay/AudioAutoplay' import styles from './UpdateSelect.module.css' @@ -14,6 +15,9 @@ const UpdateSelect = () => { return ( <> <Header subheading={t('UPDATE')} /> + <AudioAutoplay + audio={`${process.env.PUBLIC_URL}/assets/audios/choose-demographic-or-biometric`} + /> <div className={styles.card__container}> <Link to="/update/demographic"> <Card |