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 ? ( ) : ( - - )} + + )} )}