5750775598

Committed 03 Aug 2023 11:53AM UTC coverage: 80.025% (-0.04%) from 80.065%

Build # 5750775598

Build Type

push

github

Committed by

web-flow

Commit Message

Merge pull request #110 from akvo/feature/108-performance-issue-related-to-datapoint-name

Feature/108 performance issue related to datapoint name

Run Details

598 of 802 branches covered (74.56%)

Branch coverage included in aggregate %.

78 of 78 new or added lines in 10 files covered. (100.0%)

1317 of 1591 relevant lines covered (82.78%)

17.21 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

68.42

/app/src/form/components/QuestionField.js

import React, { useEffect, useState } from 'react';
import {
  TypeDate,
  TypeImage,
  TypeInput,
  TypeMultipleOption,
  TypeOption,
  TypeText,
  TypeNumber,
  TypeGeo,
  TypeCascade,
} from '../fields';
import { useField } from 'formik';
import { View, Text } from 'react-native';
import { styles } from '../styles';
import { FormState } from '../../store';
import { cascades } from '../../lib';

const QuestionField = ({ keyform, field: questionField, setFieldValue, values, validate }) => {
  const [field, meta, helpers] = useField({ name: questionField.id, validate });
  const [cascadeData, setCascadeData] = useState([]);

  useEffect(() => {
    if (meta.error && field.name) {
      FormState.update((s) => {
        const removedErrorValues = Object.keys(s.questionGroupListCurrentValues)
          .filter((key) => key.toString() !== field.name.toString())
          .reduce((acc, curr) => ({ ...acc, [curr]: s.questionGroupListCurrentValues[curr] }), {});
        s.questionGroupListCurrentValues = removedErrorValues;
      });
    } else {
      FormState.update((s) => {
        s.questionGroupListCurrentValues = { ...s.questionGroupListCurrentValues, ...values };
      });
    }
  }, [meta.error, field.name, values]);

  const handleOnChangeField = (id, value) => {
    helpers.setTouched({ [field.name]: true });
    FormState.update((s) => {
      s.currentValues = { ...s.currentValues, [id]: value };
    });
    setFieldValue(id, value);
  };

  const loadCascadeDataSource = async (source) => {
    const { rows } = await cascades.loadDataSource(source);
    setCascadeData(rows._array);
  };

  useEffect(() => {
    if (questionField?.type === 'cascade' && questionField?.source?.file) {
      const cascadeSource = questionField.source;
      loadCascadeDataSource(cascadeSource);
    }
  }, []);

  const renderField = () => {
    switch (questionField?.type) {
      case 'date':
        return (
          <TypeDate
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
      case 'image':
        return (
          <TypeImage
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
      case 'multiple_option':
        return (
          <TypeMultipleOption
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
      case 'option':
        return (
          <TypeOption
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
      case 'text':
        return (
          <TypeText
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
      case 'number':
        return (
          <TypeNumber
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
      case 'geo':
        return (
          <TypeGeo
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
      case 'cascade':
        return (
          <TypeCascade
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
            dataSource={cascadeData}
          />
        );

      default:
        return (
          <TypeInput
            keyform={keyform}
            onChange={handleOnChangeField}
            values={values}
            {...questionField}
          />
        );
    }
  };

  return (
    <View>
      {renderField()}
      {meta.touched && meta.error ? (
        <Text style={styles.validationErrorText}>{meta.error}</Text>
      ) : null}
    </View>
  );
};

export default QuestionField;

1	import React, { useEffect, useState } from 'react';
2	import {
3	TypeDate,
4	TypeImage,
5	TypeInput,
6	TypeMultipleOption,
7	TypeOption,
8	TypeText,
9	TypeNumber,
10	TypeGeo,
11	TypeCascade,
12	} from '../fields';
13	import { useField } from 'formik';
14	import { View, Text } from 'react-native';
15	import { styles } from '../styles';
16	import { FormState } from '../../store';
17	import { cascades } from '../../lib';
18
19	const QuestionField = ({ keyform, field: questionField, setFieldValue, values, validate }) => {	3✔
20	const [field, meta, helpers] = useField({ name: questionField.id, validate });	272✔
21	const [cascadeData, setCascadeData] = useState([]);	272✔
22
23	useEffect(() => {	272✔
24	if (meta.error && field.name) {	50✔
25	FormState.update((s) => {	1✔
26	const removedErrorValues = Object.keys(s.questionGroupListCurrentValues)	1✔
27	.filter((key) => key.toString() !== field.name.toString())	9✔
28	.reduce((acc, curr) => ({ ...acc, [curr]: s.questionGroupListCurrentValues[curr] }), {});	8✔
29	s.questionGroupListCurrentValues = removedErrorValues;	1✔
30	});
31	} else {
32	FormState.update((s) => {	49✔
33	s.questionGroupListCurrentValues = { ...s.questionGroupListCurrentValues, ...values };	49✔
34	});
35	}
36	}, [meta.error, field.name, values]);
37
38	const handleOnChangeField = (id, value) => {	272✔
39	helpers.setTouched({ [field.name]: true });	×
40	FormState.update((s) => {	×
41	s.currentValues = { ...s.currentValues, [id]: value };	×
42	});
43	setFieldValue(id, value);	×
44	};
45
46	const loadCascadeDataSource = async (source) => {	272✔
47	const { rows } = await cascades.loadDataSource(source);	×
48	setCascadeData(rows._array);	×
49	};
50
51	useEffect(() => {	272✔
52	if (questionField?.type === 'cascade' && questionField?.source?.file) {	49!
53	const cascadeSource = questionField.source;	×
54	loadCascadeDataSource(cascadeSource);	×
55	}
56	}, []);
57
58	const renderField = () => {	272✔
59	switch (questionField?.type) {	272!
60	case 'date':
61	return (	33✔
62	<TypeDate
63	keyform={keyform}
64	onChange={handleOnChangeField}
65	values={values}
66	{...questionField}
67	/>
68	);
69	case 'image':
70	return (	×
71	<TypeImage
72	keyform={keyform}
73	onChange={handleOnChangeField}
74	values={values}
75	{...questionField}
76	/>
77	);
78	case 'multiple_option':
79	return (	×
80	<TypeMultipleOption
81	keyform={keyform}
82	onChange={handleOnChangeField}
83	values={values}
84	{...questionField}
85	/>
86	);
87	case 'option':
88	return (	132✔
89	<TypeOption
90	keyform={keyform}
91	onChange={handleOnChangeField}
92	values={values}
93	{...questionField}
94	/>
95	);
96	case 'text':
97	return (	33✔
98	<TypeText
99	keyform={keyform}
100	onChange={handleOnChangeField}
101	values={values}
102	{...questionField}
103	/>
104	);
105	case 'number':
106	return (	41✔
107	<TypeNumber
108	keyform={keyform}
109	onChange={handleOnChangeField}
110	values={values}
111	{...questionField}
112	/>
113	);
114	case 'geo':
115	return (	×
116	<TypeGeo
117	keyform={keyform}
118	onChange={handleOnChangeField}
119	values={values}
120	{...questionField}
121	/>
122	);
123	case 'cascade':
124	return (	×
125	<TypeCascade
126	keyform={keyform}
127	onChange={handleOnChangeField}
128	values={values}
129	{...questionField}
130	dataSource={cascadeData}
131	/>
132	);
133
134	default:
135	return (	33✔
136	<TypeInput
137	keyform={keyform}
138	onChange={handleOnChangeField}
139	values={values}
140	{...questionField}
141	/>
142	);
143	}
144	};
145
146	return (	272✔
147	<View>
148	{renderField()}
149	{meta.touched && meta.error ? (	726✔
150	<Text style={styles.validationErrorText}>{meta.error}</Text>
151	) : null}
152	</View>
153	);
154	};
155
156	export default QuestionField;

akvo / nmis-mobile / 5750775598

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous