@inseefr/lunatic 0.1.7 → 0.1.8-experimental

package/src/utils/store-tools/get-store-count.js

@@ -0,0 +1,22 @@
+import CONSTANTES from './constantes';
+
+function get(db) {
+	return new Promise(function (resolve, reject) {
+		try {
+			const transaction = db.transaction(
+				[CONSTANTES.STORE_DATA_NAME],
+				'readonly'
+			);
+
+			const store = transaction.objectStore(CONSTANTES.STORE_DATA_NAME);
+			const countRequest = store.count();
+			countRequest.onsuccess = function () {
+				resolve(countRequest.result);
+			};
+		} catch (e) {
+			reject(e);
+		}
+	});
+}
+
+export default get;

package/src/utils/store-tools/index.js

@@ -0,0 +1,5 @@
+export * as CONSTANTES from './constantes';
+export { default as openOrCreateStore } from './open-or-create-store';
+export { default as clearStoreData } from './clear-store-data';
+export { default as useStoreIndex } from './use-store-index';
+export { default as getStoreCount } from './get-store-count';

package/src/utils/store-tools/open-or-create-store.js

@@ -0,0 +1,47 @@
+/* eslint-disable no-restricted-globals */
+import CONSTANTE from './constantes';
+import { getIDB } from '../idb-tools';
+
+const IDB_REF = getIDB();
+
+function openStorage(name, idbVersion = 1) {
+	return new Promise(function (resolve, reject) {
+		if (!IDB_REF) {
+			reject('indexedDb not supported !');
+		}
+		const request = IDB_REF.open(name, idbVersion);
+		let db;
+		let doIt = true;
+
+		request.onupgradeneeded = function (e) {
+			doIt = false;
+			db = e.target.result;
+			const store = db.createObjectStore(CONSTANTE.STORE_DATA_NAME, {
+				keyPath: 'id',
+			});
+			db.createObjectStore(CONSTANTE.STORE_INFO_NAME, {
+				keyPath: 'name',
+			});
+			store.createIndex(CONSTANTE.STORE_INDEX_NAME, 'tokens', {
+				multiEntry: true,
+			});
+
+			const txn = e.target.transaction;
+			txn.oncomplete = function () {
+				resolve(db);
+			};
+		};
+
+		request.onsuccess = function () {
+			if (doIt) {
+				resolve(request.result);
+			}
+		};
+
+		request.onerror = function (e) {
+			reject(e);
+		};
+	});
+}
+
+export default openStorage;

package/src/utils/store-tools/use-store-index.js

@@ -0,0 +1,24 @@
+import { useEffect, useState } from 'react';
+import createStore from './create';
+
+function useStoreIndex(storeInfo, idbVersion) {
+	const [db, setDb] = useState(undefined);
+
+	useEffect(
+		function () {
+			async function init() {
+				if (storeInfo && idbVersion) {
+					const db = await createStore(storeInfo, idbVersion);
+					setDb(db);
+				}
+			}
+
+			init();
+			return function () {};
+		},
+		[storeInfo, idbVersion]
+	);
+	return db;
+}
+
+export default useStoreIndex;

package/src/utils/to-expose/handler.js

