diff --git a/src/components/form/QuestionRenderingEngine.tsx b/src/components/form/QuestionRenderingEngine.tsx index 5bb8a3b5..985ff16c 100644 --- a/src/components/form/QuestionRenderingEngine.tsx +++ b/src/components/form/QuestionRenderingEngine.tsx @@ -9,6 +9,7 @@ import Rating from './components/Rating'; import TextArea from './components/TextArea'; import TextInput from './components/TextInput'; import Dropdown from './components/Dropdown'; +import Address from './components/Address'; const Component = { TextInput, @@ -18,7 +19,8 @@ const Component = { Checkbox, Rating, Dropdown, - CheckboxGroup + CheckboxGroup, + Address }; interface IQuestionRenderingEngine { diff --git a/src/components/form/components/Address.tsx b/src/components/form/components/Address.tsx new file mode 100644 index 00000000..8b4f506b --- /dev/null +++ b/src/components/form/components/Address.tsx @@ -0,0 +1,66 @@ +import {StyleSheet, View} from 'react-native'; +import React from 'react'; +import Text from '../../../../RN-UI-LIB/src/components/Text'; +import Heading from '../../../../RN-UI-LIB/src/components/Heading'; +import { COLORS } from '../../../../RN-UI-LIB/src/styles/colors'; +import { GenericStyles } from '../../../../RN-UI-LIB/src/styles'; +import { useAppSelector } from '../../../hooks'; +import { Address as IAddressType, TaskTitle } from '../../../screens/allCases/interface'; +import { Task } from '../../../screens/caseDetails/interface'; + +interface IAddress { + caseId: string; + questionId: string; +} + +const getAddress = (address: IAddressType) => { + if(!address) return ''; + return `${address.houseNumber} ${address.lineOne} ${address.lineTwo} ${address.locality} ${address.city} ${address.pinCode} ${address.state}` +} + +const Address: React.FC = props => { + const { caseId, questionId } = props; + + const template = useAppSelector(state => state.case.templateData); + const question = + template.questions[questionId as keyof typeof template.questions]; + + const { showCommunicationAddress = true, showPermanentAddress = true } = question?.metadata || {}; + + + const caseTaskList = useAppSelector( + state => state.allCases.caseDetails[caseId].tasks, + ); + + const permanentAddressMetaData = caseTaskList.find((task: Task) => task.taskType === TaskTitle.PERMANENT_ADDRESS_VERIFICATION_TASK)?.metadata; + const communicationAddressMetaData = caseTaskList.find((task: Task) => task.taskType === TaskTitle.COMMUNICATION_ADDRESS_VERIFICATION_TASK)?.metadata; + + return ( + <> + { + showCommunicationAddress && ( + + + Communication address + + {getAddress(communicationAddressMetaData?.address)} + + ) + } + { + showPermanentAddress && ( + + + Permanent address + + {getAddress(permanentAddressMetaData?.address)} + + ) + } + + ); +}; + +export default Address; + +const styles = StyleSheet.create({}); diff --git a/src/components/form/components/CheckboxGroup.tsx b/src/components/form/components/CheckboxGroup.tsx index 4f741872..d51813ef 100644 --- a/src/components/form/components/CheckboxGroup.tsx +++ b/src/components/form/components/CheckboxGroup.tsx @@ -12,6 +12,7 @@ import { RootState } from '../../../store/store'; import { AnswerType } from '../interface'; import QuestionRenderingEngine from '../QuestionRenderingEngine'; import ErrorMessage from './ErrorMessage'; +import { _map } from '../../../../RN-UI-LIB/src/utlis/common'; interface ICheckBoxGroup { questionType: string; @@ -63,8 +64,7 @@ const CheckBoxGroup: React.FC = props => { change: any, onChange: (...event: any[]) => void, ) => { - console.log(change, "change") - const values = Object.keys(change); + const values = _map(change, (key) => key); onChange({ answer: values, type: AnswerType.array, diff --git a/src/components/form/components/RadioButton.tsx b/src/components/form/components/RadioButton.tsx index 9c1f1b68..68064f0f 100644 --- a/src/components/form/components/RadioButton.tsx +++ b/src/components/form/components/RadioButton.tsx @@ -86,7 +86,7 @@ const RadioButton: React.FC = props => { value={value?.answer} onValueChange={change => handleChange(change, onChange)} orientation={ - question.metadata.orientation || 'verticle' + question.metadata.orientation || 'vertical' }> {question?.metadata.buttonType === 'button' ? question.options.map((option: keyof typeof options) => { diff --git a/src/components/form/index.tsx b/src/components/form/index.tsx index e175a8e4..a80ddf34 100644 --- a/src/components/form/index.tsx +++ b/src/components/form/index.tsx @@ -2,11 +2,12 @@ import React, {useState} from 'react'; import {useForm} from 'react-hook-form'; import {Pressable, ScrollView, StyleSheet, View} from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; +import { useNavigationState } from '@react-navigation/native'; import {useDispatch, useSelector} from 'react-redux'; import Button from '../../../RN-UI-LIB/src/components/Button'; import Heading from '../../../RN-UI-LIB/src/components/Heading'; import Text from '../../../RN-UI-LIB/src/components/Text'; -import BackArrowIcon from '../../../RN-UI-LIB/src/Icons/BackArrowIcon'; +import ArrowSolidIcon from '../../../RN-UI-LIB/src/Icons/ArrowSolidIcon'; import CloseIcon from '../../../RN-UI-LIB/src/Icons/CloseIcon'; import {GenericStyles, getShadowStyle} from '../../../RN-UI-LIB/src/styles'; import {COLORS} from '../../../RN-UI-LIB/src/styles/colors'; @@ -22,6 +23,8 @@ import {goBack, navigateToScreen, popToScreen, pushToScreen} from '../utlis/navi import {ConditionType, IDecision, ILeaf} from './interface'; import RenderQuestion from './RenderQuestion'; +const CASE_DETAIL_SCREEN_NAME = 'caseDetail'; + interface IWidget { route: { name: string; @@ -29,10 +32,15 @@ interface IWidget { caseId: string; journey: string; }; - }; + } } const Widget: React.FC = props => { + const navigationRoutes = useNavigationState(state => state.routes); + const previousScreenRoute = navigationRoutes[navigationRoutes.length - 2]; + + const [isJourneyFirstScreen] = useState(previousScreenRoute.name === CASE_DETAIL_SCREEN_NAME); + const {name, params} = props.route; const {caseId, journey} = params; const templateData = useAppSelector(state => state.case.templateData); @@ -283,30 +291,35 @@ const Widget: React.FC = props => { GenericStyles.p16, styles.borderTop, ]}> + { + !isJourneyFirstScreen && ( +