Merge branch 'develop' into develop

9 files changed, 76 insertions, 10 deletions

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 165ab4c..f5661f1 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>
           </>
         }
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 5b1b728..38c7855 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>
           </>
         }