@@ -0,0 +1,137 @@
+import * as C from '../../constants';
+import { buildFilledComponent } from './init-questionnaire';
+import { supportedPreferences } from '../../constants/supported-preferences';
+import { getCalculatedVariables } from './init-questionnaire';
+import { isDev, isFunction } from '../lib';
+import {
+	CALCULATED_VAR_CATEGORY,
+	EVENT_VALUE_CHANGE,
+} from '../../constants/event-types';
+
+export const updateQuestionnaire =
+	(valueType) =>
+	(questionnaire) =>
+	(preferences, logFunction) =>
+	(updatedValues) => {
+		if (
+			!supportedPreferences.includes(valueType) ||
+			preferences.length === 0 ||
+			!updatedValues
+		)
+			return questionnaire;
+		const { variables, components, ...other } = questionnaire;
+		if (!components || components.length === 0) return questionnaire;
+		const varsAndRefs = Object.entries(updatedValues).reduce(
+			(acc, [key, value]) => {
+				const {
+					newVariables: { COLLECTED, ...otherVars },
+					refs,
+				} = acc;
+				const { componentRef, values } = COLLECTED[key];
+				const updated = {
+					componentRef,
+					values: {
+						...values,
+						[valueType]: buildNewValue(preferences)(valueType)(values)(value),
+					},
+				};
+				const newCollected = { ...COLLECTED, [key]: updated };
+				return {
+					newVariables: {
+						...otherVars,
+						COLLECTED: newCollected,
+					},
+					refs: [...refs, componentRef],
+				};
+			},
+			{ newVariables: variables, refs: [] }
+		);
+		const { newVariables, refs: r } = varsAndRefs;
+		const newVariablesWithCalculated =
+			valueType === C.COLLECTED
+				? addCalculatedVars(newVariables, updatedValues)(logFunction)
+				: newVariables;
+		const collectedVars = newVariables[C.COLLECTED];
+		const newComponents = components.map((c) => {
+			if (r.includes(c.id)) return buildFilledComponent(collectedVars)(c);
+			return c;
+		});
+		return {
+			...other,
+			variables: newVariablesWithCalculated,
+			components: newComponents,
+		};
+	};
+
+export const buildNewValue =
+	(preferences) => (valueType) => (oldValues) => (value) => {
+		if (preferences.length === 1) return value;
+		const index = preferences.indexOf(valueType);
+		if (index < 1) return value;
+		const valuesByPreference = preferences
+			.slice(0, index)
+			.map((p) => oldValues[p])
+			.filter((v) => v !== null);
+		const lastValue = valuesByPreference[valuesByPreference.length - 1];
+		return lastValue === value ? null : value;
+	};
+
+const getCollectedAndExternal = (variables) => {
+	const { COLLECTED } = variables;
+	const collected = Object.entries(COLLECTED).reduce(
+		(acc, [k, { values }]) => ({ ...acc, [k]: values.COLLECTED }),
+		{}
+	);
+	return { ...collected, ...variables.EXTERNAL };
+};
+
+const addCalculatedVars = (variables, updatedValues) => (logFunction) => {
+	if (
+		!variables[C.CALCULATED] ||
+		Object.keys(variables[C.CALCULATED]).length === 0
+	)
+		return variables;
+
+	if (isDev) {
+		console.log('Start var calculation');
+		var start = new Date().getTime();
+	}
+
+	const { COLLECTED, EXTERNAL, CALCULATED } = variables;
+
+	const updatedVars = Object.keys(updatedValues);
+
+	const bindings = getCollectedAndExternal(variables);
+
+	const calculated = Object.entries(CALCULATED).reduce((acc, [key, v]) => {
+		const { bindingDependencies, value } = v;
+		if (
+			Array.isArray(bindingDependencies) &&
+			!updatedVars.some((ai) => bindingDependencies.includes(ai))
+		) {
+			return { ...acc, [key]: v };
+		}
+		const calculatedVariables = getCalculatedVariables({ name: key, ...v })(
+			bindings
+		);
+		if (
+			isFunction(logFunction) &&
+			// Filter only filterResult vars : key.startsWith('FILTER_RESULT_') &&
+			JSON.stringify(value) !== JSON.stringify(calculatedVariables[key].value)
+		) {
+			logFunction({
+				idParadataObject: `${key}`,
+				typeParadataObject: CALCULATED_VAR_CATEGORY,
+				type: EVENT_VALUE_CHANGE,
+				oldValue: value,
+				newValue: calculatedVariables[key]?.value,
+			});
+		}
+		return { ...acc, ...calculatedVariables };
+	}, {});
+
+	if (isDev)
+		console.log(`End var calculation: ${new Date().getTime() - start} ms`);
+
+	return { EXTERNAL, COLLECTED, CALCULATED: calculated };
+};

package/src/utils/to-expose/hooks/filter-components.js

