@inseefr/lunatic 0.3.2-experimental → 0.3.3-experimental

package/src/stories/questionnaire/questionnaire.stories.js

@@ -79,7 +79,7 @@ const paginated = storiesOf('Questionnaire/Paginated', module).addDecorator(
 );
 
 paginated.addWithJSX('Calculated Variables', () => (
-	<OrchestratorSplit
+	<Orchestrator
 		id="props"
 		source={calcVar}
 		missing={boolean('Missing', false)}
@@ -157,7 +157,7 @@ paginated.addWithJSX('Logement - S2', () => (
 ));
 
 paginated.addWithJSX('Simpsons', () => (
-	<OrchestratorSplit
+	<Orchestrator
 		id="props"
 		source={simpsons}
 		missing={boolean('Missing', false)}

package/src/stories/utils/orchestrator-split.js

@@ -6,14 +6,16 @@ function getStoreInfoRequired() {
 	return {};
 }
 
+const defaultFeatures = ['VTL'];
+
 const OrchestratorForStories = ({
 	source,
 	suggesters,
-	data = {},
+	data,
 	management = false,
 	pagination = false,
 	modalForControls = false,
-	features = ['VTL'],
+	features = defaultFeatures,
 	bindings: initialBindings,
 	initialPage = '1',
 	getStoreInfo = getStoreInfoRequired,

package/src/stories/utils/orchestrator.js

@@ -6,14 +6,16 @@ function getStoreInfoRequired() {
 	return {};
 }
 
+const defaultFeatures = ['VTL'];
+
 const OrchestratorForStories = ({
 	source,
 	suggesters,
-	data = {},
+	data,
 	management = false,
 	pagination = false,
 	modalForControls = false,
-	features = ['VTL'],
+	features = defaultFeatures,
 	bindings: initialBindings,
 	initialPage = '1',
 	getStoreInfo = getStoreInfoRequired,

package/src/tests/utils/to-expose/handler/results/res-input-edited.json

@@ -1,158 +1,158 @@
-{
-	"components": [
-		{ "id": "1", "componentType": "Sequence", "depth": 1 },
-		{
-			"id": "2",
-			"componentType": "Input",
-			"response": {
-				"name": "inputOk",
-				"values": {
-					"PREVIOUS": null,
-					"COLLECTED": "My input",
-					"FORCED": null,
-					"EDITED": "My new input",
-					"INPUTED": null
-				}
-			},
-			"depth": 1
-		},
-		{
-			"id": "3",
-			"componentType": "CheckboxGroup",
-			"responses": [
-				{
-					"response": {
-						"name": "check1",
-						"values": {
-							"PREVIOUS": null,
-							"COLLECTED": true,
-							"FORCED": null,
-							"EDITED": null,
-							"INPUTED": null
-						}
-					}
-				},
-				{
-					"response": {
-						"name": "check2",
-						"values": {
-							"PREVIOUS": null,
-							"COLLECTED": false,
-							"FORCED": true,
-							"EDITED": null,
-							"INPUTED": null
-						}
-					}
-				}
-			],
-			"depth": 1
-		},
-		{
-			"id": "4",
-			"componentType": "Table",
-			"cells": [
-				[
-					{ "label": "label", "depth": 1 },
-					{
-						"componentType": "Radio",
-						"response": {
-							"name": "table11",
-							"values": {
-								"PREVIOUS": null,
-								"COLLECTED": "1",
-								"FORCED": null,
-								"EDITED": null,
-								"INPUTED": null
-							}
-						},
-						"depth": 1
-					}
-				]
-			],
-			"depth": 1
-		},
-		{
-			"id": "5",
-			"componentType": "RosterForLoop",
-			"components": [
-				{
-					"componentType": "Input",
-					"response": {
-						"name": "Roster",
-						"values": {
-							"PREVIOUS": [null],
-							"COLLECTED": ["ok"],
-							"FORCED": [null],
-							"EDITED": [null],
-							"INPUTED": [null]
-						}
-					},
-					"depth": 2
-				}
-			],
-			"depth": 1
-		}
-	],
-	"variables": {
-		"EXTERNAL": { "VAR_EXTERNAL": "Value VAR_EXTERNAL" },
-		"CALCULATED": {
-			"Test": {
-				"expression": "inputOk || \" ok\"",
-				"value": "My new input ok",
-				"bindingDependencies": ["inputOk"]
-			}
-		},
-		"COLLECTED": {
-			"inputOk": {
-				"componentRef": "2",
-				"values": {
-					"PREVIOUS": null,
-					"COLLECTED": "My input",
-					"FORCED": null,
-					"EDITED": "My new input",
-					"INPUTED": null
-				}
-			},
-			"check1": {
-				"componentRef": "3",
-				"values": {
-					"PREVIOUS": null,
-					"COLLECTED": true,
-					"FORCED": null,
-					"EDITED": null,
-					"INPUTED": null
-				}
-			},
-			"check2": {
-				"componentRef": "3",
-				"values": {
-					"PREVIOUS": null,
-					"COLLECTED": false,
-					"FORCED": true,
-					"EDITED": null,
-					"INPUTED": null
-				}
-			},
-			"table11": {
-				"componentRef": "4",
-				"values": {
-					"PREVIOUS": null,
-					"COLLECTED": "1",
-					"FORCED": null,
-					"EDITED": null,
-					"INPUTED": null
-				}
-			},
-			"Roster": {
-				"componentRef": "5",
-				"values": {
-					"PREVIOUS": [null],
-					"COLLECTED": ["ok"],
-					"FORCED": [null],
-					"EDITED": [null],
-					"INPUTED": [null]
-				}
-			}
-		}
-	}
-}
+{
+	"components": [
+		{ "id": "1", "componentType": "Sequence", "depth": 1 },
+		{
+			"id": "2",
+			"componentType": "Input",
+			"response": {
+				"name": "inputOk",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "My input",
+					"FORCED": null,
+					"EDITED": "My new input",
+					"INPUTED": null
+				}
+			},
+			"depth": 1
+		},
+		{
+			"id": "3",
+			"componentType": "CheckboxGroup",
+			"responses": [
+				{
+					"response": {
+						"name": "check1",
+						"values": {
+							"PREVIOUS": null,
+							"COLLECTED": true,
+							"FORCED": null,
+							"EDITED": null,
+							"INPUTED": null
+						}
+					}
+				},
+				{
+					"response": {
+						"name": "check2",
+						"values": {
+							"PREVIOUS": null,
+							"COLLECTED": false,
+							"FORCED": true,
+							"EDITED": null,
+							"INPUTED": null
+						}
+					}
+				}
+			],
+			"depth": 1
+		},
+		{
+			"id": "4",
+			"componentType": "Table",
+			"cells": [
+				[
+					{ "label": "label", "depth": 1 },
+					{
+						"componentType": "Radio",
+						"response": {
+							"name": "table11",
+							"values": {
+								"PREVIOUS": null,
+								"COLLECTED": "1",
+								"FORCED": null,
+								"EDITED": null,
+								"INPUTED": null
+							}
+						},
+						"depth": 1
+					}
+				]
+			],
+			"depth": 1
+		},
+		{
+			"id": "5",
+			"componentType": "RosterForLoop",
+			"components": [
+				{
+					"componentType": "Input",
+					"response": {
+						"name": "Roster",
+						"values": {
+							"PREVIOUS": [null],
+							"COLLECTED": ["ok"],
+							"FORCED": [null],
+							"EDITED": [null],
+							"INPUTED": [null]
+						}
+					},
+					"depth": 2
+				}
+			],
+			"depth": 1
+		}
+	],
+	"variables": {
+		"EXTERNAL": { "VAR_EXTERNAL": "Value VAR_EXTERNAL" },
+		"CALCULATED": {
+			"Test": {
+				"expression": "inputOk || \" ok\"",
+				"value": "My new input ok",
+				"bindingDependencies": ["inputOk"]
+			}
+		},
+		"COLLECTED": {
+			"inputOk": {
+				"componentRef": "2",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "My input",
+					"FORCED": null,
+					"EDITED": "My new input",
+					"INPUTED": null
+				}
+			},
+			"check1": {
+				"componentRef": "3",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": true,
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"check2": {
+				"componentRef": "3",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": false,
+					"FORCED": true,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"table11": {
+				"componentRef": "4",
+				"values": {
+					"PREVIOUS": null,
+					"COLLECTED": "1",
+					"FORCED": null,
+					"EDITED": null,
+					"INPUTED": null
+				}
+			},
+			"Roster": {
+				"componentRef": "5",
+				"values": {
+					"PREVIOUS": [null],
+					"COLLECTED": ["ok"],
+					"FORCED": [null],
+					"EDITED": [null],
+					"INPUTED": [null]
+				}
+			}
+		}
+	}
+}

package/src/utils/lib/splitting.js

@@ -1,16 +1,12 @@
 const getBindingsDependenciesCalculated = (variables) => {
 	if (!variables) return {};
-	return variables.reduce(
-		(acc, { variableType, name, bindingDependencies, shapeFrom }) => {
-			if (variableType === 'CALCULATED')
-				if (shapeFrom && bindingDependencies)
-					return { ...acc, [name]: [...bindingDependencies, shapeFrom] };
-			if (bindingDependencies) return { ...acc, [name]: bindingDependencies };
-			if (shapeFrom) return { ...acc, [name]: [shapeFrom] };
-			return acc;
-		},
-		{}
-	);
+	return variables.reduce((acc, { name, bindingDependencies, shapeFrom }) => {
+		if (shapeFrom && bindingDependencies)
+			return { ...acc, [name]: [...bindingDependencies, shapeFrom] };
+		if (bindingDependencies) return { ...acc, [name]: bindingDependencies };
+		if (shapeFrom) return { ...acc, [name]: [shapeFrom] };
+		return acc;
+	}, {});
 };
 
 const getAllDeps = (deps) => (variablesCalcDeps) => {
@@ -24,20 +20,51 @@ const getAllDeps = (deps) => (variablesCalcDeps) => {
 	}, []);
 };
 
+const getNestedVarsInFilterOrControl = (element) => {
+	if (element && Array.isArray(element?.bindingDependencies))
+		return element?.bindingDependencies;
+	return [];
+};
+
+const getNestedVarsInComponent = (component) => {
+	const {
+		componentType,
+		bindingDependencies = [],
+		conditionFilter,
+		controls = [],
+	} = component;
+	var bindings = [
+		...bindingDependencies, // bindingDependencies of Component
+		...getNestedVarsInFilterOrControl(conditionFilter), // bindingDependencies of its conditionFilter
+		...controls.reduce(
+			(acc, c) => [...acc, ...getNestedVarsInFilterOrControl(c)],
+			[]
+		), // bindingDependencies of its controls
+	];
+
+	if (componentType === 'Loop') {
+		const { components, loopDependencies } = component;
+		if (Array.isArray(loopDependencies))
+			bindings = [...bindings, ...loopDependencies];
+		if (Array.isArray(components)) {
+			bindings = components.reduce(
+				(acc, c) => [...acc, ...getNestedVarsInComponent(c)],
+				[...bindings]
+			);
+		}
+	}
+
+	return bindings;
+};
+
 const getNestedVars =
 	(components = []) =>
 	(variables) => {
 		const variableCalculatedDependencies =
 			getBindingsDependenciesCalculated(variables);
 		const depsVarsTemp = components
-			.reduce((acc, comp) => {
-				const { bindingDependencies, conditionFilter } = comp;
-				var superBind = [];
-				if (Array.isArray(bindingDependencies))
-					superBind = [...superBind, ...bindingDependencies];
-				if (Array.isArray(conditionFilter?.bindingDependencies))
-					superBind = [...superBind, ...conditionFilter.bindingDependencies];
-				return [...acc, ...superBind];
+			.reduce((acc, c) => {
+				return [...acc, ...getNestedVarsInComponent(c)];
 			}, [])
 			.filter((v, i, a) => a.indexOf(v) === i);
 		return getAllDeps(depsVarsTemp)(variableCalculatedDependencies).filter(
@@ -46,7 +73,6 @@ const getNestedVars =
 	};
 
 const getUsefullVariablesFromSource = (variables) => (nestedVars) => {
-	if (!variables) return true;
 	return variables.filter(({ variableType, name }) => {
 		if (variableType === 'CALCULATED' && !nestedVars.includes(name))
 			return false;
@@ -60,18 +86,24 @@ export const getSplitQuestionnaireSource = (source) => {
 	const { components, variables, ...rest } = source;
 	var split = [];
 	var currentComponents = [];
-	components.map((c, i) => {
-		const { componentType } = c;
+	var previousPage = null;
+	components.map((c) => {
+		const { componentType, page } = c;
 		// splitting by Sequence or Loop
-		if (componentType === 'Sequence' || componentType === 'Loop') {
+		if (
+			(componentType === 'Sequence' || componentType === 'Loop') &&
+			previousPage !== page
+		) {
 			if (currentComponents.length > 0) split.push(currentComponents);
 			currentComponents = [c];
 		} else {
 			currentComponents.push(c);
 		}
+		previousPage = page;
 		return null;
 	});
 	if (currentComponents.length > 0) split.push(currentComponents);
+
 	return split.reduce((prev, currentSource) => {
 		const firstPage = currentSource[0].page;
 		const maxPage = currentSource[currentSource.length - 1].page;

package/src/utils/to-expose/hooks/lunatic-split.js

@@ -17,13 +17,17 @@ import { useFilterComponents } from './filter-components';
 import { loadSuggesters } from '../../store-tools/auto-load';
 import { getCollectedStateByValueType, getState } from '..';
 
+const defaultData = {};
+const defaultPreferences = [COLLECTED];
+const defaultFeatures = ['VTL'];
+
 const useLunaticSplit = (
 	source,
-	data,
+	data = defaultData,
 	{
 		savingType = COLLECTED,
-		preferences = [COLLECTED],
-		features = ['VTL'],
+		preferences = defaultPreferences,
+		features = defaultFeatures,
 		management = false,
 		pagination = false,
 		modalForControls = false,
@@ -38,37 +42,48 @@ const useLunaticSplit = (
 		console.log('useLunaticSplit');
 		var start = new Date().getTime();
 	}
+	const fullQuestionnaire = useMemo(
+		() => mergeQuestionnaireAndData(source)(data),
+		[source, data]
+	);
 	const sources = useMemo(() => getSplitQuestionnaireSource(source), [source]);
+	const allData = useMemo(
+		() => getState(fullQuestionnaire),
+		[fullQuestionnaire]
+	);
+	const [allBindings, setAllBindings] = useState(() =>
+		getBindings(fullQuestionnaire)
+	);
+
 	const rootPagesOfSource = useMemo(
 		() => getRootPageInSources(sources),
 		[sources]
 	);
 
-	const [sourceIndice, setSourceIndice] = useState(0);
-	const [lunaticData, setLunaticData] = useState(data || {});
+	const [sourceIndex, setSourceIndex] = useState(0);
+	const [lunaticData, setLunaticData] = useState(allData);
 
 	const [initPage, setInitPage] = useState(false);
 	const featuresWithoutMD = features.filter((f) => f !== 'MD');
 
 	const [questionnaire, setQuestionnaire] = useState(() =>
-		mergeQuestionnaireAndData(sources[sourceIndice])(lunaticData)
+		mergeQuestionnaireAndData(sources[sourceIndex])(lunaticData)
 	);
 	const [bindings, setBindings] = useState(() => getBindings(questionnaire));
-	const [allBindings, setAllBindings] = useState(bindings);
 
 	const [wantedPage, setWantedPage] = useState(null);
 
 	// updating current source
 	useEffect(() => {
 		setInitPage(false);
-		const newQ = mergeQuestionnaireAndData(sources[sourceIndice])(lunaticData);
+		const newQ = mergeQuestionnaireAndData(sources[sourceIndex])(lunaticData);
 		setQuestionnaire(newQ);
 		const bind = getBindings(newQ);
 		setBindings(bind);
 		setAllBindings({ ...allBindings, ...bind });
 
 		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [sources, sourceIndice]);
+	}, [sources, sourceIndex]);
 
 	const getBindingsSplit = (quest) => {
 		const bind = getBindings(quest);
@@ -141,14 +156,14 @@ const useLunaticSplit = (
 
 	const isFirstPage = page === firstPage;
 	const isLastPage = page === maxPage;
-	const isFirstSource = sourceIndice === 0;
-	const isLastSource = sourceIndice === sources.length - 1;
+	const isFirstSource = sourceIndex === 0;
+	const isLastSource = sourceIndex === sources.length - 1;
 
 	const goSplitNext = () => {
 		if (!isLastSource) {
 			const stateData = getState(questionnaire);
 			setLunaticData(mergeStateData(lunaticData, stateData));
-			setSourceIndice(sourceIndice + 1);
+			setSourceIndex(sourceIndex + 1);
 		}
 	};
 
@@ -189,7 +204,7 @@ const useLunaticSplit = (
 		if (!isFirstSource) {
 			const stateData = getState(questionnaire);
 			setLunaticData(mergeStateData(lunaticData, stateData));
-			setSourceIndice(sourceIndice - 1);
+			setSourceIndex(sourceIndex - 1);
 		}
 	};
 
@@ -233,7 +248,7 @@ const useLunaticSplit = (
 		(newPage) => {
 			const p = newPage?.split('.')[0];
 			const index = rootPagesOfSource.findIndex((pages) => pages.includes(p));
-			if (index === sourceIndice) {
+			if (index === sourceIndex) {
 				setPage(newPage);
 				setWantedPage(null);
 			} else {
@@ -241,10 +256,10 @@ const useLunaticSplit = (
 				setWantedPage(newPage);
 				const stateData = getState(questionnaire);
 				setLunaticData(mergeStateData(lunaticData, stateData));
-				setSourceIndice(index);
+				setSourceIndex(index);
 			}
 		},
-		[lunaticData, questionnaire, rootPagesOfSource, sourceIndice]
+		[lunaticData, questionnaire, rootPagesOfSource, sourceIndex]
 	);
 
 	useEffect(() => {
@@ -252,13 +267,12 @@ const useLunaticSplit = (
 			if (wantedPage) {
 				setPage(wantedPage);
 				setWantedPage(null);
-				setInitPage(true);
 			} else {
 				const getNewInitPage = () => {
 					if (flow === FLOW_NEXT) {
 						const tempPage =
-							sourceIndice - 1 > 0
-								? sources[sourceIndice - 1].maxPage
+							sourceIndex - 1 > 0
+								? sources[sourceIndex - 1].maxPage
 								: sources[0].maxPage;
 						return getPage({
 							components: questionnaire.components,
@@ -270,8 +284,8 @@ const useLunaticSplit = (
 						});
 					} else if (flow === FLOW_PREVIOUS) {
 						const tempPage =
-							sourceIndice + 1 < sources.length - 1
-								? sources[sourceIndice + 1].firstPage
+							sourceIndex + 1 < sources.length - 1
+								? sources[sourceIndex + 1].firstPage
 								: sources[sources.length - 1].firstPage;
 						return getPage({
 							components: questionnaire.components,
@@ -289,12 +303,12 @@ const useLunaticSplit = (
 				else {
 					const newPage = getNewInitPage();
 					if (!newPage) {
-						if (flow === FLOW_NEXT) setSourceIndice(sourceIndice + 1);
-						else setSourceIndice(sourceIndice - 1);
+						if (flow === FLOW_NEXT) setSourceIndex(sourceIndex + 1);
+						else setSourceIndex(sourceIndex - 1);
 					} else setPage(newPage);
 				}
-				setInitPage(true);
 			}
+			setInitPage(true);
 		}
 	}, [
 		initPage,
@@ -305,7 +319,7 @@ const useLunaticSplit = (
 		page,
 		featuresWithoutMD,
 		management,
-		sourceIndice,
+		sourceIndex,
 		sources,
 		flow,
 		wantedPage,

package/src/utils/to-expose/hooks/lunatic.js

@@ -13,13 +13,17 @@ import { COLLECTED } from '../../../constants';
 import { useFilterComponents } from './filter-components';
 import { loadSuggesters } from '../../store-tools/auto-load';
 
+const defaultData = {};
+const defaultPreferences = [COLLECTED];
+const defaultFeatures = ['VTL'];
+
 const useLunatic = (
 	source,
-	data,
+	data = defaultData,
 	{
 		savingType = COLLECTED,
-		preferences = [COLLECTED],
-		features = ['VTL'],
+		preferences = defaultPreferences,
+		features = defaultFeatures,
 		management = false,
 		pagination = false,
 		modalForControls = false,