From 6c2f31cb304930bba99f3bad34853ac17dc45aec Mon Sep 17 00:00:00 2001 From: kajambiya Date: Thu, 16 Nov 2023 15:27:44 +0300 Subject: [PATCH 1/2] fix ohri-unspecified issue --- .../inputs/text/ohri-text.component.tsx | 4 +-- .../ohri-unspecified.component.tsx | 4 +-- .../unspecified/ohri-unspecified.test.tsx | 31 ++++++++++++++++--- 3 files changed, 31 insertions(+), 8 deletions(-) diff --git a/src/components/inputs/text/ohri-text.component.tsx b/src/components/inputs/text/ohri-text.component.tsx index 6c8e440ea..2f5749b7f 100644 --- a/src/components/inputs/text/ohri-text.component.tsx +++ b/src/components/inputs/text/ohri-text.component.tsx @@ -54,7 +54,7 @@ const OHRIText: React.FC = ({ question, onChange, handler }) }; useEffect(() => { - getConceptNameAndUUID(question.questionOptions.concept).then(conceptTooltip => { + getConceptNameAndUUID(question.questionOptions.concept).then((conceptTooltip) => { setConceptName(conceptTooltip); }); }, [conceptName]); @@ -91,7 +91,7 @@ const OHRIText: React.FC = ({ question, onChange, handler }) invalidText={errors.length && errors[0].message} warn={warnings.length > 0} warnText={warnings.length && warnings[0].message} - onInvalid={e => e.preventDefault()} + onInvalid={(e) => e.preventDefault()} maxLength={question.questionOptions.max || TextInput.maxLength} /> diff --git a/src/components/inputs/unspecified/ohri-unspecified.component.tsx b/src/components/inputs/unspecified/ohri-unspecified.component.tsx index 863baa93a..5555ad51f 100644 --- a/src/components/inputs/unspecified/ohri-unspecified.component.tsx +++ b/src/components/inputs/unspecified/ohri-unspecified.component.tsx @@ -54,11 +54,11 @@ export const OHRIUnspecified: React.FC = ({ question, onChan } }, [question.value]); - const handleOnChange = useCallback(value => { + const handleOnChange = (value) => { setFieldValue(`${question.id}-unspecified`, value.target.checked); onChange(question.id, field.value, setErrors, setWarnings); question.value = handler?.handleFieldSubmission(question, field.value, encounterContext); - }, []); + }; return ( !question.isHidden && diff --git a/src/components/inputs/unspecified/ohri-unspecified.test.tsx b/src/components/inputs/unspecified/ohri-unspecified.test.tsx index 29b7d53a5..e9eb562be 100644 --- a/src/components/inputs/unspecified/ohri-unspecified.test.tsx +++ b/src/components/inputs/unspecified/ohri-unspecified.test.tsx @@ -4,6 +4,8 @@ import React from 'react'; import { OHRIFormField, EncounterContext, OHRIFormContext } from '../../..'; import { ObsSubmissionHandler } from '../../../submission-handlers/base-handlers'; import { OHRIUnspecified } from './ohri-unspecified.component'; +import { findTextOrDateInput } from '../../../utils/test-utils'; +import OHRIDate from '../date/ohri-date.component'; const question: OHRIFormField = { label: 'Visit Date', @@ -28,13 +30,13 @@ const encounterContext: EncounterContext = { }, sessionMode: 'enter', encounterDate: new Date(2020, 11, 29), - setEncounterDate: value => {}, + setEncounterDate: (value) => {}, }; -const renderForm = intialValues => { +const renderForm = (intialValues) => { render( - {props => ( + {(props) => (
{ fields: [question], isFieldInitializationComplete: true, isSubmitting: false, - formFieldHandlers: { 'obs': ObsSubmissionHandler } + formFieldHandlers: { obs: ObsSubmissionHandler }, }}> +
@@ -74,4 +77,24 @@ describe('Unspecified', () => { fireEvent.click(unspecifiedCheckbox); expect(unspecifiedCheckbox).not.toBeChecked(); }); + + it('Should clear field value when the "Unspecified" checkbox is clicked', async () => { + //setup + await renderForm({}); + const unspecifiedCheckbox = screen.getByRole('checkbox', { name: /Unspecified/ }); + const visitDateField = await findTextOrDateInput(screen, 'Visit Date'); + + // assert initial state + expect(unspecifiedCheckbox).not.toBeChecked(); + expect((await visitDateField).value).toBe(''); + + //Assert date change + fireEvent.blur(visitDateField, { target: { value: '2023-09-09T00:00:00.000Z' } }); + expect(visitDateField.value).toBe('09/09/2023'); + + // assert checked + fireEvent.click(unspecifiedCheckbox); + expect(unspecifiedCheckbox).toBeChecked(); + expect(visitDateField.value).toBe(''); + }); }); From 326a5f447e61f32dbdbe7788a4cf4f5e034a60bc Mon Sep 17 00:00:00 2001 From: kajambiya Date: Fri, 17 Nov 2023 09:26:13 +0300 Subject: [PATCH 2/2] add usecall back hook but with fields as a dependencny --- .../unspecified/ohri-unspecified.component.tsx | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/src/components/inputs/unspecified/ohri-unspecified.component.tsx b/src/components/inputs/unspecified/ohri-unspecified.component.tsx index 5555ad51f..1b7cb20f2 100644 --- a/src/components/inputs/unspecified/ohri-unspecified.component.tsx +++ b/src/components/inputs/unspecified/ohri-unspecified.component.tsx @@ -9,7 +9,7 @@ import styles from './ohri-unspecified.scss'; export const OHRIUnspecified: React.FC = ({ question, onChange, handler }) => { const [field, meta] = useField(`${question.id}-unspecified`); - const { setFieldValue, encounterContext } = React.useContext(OHRIFormContext); + const { setFieldValue, encounterContext, fields } = React.useContext(OHRIFormContext); const [previouslyUnspecified, setPreviouslyUnspecified] = useState(false); const hideCheckBox = encounterContext.sessionMode == 'view'; const [errors, setErrors] = useState([]); @@ -54,11 +54,14 @@ export const OHRIUnspecified: React.FC = ({ question, onChan } }, [question.value]); - const handleOnChange = (value) => { - setFieldValue(`${question.id}-unspecified`, value.target.checked); - onChange(question.id, field.value, setErrors, setWarnings); - question.value = handler?.handleFieldSubmission(question, field.value, encounterContext); - }; + const handleOnChange = useCallback( + (value) => { + setFieldValue(`${question.id}-unspecified`, value.target.checked); + onChange(question.id, field.value, setErrors, setWarnings); + question.value = handler?.handleFieldSubmission(question, field.value, encounterContext); + }, + [fields], + ); return ( !question.isHidden &&