@@ -0,0 +1,106 @@
+import { interpret } from '../interpret';
+import { isDev, buildVectorialBindings } from '../../lib';
+
+let cache = {};
+
+const customFilterPagination = ({ page }, pagination, currentPage) => {
+	return pagination ? currentPage.split('.')[0] === page : true;
+};
+
+const filterComponents = ({ components, updatedVars, features, bindings }) => {
+	const localCache = {};
+	const filtered = components.filter(({ conditionFilter }) => {
+		if (!conditionFilter || !conditionFilter.value) return true;
+		const { bindingDependencies, value } = conditionFilter;
+		if (localCache[value] !== undefined) return localCache[value];
+		if (
+			(!bindingDependencies ||
+				!updatedVars.some((t) => bindingDependencies.includes(t))) &&
+			cache[value] !== undefined
+		)
+			return cache[value];
+		const vectorialBindings = buildVectorialBindings(bindings);
+		const inter = interpret(features)(vectorialBindings)(value);
+		localCache[value] = inter;
+		return inter;
+	});
+	cache = { ...cache, ...localCache };
+	return filtered;
+};
+
+const buildComponents = ({
+	components,
+	management,
+	bindings,
+	features,
+	page,
+	pagination,
+	todo,
+}) => {
+	if (management && !pagination) return components;
+
+	if (management && pagination)
+		return components.filter((c) =>
+			customFilterPagination(c, pagination, page)
+		);
+
+	if (isDev) {
+		console.log('Start filter');
+		var start = new Date().getTime();
+	}
+
+	const updatedVars = Object.keys(todo);
+
+	if (!pagination) {
+		const filtered = filterComponents({
+			components,
+			updatedVars,
+			features,
+			bindings,
+		});
+		if (isDev) console.log(`End filter: ${new Date().getTime() - start} ms`);
+		return filtered;
+	}
+
+	const pageComponents = components.filter((c) =>
+		customFilterPagination(c, pagination, page)
+	);
+
+	const pageComponentsFiltered = filterComponents({
+		components: pageComponents,
+		updatedVars,
+		features,
+		bindings,
+	});
+	if (isDev) console.log(`End filter: ${new Date().getTime() - start}`);
+	return pageComponentsFiltered;
+};
+
+let oldComponents = [];
+let memoryTodo = {};
+
+export const useFilterComponents = ({
+	questionnaire,
+	management,
+	bindings,
+	features,
+	page,
+	pagination,
+	todo,
+}) => {
+	if (Object.keys(todo).length > 0) {
+		memoryTodo = todo;
+		return oldComponents;
+	}
+	const components = buildComponents({
+		components: questionnaire.components,
+		management,
+		bindings,
+		features,
+		page,
+		pagination,
+		todo: memoryTodo,
+	});
+	oldComponents = components;
+	return components;
+};

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

@@ -0,0 +1 @@
+export { default } from './lunatic';

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

