Skip to content

Commit 4e34674

Browse files
samuelmalesamuelmale
authored
(fix) Should not render empty obs-groups (#444)
1 parent fac66fd commit 4e34674

File tree

3 files changed

+237
-129
lines changed

3 files changed

+237
-129
lines changed

‎__mocks__/forms/rfe-forms/obs-group-test_form.json‎

Lines changed: 188 additions & 124 deletions
Original file line numberDiff line numberDiff line change
@@ -1,137 +1,201 @@
11
{
2-
"name": "ObsGroup Test Form",
3-
"version": "1",
4-
"published": true,
5-
"retired": false,
6-
"pages": [
7-
{
8-
"label": "Introduction",
9-
"sections": [
10-
{
11-
"label": "",
12-
"isExpanded": "true",
13-
"questions": [
14-
{
15-
"type": "markdown",
16-
"questionOptions": {
17-
"rendering": "markdown"
18-
},
19-
"id": "fooMarkdown",
20-
"value": [
21-
"**Use this form to:** Test Obs Group behaviour"
22-
]
23-
}
24-
]
25-
}
26-
]
27-
},
28-
{
29-
"label": "Obs Group Page",
30-
"sections": [
31-
{
32-
"label": "Group Section",
33-
"isExpanded": "true",
34-
"questions": [
35-
{
36-
"id": "myGroup",
37-
"label": "My Group",
38-
"type": "obsGroup",
39-
"questionOptions": {
40-
"rendering": "repeating",
41-
"concept": "1c70c490-cafa-4c95-9fdd-a30b62bb78b8"
2+
"name": "ObsGroup Test Form",
3+
"version": "1",
4+
"published": true,
5+
"retired": false,
6+
"pages": [
7+
{
8+
"label": "Obs Group Page",
9+
"sections": [
10+
{
11+
"label": "Group Section",
12+
"isExpanded": "true",
13+
"questions": [
14+
{
15+
"id": "myGroup",
16+
"label": "My Group",
17+
"type": "obsGroup",
18+
"questionOptions": {
19+
"rendering": "repeating",
20+
"concept": "1c70c490-cafa-4c95-9fdd-a30b62bb78b8"
21+
},
22+
"behaviours": [
23+
{
24+
"intent": "*",
25+
"required": "false",
26+
"unspecified": "false",
27+
"hide": {
28+
"hideWhenExpression": ""
29+
},
30+
"validators": []
31+
}
32+
],
33+
"questions": [
34+
{
35+
"label": "Sex",
36+
"type": "obs",
37+
"required": "true",
38+
"questionOptions": {
39+
"rendering": "radio",
40+
"concept": "1587AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
41+
"answers": [
42+
{
43+
"concept": "1535AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
44+
"label": "Female"
45+
},
46+
{
47+
"concept": "1534AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
48+
"label": "Male"
49+
}
50+
]
51+
},
52+
"id": "childSex",
53+
"behaviours": [
54+
{
55+
"intent": "*",
56+
"required": "true",
57+
"unspecified": "true",
58+
"hide": {
59+
"hideWhenExpression": "false"
60+
},
61+
"validators": []
62+
}
63+
]
4264
},
43-
"behaviours":[
44-
{
45-
"intent":"*",
46-
"required":"false",
47-
"unspecified":"false",
48-
"hide":{
49-
"hideWhenExpression":""
50-
},
51-
"validators":[]
52-
}
53-
],
54-
"questions": [
55-
{
56-
"label": "Sex",
57-
"type":"obs",
58-
"required":"true",
59-
"questionOptions":{
60-
"rendering":"radio",
61-
"concept":"1587AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
62-
"answers":[
65+
{
66+
"label": "Date of Birth",
67+
"type": "obs",
68+
"questionOptions": {
69+
"rendering": "date",
70+
"concept": "164802AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
71+
"weeksList": ""
72+
},
73+
"id": "birthDate",
74+
"behaviours": [
75+
{
76+
"intent": "*",
77+
"required": "true",
78+
"unspecified": "true",
79+
"hide": {
80+
"hideWhenExpression": "false"
81+
},
82+
"validators": [
6383
{
64-
"concept":"1535AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
65-
"label":"Female"
84+
"type": "date",
85+
"allowFutureDates": "false"
6686
},
6787
{
68-
"concept":"1534AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
69-
"label":"Male"
88+
"type": "js_expression",
89+
"failsWhenExpression": "!isDateEqualTo(myValue, useFieldValue('visit_date'))",
90+
"message": "Child birth date should be the same as the visit date!"
7091
}
7192
]
72-
},
73-
"id":"childSex",
74-
"behaviours":[
75-
{
76-
"intent":"*",
77-
"required":"true",
78-
"unspecified":"true",
79-
"hide":{
80-
"hideWhenExpression":"false"
81-
},
82-
"validators":[]
83-
}
84-
]
93+
}
94+
]
95+
}
96+
]
97+
}
98+
]
99+
},
100+
{
101+
"label": "Screening Section",
102+
"questions": [
103+
{
104+
"label": "Do you have dependents?",
105+
"id": "hasDependents",
106+
"type": "obs",
107+
"questionOptions": {
108+
"rendering": "radio",
109+
"concept": "a89e3f94-1350-11df-a1f1-0026b9348837",
110+
"answers": [
111+
{
112+
"concept": "a89ce50e-1350-11df-a1f1-0026b9348839",
113+
"label": "Yes"
85114
},
86115
{
87-
"label": "Date of Birth",
88-
"type": "obs",
89-
"questionOptions": {
90-
"rendering": "date",
91-
"concept": "164802AAAAAAAAAAAAAAAAAAAAAAAAAAAAAA",
92-
"weeksList": ""
93-
},
94-
"id": "birthDate",
95-
"behaviours": [
116+
"concept": "a89ce50e-1350-11df-a1f1-0026b9348838",
117+
"label": "No"
118+
}
119+
]
120+
}
121+
}
122+
]
123+
},
124+
{
125+
"label": "Groups with Hide logic",
126+
"questions": [
127+
{
128+
"type": "obsGroup",
129+
"label": "Dependents Group",
130+
"id": "dependentGroup",
131+
"questionOptions": {
132+
"concept": "3665d0ef-3718-47b2-9091-8b685bda412d",
133+
"rendering": "group"
134+
},
135+
"questions": [
136+
{
137+
"label": "Dependent Type",
138+
"id": "dependentType",
139+
"type": "obs",
140+
"questionOptions": {
141+
"rendering": "radio",
142+
"concept": "a89e3f94-1350-11df-a1f1-0026b9348838",
143+
"answers": [
96144
{
97-
"intent": "*",
98-
"required": "true",
99-
"unspecified": "true",
100-
"hide": {
101-
"hideWhenExpression": "false"
102-
},
103-
"validators": [
104-
{
105-
"type": "date",
106-
"allowFutureDates": "false"
107-
},
108-
{
109-
"type": "js_expression",
110-
"failsWhenExpression": "!isDateEqualTo(myValue, useFieldValue('visit_date'))",
111-
"message": "Child birth date should be the same as the visit date!"
112-
}
113-
]
145+
"concept": "6daff4ce-bce7-41f5-9141-17e694155180",
146+
"label": "Child"
147+
},
148+
{
149+
"concept": "a89ce50e-1350-11df-a1f1-0026b9348838",
150+
"label": "Spouse"
114151
}
115152
]
153+
},
154+
"hide": {
155+
"hideWhenExpression": "hasDependents !== 'a89ce50e-1350-11df-a1f1-0026b9348839'"
116156
}
117-
]
118-
}
119-
]
120-
}
121-
]
122-
}
123-
],
124-
"availableIntents": [
125-
{
126-
"intent": "*",
127-
"display": "ObsGroup Test Form"
128-
}
129-
],
130-
"processor": "EncounterFormProcessor",
131-
"uuid": "8f713e0e-94a0-3c57-9024-69520933802a",
132-
"referencedForms": [],
133-
"encounterType": "7e54cd64-f9c3-11eb-8e6a-57478ce139b0",
134-
"encounter": "Obs Group Test",
135-
"allowUnspecifiedAll": true
136-
}
137-
157+
},
158+
{
159+
"label": "Dependent Name",
160+
"id": "dependentName",
161+
"type": "obs",
162+
"questionOptions": {
163+
"rendering": "text",
164+
"concept": "a8a06fc6-1350-11df-a1f1-0026b9348838"
165+
},
166+
"hide": {
167+
"hideWhenExpression": "isEmpty(dependentType)"
168+
}
169+
},
170+
{
171+
"label": "Dependent Age",
172+
"id": "dependentAge",
173+
"type": "obs",
174+
"questionOptions": {
175+
"rendering": "number",
176+
"concept": "a8a06fc6-1350-11df-a1f1-0026b9348839"
177+
},
178+
"hide": {
179+
"hideWhenExpression": "dependentType !== '6daff4ce-bce7-41f5-9141-17e694155180'"
180+
}
181+
}
182+
]
183+
}
184+
]
185+
}
186+
]
187+
}
188+
],
189+
"availableIntents": [
190+
{
191+
"intent": "*",
192+
"display": "ObsGroup Test Form"
193+
}
194+
],
195+
"processor": "EncounterFormProcessor",
196+
"uuid": "8f713e0e-94a0-3c57-9024-69520933802a",
197+
"referencedForms": [],
198+
"encounterType": "7e54cd64-f9c3-11eb-8e6a-57478ce139b0",
199+
"encounter": "Obs Group Test",
200+
"allowUnspecifiedAll": true
201+
}

‎src/components/group/obs-group.component.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -9,13 +9,13 @@ import { useTranslation } from 'react-i18next';
99

1010
export const ObsGroup: React.FC<FormFieldInputProps> = ({ field, ...restProps }) => {
1111
const { t } = useTranslation();
12-
const { formFieldAdapters } = useFormProviderContext();
13-
const showLabel = useMemo(() => field.questions?.length > 1, [field]);
12+
const { formFieldAdapters, formFields } = useFormProviderContext();
1413

1514
const content = useMemo(
1615
() =>
1716
field.questions
18-
?.filter((child) => !child.isHidden)
17+
.map((child) => formFields.find((field) => field.id === child.id))
18+
.filter((child) => !child.isHidden)
1919
.map((child, index) => {
2020
const key = `${child.id}_${index}`;
2121

@@ -35,12 +35,12 @@ export const ObsGroup: React.FC<FormFieldInputProps> = ({ field, ...restProps })
3535
);
3636
}
3737
}),
38-
[field],
38+
[field, formFields],
3939
);
4040

4141
return (
4242
<div className={styles.groupContainer}>
43-
{showLabel ? (
43+
{content.length > 1 ? (
4444
<FormGroup legendText={t(field.label)} className={styles.boldLegend}>
4545
{content}
4646
</FormGroup>

0 commit comments

Comments
 (0)