diff --git a/components/FormikFields/ErrorPicker/index.js b/components/FormikFields/ErrorPicker/index.js
new file mode 100644
index 000000000..a9f9c97a0
--- /dev/null
+++ b/components/FormikFields/ErrorPicker/index.js
@@ -0,0 +1,56 @@
+import React, { useState, useEffect } from 'react';
+import { Snackbar } from 'react-native-paper';
+import {
+ View, Text
+} from 'react-native';
+import I18n from '../../../modules/i18n';
+
+const ErrorPicker = ({ formikProps, inputs }) => {
+ const { errors, isSubmitting } = formikProps;
+ const [formErrors, setFormErrors] = useState([])
+ const [visible, setVisible] = useState(false)
+
+ const keysToLabel = (keys) => {
+ let label = [];
+ keys.forEach((key) => {
+ inputs.forEach((input) => {
+ if (key === input.formikKey) {
+ label = label.concat([I18n.t(input.label)]);
+ }
+ else if (input.fieldType === 'multiInputRowNum') {
+ input.options.forEach((option) => {
+ if (key === option.value) {
+ label = label.concat(I18n.t(option.label))
+ }
+ })
+ }
+ })
+ });
+ setFormErrors(label.join(", "));
+ }
+
+ useEffect(() => {
+ Object.keys(errors).length > 0 ? setVisible(true) : setVisible(false);
+ keysToLabel(Object.keys(errors))
+ }, [isSubmitting])
+
+ const dismissSnackBar = () => setVisible(false);
+
+ return (
+
+
+ Inavlid Fields: {"\n\n"}{formErrors}
+
+
+ )
+}
+
+export default ErrorPicker;
\ No newline at end of file
diff --git a/domains/DataCollection/Forms/IdentificationForm/index.js b/domains/DataCollection/Forms/IdentificationForm/index.js
index b9f98c9df..a7dd7fe58 100644
--- a/domains/DataCollection/Forms/IdentificationForm/index.js
+++ b/domains/DataCollection/Forms/IdentificationForm/index.js
@@ -1,7 +1,8 @@
import React, { useState, useEffect } from 'react';
import {
ActivityIndicator,
- View, TouchableWithoutFeedback, Keyboard
+ View, TouchableWithoutFeedback, Keyboard,
+ Text
} from 'react-native';
import { Formik } from 'formik';
@@ -16,7 +17,7 @@ import I18n from '../../../../modules/i18n';
import PaperButton from '../../../../components/Button';
import PaperInputPicker from '../../../../components/FormikFields/PaperInputPicker';
import yupValidationPicker from '../../../../components/FormikFields/YupValidation';
-
+import ErrorPicker from '../../../../components/FormikFields/ErrorPicker';
import backgroundPostPatient from './utils';
import surveyingUserFailsafe from '../utils';
@@ -117,17 +118,22 @@ const IdentificationForm = ({
/>
))}
+
{formikProps.isSubmitting ? (
) : (
-
- //
- )}
+
+ //
+ )}
)}
diff --git a/domains/DataCollection/Forms/SupplementaryForm/index.js b/domains/DataCollection/Forms/SupplementaryForm/index.js
index b4d661901..ea21f619d 100644
--- a/domains/DataCollection/Forms/SupplementaryForm/index.js
+++ b/domains/DataCollection/Forms/SupplementaryForm/index.js
@@ -22,6 +22,7 @@ import vitalsConfig from './configs/vitals.config';
import surveyingUserFailsafe from '../utils';
import { addSelectTextInputs, vitalsBloodPressue } from './utils';
+import ErrorPicker from '../../../../components/FormikFields/ErrorPicker';
const SupplementaryForm = ({
navigation, selectedForm, setSelectedForm, surveyee, surveyingUser, surveyingOrganization,
@@ -112,17 +113,23 @@ const SupplementaryForm = ({
))}
+
+
{formikProps.isSubmitting ? (
) : (
-
- )}
+
+ )}
)}