@@ -0,0 +1,191 @@
+import { useState, useEffect, useCallback } from 'react';
+import { mergeQuestionnaireAndData } from '../init-questionnaire';
+import { getBindings } from '../state';
+import { updateQuestionnaire } from '../handler';
+import { getPage, FLOW_NEXT, FLOW_PREVIOUS } from '../../lib';
+import { COLLECTED } from '../../../constants';
+import { useFilterComponents } from './filter-components';
+import { loadSuggesters } from '../../store-tools/auto-load';
+
+const useLunatic = (
+	source,
+	data,
+	{
+		savingType = COLLECTED,
+		preferences = [COLLECTED],
+		features = ['VTL'],
+		management = false,
+		pagination = false,
+		initialPage = '1',
+		logFunction = null,
+		autoSuggesterLoading = false,
+		suggesterFetcher,
+		suggesters,
+	}
+) => {
+	const [initPage, setInitPage] = useState(false);
+	const featuresWithoutMD = features.filter((f) => f !== 'MD');
+	const [questionnaire, setQuestionnaire] = useState(() =>
+		mergeQuestionnaireAndData(source)(data || {})
+	);
+	const bindings = getBindings(questionnaire);
+	const [page, setPage] = useState(initialPage);
+
+	const [todo, setTodo] = useState({});
+
+	const components = useFilterComponents({
+		questionnaire,
+		management,
+		bindings,
+		features: featuresWithoutMD,
+		page,
+		pagination,
+		todo,
+	});
+
+	const { suggesters: suggesterStrategy } = source;
+
+	useEffect(() => {
+		const init = async () => {
+			if (
+				autoSuggesterLoading &&
+				typeof suggesters === 'object' &&
+				Object.values(suggesters).length > 0
+			) {
+				// Merge suggester urls & suggester fields contained into lunatic json
+				const s = Object.entries(suggesterStrategy).reduce((acc, [name, d]) => {
+					if (suggesters[name]?.url)
+						return {
+							...acc,
+							[name]: {
+								...d,
+								url: suggesters[name].url,
+								stopWords: suggesters[name].stopWords,
+							},
+						};
+					return acc;
+				}, {});
+				loadSuggesters(suggesterFetcher)(s);
+			}
+		};
+		init();
+	}, [autoSuggesterLoading, suggesterFetcher, suggesters, suggesterStrategy]);
+
+	const [flow, setFlow] = useState(FLOW_NEXT);
+
+	// TODO: dynamic because of filters (kind of last accessible page)
+	const { maxPage } = source;
+
+	const isFirstPage = page === '1';
+	const isLastPage = page === maxPage;
+
+	// First param is the onClick event, useless for us but we have to keep it safe into
+	// function signature to avoid confusing with customBindings
+	const goNext = (_, customBindings) => {
+		if (!isLastPage) {
+			if (flow !== FLOW_NEXT) {
+				setFlow(FLOW_NEXT);
+			}
+			const nextPage = getPage({
+				components: questionnaire.components,
+				bindings: customBindings || bindings,
+				currentPage: page,
+				features: featuresWithoutMD,
+				flow: FLOW_NEXT,
+				management,
+			});
+			setPage(nextPage);
+		}
+	};
+
+	const goPrevious = () => {
+		if (!isFirstPage) {
+			if (flow !== FLOW_PREVIOUS) {
+				setFlow(FLOW_PREVIOUS);
+			}
+			const previousPage = getPage({
+				components: questionnaire.components,
+				bindings,
+				currentPage: page,
+				features: featuresWithoutMD,
+				flow: FLOW_PREVIOUS,
+				management,
+			});
+			setPage(previousPage);
+		}
+	};
+
+	useEffect(() => {
+		if (!initPage && components && components.length === 0)
+			// no component for initialPage, get next page
+			setPage(
+				getPage({
+					components: questionnaire.components,
+					bindings: bindings,
+					currentPage: page,
+					features: featuresWithoutMD,
+					flow: FLOW_NEXT,
+					management,
+				})
+			);
+		else if (!initPage && components && components.length > 0)
+			// initialPage is correct, end of initPage
+			setInitPage(true);
+	}, [
+		initPage,
+		components,
+		questionnaire.components,
+		bindings,
+		page,
+		featuresWithoutMD,
+		management,
+	]);
+
+	const handleChange = useCallback((updatedValue) => {
+		setTodo((t) => ({ ...t, ...updatedValue }));
+	}, []);
+
+	// Assume we only want to handle source update
+	useEffect(() => {
+		setQuestionnaire(mergeQuestionnaireAndData(source)(data));
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, [source]);
+
+	useEffect(() => {
+		if (Object.keys(todo).length !== 0) {
+			const newQ = updateQuestionnaire(savingType)(questionnaire)(
+				preferences,
+				logFunction
+			)(todo);
+			setQuestionnaire(newQ);
+			setTodo({});
+		}
+	}, [
+		todo,
+		preferences,
+		logFunction,
+		questionnaire,
+		savingType,
+		features,
+		management,
+	]);
+
+	return {
+		questionnaire,
+		handleChange,
+		components,
+		bindings,
+		pagination: {
+			page,
+			setPage,
+			maxPage,
+			goNext,
+			goPrevious,
+			isFirstPage,
+			isLastPage,
+			flow,
+		},
+	};
+};
+
+export default useLunatic;

package/src/utils/to-expose/hooks/use-document-add-event-listener.js

@@ -0,0 +1,63 @@
+import { useEffect } from 'react';
+
+const CALLBACKS = {};
+
+function getSignature(event, options = {}) {
+	return Object.entries(options).reduce(function (a, [k, v]) {
+		return `${a}-${k}-${v}`;
+	}, event);
+}
+
+function createListener(event, options) {
+	const signature = getSignature(event, options);
+	const listener = function (e) {
+		if (signature in CALLBACKS) {
+			const { callbacks } = CALLBACKS[signature];
+			callbacks.forEach(function (c) {
+				c(e);
+			});
+		}
+	};
+	document.addEventListener(event, listener, options);
+	return listener;
+}
+
+function unmount(event, callback, options) {
+	const signature = getSignature(event, options);
+	if (signature in CALLBACKS) {
+		const { listener, callbacks } = CALLBACKS[signature];
+		const index = callbacks.indexOf(callback);
+		CALLBACKS[signature].callbacks.splice(index, 1);
+		if (CALLBACKS[signature].callbacks.length === 0) {
+			delete CALLBACKS[signature];
+			document.removeEventListener(event, listener);
+		}
+	}
+}
+
+function mount(event, callback, options) {
+	const signature = getSignature(event, options);
+	if (!(signature in CALLBACKS)) {
+		const listener = createListener(event, options);
+		CALLBACKS[signature] = { listener, callbacks: [callback] };
+	} else {
+		CALLBACKS[signature] = {
+			...CALLBACKS[signature],
+			callbacks: [...CALLBACKS[signature].callbacks, callback],
+		};
+	}
+}
+
+function useDocumentAddEventListener(event, callback, options) {
+	useEffect(
+		function () {
+			mount(event, callback, options);
+			return function () {
+				unmount(event, callback, options);
+			};
+		},
+		[event, callback, options]
+	);
+}
+
+export default useDocumentAddEventListener;

package/src/utils/to-expose/index.js

@@ -0,0 +1,11 @@
+// updateQuestionnaire is useless since 2.0 optimization efforts
+// export { updateQuestionnaire } from './handler';
+export { mergeQuestionnaireAndData } from './init-questionnaire';
+export {
+	getState,
+	getCollectedState,
+	getCollectedStateByValueType,
+	getBindings,
+} from './state';
+export { interpret } from './interpret';
+export { default as useLunatic } from './hooks';