diff --git a/src/components/group/ohri-obs-group.component.tsx b/src/components/group/ohri-obs-group.component.tsx index 4b2949fd6..c5faaa904 100644 --- a/src/components/group/ohri-obs-group.component.tsx +++ b/src/components/group/ohri-obs-group.component.tsx @@ -27,9 +27,11 @@ export const OHRIObsGroup: React.FC = ({ question, onChange, dele }); } }, [question.questions]); + const groupContent = groupMembersControlMap .filter((groupMemberMapItem) => !!groupMemberMapItem && !groupMemberMapItem.field.isHidden) .map((groupMemberMapItem, index) => { + const keyId = groupMemberMapItem.field.id + '-' + index; const { control, field } = groupMemberMapItem; if (control) { const questionFragment = React.createElement(control, { @@ -41,7 +43,7 @@ export const OHRIObsGroup: React.FC = ({ question, onChange, dele }); return ( -
+
{questionFragment}
= ({ question, onChange, dele ); } }); + if (groupContent && deleteControl) { groupContent.push(deleteControl); } + return
{groupContent}
; }; diff --git a/src/components/inputs/number/ohri-number.component.tsx b/src/components/inputs/number/ohri-number.component.tsx index 57305db30..5e01185c5 100644 --- a/src/components/inputs/number/ohri-number.component.tsx +++ b/src/components/inputs/number/ohri-number.component.tsx @@ -72,8 +72,8 @@ const OHRINumber: React.FC = ({ question, onChange, handler, invalid={!isFieldRequiredError && errors.length > 0} invalidText={errors[0]?.message} label={question.label} - max={question.questionOptions.max || undefined} - min={question.questionOptions.min || undefined} + max={Number(question.questionOptions.max) || undefined} + min={Number(question.questionOptions.min) || undefined} name={question.id} value={field.value || ''} allowEmpty={true} diff --git a/src/components/inputs/radio/ohri-radio.component.tsx b/src/components/inputs/radio/ohri-radio.component.tsx index 3d21c1ed7..c27cfaf89 100644 --- a/src/components/inputs/radio/ohri-radio.component.tsx +++ b/src/components/inputs/radio/ohri-radio.component.tsx @@ -72,7 +72,7 @@ const OHRIRadio: React.FC = ({ question, onChange, handler, return ( diff --git a/src/components/inputs/select/ohri-dropdown.component.tsx b/src/components/inputs/select/ohri-dropdown.component.tsx index b8d317f7a..90cc30512 100644 --- a/src/components/inputs/select/ohri-dropdown.component.tsx +++ b/src/components/inputs/select/ohri-dropdown.component.tsx @@ -86,7 +86,7 @@ const OHRIDropdown: React.FC = ({ question, onChange, handle invalid={!isFieldRequiredError && errors.length > 0} invalidText={errors.length && errors[0].message} warn={warnings.length > 0} - warnText={warnings.length && warnings[0].message} + warnText={warnings.length ? warnings[0].message : ''} />
) diff --git a/src/components/inputs/text/ohri-text.component.tsx b/src/components/inputs/text/ohri-text.component.tsx index 12540b31b..b910a4f5f 100644 --- a/src/components/inputs/text/ohri-text.component.tsx +++ b/src/components/inputs/text/ohri-text.component.tsx @@ -75,7 +75,7 @@ const OHRIText: React.FC = ({ question, onChange, handler, p name={question.id} value={field.value || ''} disabled={question.disabled} - readOnly={question.readonly} + readOnly={Boolean(question.readonly)} invalid={!isFieldRequiredError && errors.length > 0} invalidText={errors.length && errors[0].message} warn={warnings.length > 0} diff --git a/src/components/repeat/ohri-repeat.component.tsx b/src/components/repeat/ohri-repeat.component.tsx index dd5425448..98f623803 100644 --- a/src/components/repeat/ohri-repeat.component.tsx +++ b/src/components/repeat/ohri-repeat.component.tsx @@ -1,4 +1,4 @@ -import React, { useCallback, useEffect, useState } from 'react'; +import React, { useCallback, useEffect, useId, useState } from 'react'; import { FormGroup, Button } from '@carbon/react'; import { Add, TrashCan } from '@carbon/react/icons'; import { useFormikContext } from 'formik'; @@ -16,8 +16,10 @@ export const showAddButton = (limit: string | number, counter: number) => { return !Number.isNaN(repeatLimit) && repeatLimit > 0 ? counter < repeatLimit : true; }; -export const OHRIRepeat: React.FC = ({ question, onChange }) => { +const OHRIRepeat: React.FC = ({ question, onChange }) => { const { t } = useTranslation(); + const id = useId(); + const { fields: allFormFields, encounterContext, @@ -105,25 +107,25 @@ export const OHRIRepeat: React.FC = ({ question, onChange }) }; const nodes = obsGroups.map((question, index) => { + const keyId = question.id + '-' + index; const deleteControl = obsGroups.length > 1 && encounterContext.sessionMode !== 'view' ? ( -
-
-
+
+
) : null; return ( - <> +
{index !== 0 && (
-
+
)}
@@ -134,17 +136,18 @@ export const OHRIRepeat: React.FC = ({ question, onChange }) deleteControl={index !== 0 ? deleteControl : null} />
- +
); }); encounterContext.sessionMode != 'view' && nodes.push( -
+
{showAddButton(question.questionOptions.repeatOptions?.limit, counter) && (