@inseefr/lunatic 0.1.7 → 0.1.8-experimental

package/src/utils/components/fab/fab.scss

@@ -0,0 +1,32 @@
+.lunatic-fab {
+	width: 32px;
+	height: 32px;
+	border-radius: 50%;
+	margin: 0;
+	padding: 0;
+	outline: inherit;
+	border: none;
+	background-color: royalblue;
+	box-shadow: 0px 3px 5px -1px rgb(0 0 0 / 20%),
+		0px 6px 10px 0px rgb(0 0 0 / 14%), 0px 1px 18px 0px rgb(0 0 0 / 12%);
+
+	&:hover {
+		cursor: pointer;
+		background-color: navy;
+		transition: background-color 1s;
+	}
+
+	&.mini {
+		width: 18px;
+		height: 18px;
+	}
+
+	&:focus {
+		border: solid 1px black;
+	}
+
+	&:disabled {
+		cursor: default;
+		background-color: darkgray;
+	}
+}

package/src/utils/components/fab/index.js

@@ -0,0 +1 @@
+export { default as Fab } from './fab';

package/src/utils/components/field-wrapper.js

@@ -0,0 +1,23 @@
+import React from 'react';
+import * as U from '../lib';
+import { TooltipResponse } from '../../components/tooltip';
+
+function FieldWrapper({ children, id, management, response }) {
+	return (
+		<div className="field-container">
+			<div className={`${management ? 'field-with-tooltip' : 'field'}`}>
+				{children}
+			</div>
+			{management && (
+				<div className="tooltip">
+					<TooltipResponse
+						id={id}
+						response={U.buildBooleanTooltipResponse(response)}
+					/>
+				</div>
+			)}
+		</div>
+	);
+}
+
+export default FieldWrapper;

package/src/utils/components/is-network/index.js

@@ -0,0 +1 @@
+export { default as IsNetwork } from './is-network';

package/src/utils/components/is-network/is-network.js

@@ -0,0 +1,39 @@
+import React, { useCallback, useState } from 'react';
+import classnames from 'classnames';
+import useOnlineStatus from './use-online-status';
+import NetworkIcon from '../../icons/network.icon';
+
+function getTitle(online) {
+	return `Network ${online ? 'on' : 'off'}`;
+}
+
+function IsNetwork({ notify = () => null, className }) {
+	const [online, setOnline] = useState(window.navigator.onLine);
+	const onlineCallback = useCallback(
+		function () {
+			setOnline(true);
+			notify(true);
+		},
+		[notify]
+	);
+	const offlineCallback = useCallback(
+		function () {
+			setOnline(false);
+			notify(false);
+		},
+		[notify]
+	);
+
+	useOnlineStatus(onlineCallback, offlineCallback);
+
+	return (
+		<div
+			className={classnames('is-network', className, { online })}
+			title={getTitle(online)}
+		>
+			<NetworkIcon />
+		</div>
+	);
+}
+
+export default IsNetwork;

package/src/utils/components/is-network/use-online-status.js

@@ -0,0 +1,51 @@
+import { useEffect } from 'react';
+
+function useOnlineStatus(online, offline) {
+	useEffect(
+		function () {
+			if (window.navigator.onLine && typeof online === 'function') {
+				online();
+			} else if (typeof offline === 'function') {
+				offline();
+			}
+		},
+		[online, offline]
+	);
+	useEffect(
+		function () {
+			let callback;
+			if (typeof online === 'function') {
+				callback = function (e) {
+					online();
+				};
+				window.addEventListener('online', callback);
+			}
+			return function () {
+				if (callback) {
+					window.removeEventListener('online', callback);
+				}
+			};
+		},
+		[online]
+	);
+
+	useEffect(
+		function () {
+			let callback;
+			if (typeof offline === 'function') {
+				callback = function (e) {
+					offline();
+				};
+				window.addEventListener('offline', callback);
+			}
+			return function () {
+				if (callback) {
+					window.removeEventListener('offline', callback);
+				}
+			};
+		},
+		[offline]
+	);
+}
+
+export default useOnlineStatus;

package/src/utils/components/label-wrapper.js

@@ -0,0 +1,45 @@
+import React from 'react';
+import classnames from 'classnames';
+import * as U from '../lib';
+import { interpret } from '../to-expose';
+
+function Label({ htmlFor, features, logFunction, bindings, label, id }) {
+	if (label) {
+		return (
+			<label className={classnames('lunatic-label')} htmlFor={htmlFor} id={id}>
+				{interpret(features, logFunction)(bindings)(label)}
+			</label>
+		);
+	}
+	return undefined;
+}
+
+function LabelWrapper({
+	children,
+	id,
+	htmlFor = '',
+	labelPosition = '',
+	bindings,
+	label,
+	features,
+	logFunction,
+}) {
+	const position = U.getLabelPositionClass(labelPosition);
+	return (
+		<div
+			className={classnames('lunatic-component-container', `${position}-ex`)}
+		>
+			<Label
+				id={id}
+				htmlFor={htmlFor}
+				bindings={bindings}
+				label={label}
+				features={features}
+				logFunction={logFunction}
+			/>
+			{children}
+		</div>
+	);
+}
+
+export default LabelWrapper;

package/src/utils/icons/closed.icon.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import LunaticIcon from './lunatic-icon';
+
+function ClosedIcon({ className, width = 32, height = 32 }) {
+	return (
+		<LunaticIcon className={className}>
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				width={width}
+				height={height}
+				x="0"
+				y="0"
+				enableBackground="new 0 0 32 32"
+				version="1.1"
+				viewBox="0 0 32 32"
+				xmlSpace="preserve"
+			>
+				<path d="M 25.628748,11.329813 C 25.38152,11.109877 25.088459,11 24.749838,11 H 7.2500941 C 6.9113359,11 6.6184798,11.109877 6.3710468,11.329813 6.1236139,11.549992 6,11.810303 6,12.111233 c 0,0.300869 0.1236139,0.56118 0.3710468,0.781177 l 8.7499062,7.777534 C 15.368659,20.88988 15.661516,21 16,21 c 0.338484,0 0.631614,-0.11012 0.878842,-0.330056 l 8.749906,-7.777595 C 25.875907,12.672413 26,12.412102 26,12.111172 c 0,-0.300869 -0.124093,-0.56118 -0.371252,-0.781359 z"></path>
+			</svg>
+		</LunaticIcon>
+	);
+}
+
+export default ClosedIcon;

package/src/utils/icons/cross.icon.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import LunaticIcon from './lunatic-icon';
+
+function CrossIcon({ className, width = 32, height = 32 }) {
+	return (
+		<LunaticIcon className={className}>
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				width={width}
+				height={height}
+				x="0"
+				y="0"
+				enableBackground="new 0 0 32 32"
+				version="1.1"
+				viewBox="0 0 32 32"
+				xmlSpace="preserve"
+			>
+				<path d="M 7.097006,7.0709627 C 6.4710386,7.6950801 6.0348033,8.5167883 6,9.3333333 l 6.666666,6.6666677 -6.6666655,6.666666 C 6.0406655,24.255963 7.7002437,25.930395 9.3333333,26 L 15.999999,19.333334 22.666665,26 C 24.255962,25.95934 25.930393,24.299755 26,22.666667 L 19.333332,16.000001 26,9.3333334 C 25.959335,7.7440359 24.299754,6.069605 22.666665,6 L 15.999999,12.666666 9.3333333,6 C 8.5386853,6.020332 7.7229758,6.4468492 7.097006,7.0709627 Z"></path>
+			</svg>
+		</LunaticIcon>
+	);
+}
+
+export default CrossIcon;

package/src/utils/icons/load.icon.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import LunaticIcon from './lunatic-icon';
+
+function ClosedIcon({ className, width = 32, height = 32 }) {
+	return (
+		<LunaticIcon className={className}>
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				width={width}
+				height={height}
+				x="0"
+				y="0"
+				enableBackground="new 0 0 32 32"
+				version="1.1"
+				viewBox="0 0 32 32"
+				xmlSpace="preserve"
+			>
+				<path d="m 10.628906,5.8808594 c -0.214987,-0.001 -0.42313,0.066105 -0.621094,0.203125 -0.197929,0.13695 -0.3337126,0.3059125 -0.4082026,0.5078125 -0.07434,0.20177 -0.063157,0.3725087 0.033203,0.5117187 L 10.667969,8.5996094 C 7.7654347,10.429719 6.000564,13.619938 6,17.054688 c 0,5.522849 4.477153,10 10,10 5.522847,0 10,-4.477151 10,-10 C 26.000084,13.846958 24.464581,10.867019 21.925781,9 l -2.167969,4.773438 c 0.779895,0.889532 1.238599,2.0462 1.242188,3.28125 0,2.76142 -2.238576,5 -5,5 -2.761424,0 -5,-2.238581 -5,-5 0.0042,-1.793391 0.969178,-3.443679 2.523438,-4.330079 l 1.089843,1.574219 c 0.09638,0.13927 0.25171,0.209318 0.466797,0.210938 0.215229,10e-4 0.421172,-0.06601 0.619141,-0.203125 0.19792,-0.13696 0.333879,-0.305933 0.408203,-0.507813 l 2.626953,-7.1386718 c 0.07422,-0.2019799 0.06311,-0.3725587 -0.0332,-0.5117187 -0.0963,-0.13917 -0.251768,-0.2093975 -0.4668,-0.2109375 z"></path>
+			</svg>
+		</LunaticIcon>
+	);
+}
+
+export default ClosedIcon;

package/src/utils/icons/lunatic-icon.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import classnames from 'classnames';
+import './lunatic-icon.scss';
+
+function ClosedIcon({ className, children }) {
+	return <i className={classnames('lunatic-icon', className)}>{children}</i>;
+}
+
+export default ClosedIcon;

package/src/utils/icons/lunatic-icon.scss

@@ -0,0 +1,4 @@
+.lunatic-icon {
+	display: flex;
+	justify-content: center;
+}

package/src/utils/icons/network.icon.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import LunaticIcon from './lunatic-icon';
+
+function CrossIcon({ className, width = 32, height = 32 }) {
+	return (
+		<LunaticIcon className={className}>
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				width={width}
+				height={height}
+				x="0"
+				y="0"
+				enableBackground="new 0 0 32 32"
+				version="1.1"
+				viewBox="0 0 32 32"
+				xmlSpace="preserve"
+			>
+				<path d="M 16.211514,6 C 11.574486,6.008 7.1494292,7.94279 4,11.34621 c 0.067313,0.60594 0.3511557,1.08182 1.0781965,1.29181 2.8398143,-3.15866 6.8857655,-4.96513 11.1333175,-4.9708 4.246875,0.008 8.291469,1.81516 11.12987,4.9742 0.42856,-0.18331 0.899659,-0.21808 1.074753,-1.28833 C 25.269539,7.94895 20.847185,6.00922 16.211514,6 Z m 0,3.33452 c -3.859338,0.004 -7.5270269,1.68269 -10.055121,4.59867 0.082129,0.59595 0.3347147,1.09028 1.0747495,1.2918 2.214919,-2.67556 5.5069425,-4.22502 8.9803715,-4.22664 3.472148,0.004 6.761427,1.5572 8.973481,4.23352 0.574616,-0.21997 1.032388,-0.55661 1.081639,-1.30212 -2.528736,-2.91477 -6.196335,-4.59084 -10.05512,-4.59523 z m -0.0034,3.33101 c -3.084894,0.002 -5.995941,1.42878 -7.8883982,3.86498 0.015118,0.87625 0.5660293,1.08257 1.095416,1.31584 1.5613712,-2.20255 4.0931392,-3.51208 6.7929792,-3.51359 2.700508,0.004 5.231123,1.31845 6.789531,3.52395 0.886465,-0.21657 1.135403,-0.70692 1.098867,-1.31932 -1.891063,-2.43881 -4.802322,-3.8677 -7.888395,-3.87186 z m 0,3.33449 c -2.316849,0.002 -4.46631,1.20748 -5.676888,3.18293 L 16.211554,26 21.884999,19.18982 c -1.2089,-1.97805 -3.358668,-3.18598 -5.676885,-3.1898 z" />
+			</svg>
+		</LunaticIcon>
+	);
+}
+
+export default CrossIcon;

package/src/utils/icons/on-drag.icon.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import LunaticIcon from './lunatic-icon';
+
+function CrossIcon({ className, width = 32, height = 32 }) {
+	return (
+		<LunaticIcon className={className}>
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				width={width}
+				height={height}
+				x="0"
+				y="0"
+				enableBackground="new 0 0 32 32"
+				version="1.1"
+				viewBox="0 0 32 32"
+				xmlSpace="preserve"
+			>
+				<path d="M 15.998805,0 C 15.791758,0 15.614821,0.068587 15.4636,0.2030911 L 10.109162,4.9578137 C 9.95798,5.0923491 9.884566,5.2516109 9.884566,5.4356753 c 0,0.1840189 0.07342,0.3431857 0.224596,0.4778615 0.151203,0.1345354 0.330468,0.2030913 0.537594,0.2030913 h 4.205182 V 14.854326 H 6.1166281 v -4.202792 c 0,-0.2072 -0.068555,-0.388637 -0.2030912,-0.539983 C 5.7788793,9.9602251 5.6197345,9.8845661 5.4356754,9.8845661 c -0.1840494,0 -0.3432982,0.07566 -0.4778615,0.2269849 L 0.2030911,15.4636 C 0.0685559,15.615109 1.2e-6,15.794159 0,16.001195 0,16.208242 0.068592,16.385179 0.2030911,16.5364 l 4.7547228,5.352049 c 0.1345352,0.151182 0.2937975,0.226985 0.4778615,0.226985 0.1840188,0 0.3431856,-0.07581 0.4778615,-0.226985 0.1345353,-0.151203 0.2030912,-0.328079 0.2030912,-0.535205 v -4.205182 h 8.7353099 v 8.73531 h -4.202794 c -0.207124,0 -0.388779,0.06855 -0.539982,0.203092 -0.151179,0.134675 -0.224596,0.293842 -0.224596,0.477861 0,0.184064 0.07341,0.343326 0.224596,0.477862 L 15.4636,31.796909 C 15.614821,31.931407 15.794147,32 16.001195,32 c 0.207036,-1e-6 0.383696,-0.06855 0.535205,-0.203091 l 5.352049,-4.754722 c 0.151326,-0.134563 0.226985,-0.293813 0.226985,-0.477862 0,-0.184058 -0.07566,-0.343204 -0.226985,-0.477861 -0.151346,-0.134536 -0.337561,-0.203092 -0.544762,-0.203092 h -4.198013 v -8.73531 h 8.737698 v 4.202793 c 0,0.207125 0.06855,0.386391 0.203092,0.537594 0.134675,0.151179 0.293842,0.226985 0.477861,0.226985 0.184064,0 0.343326,-0.0758 0.477862,-0.226985 L 31.796909,16.5364 C 31.931407,16.385179 32,16.205853 32,15.998805 31.999999,15.791768 31.93144,15.615109 31.796909,15.4636 L 27.042187,10.111551 C 26.907624,9.9602251 26.748374,9.8845661 26.564325,9.8845661 c -0.184058,0 -0.343204,0.07566 -0.477861,0.2269849 -0.134536,0.151346 -0.203092,0.335171 -0.203092,0.542372 v 4.200403 H 17.145674 V 6.1166281 h 4.200403 c 0.207201,0 0.391026,-0.068557 0.542372,-0.2030913 0.151326,-0.1346576 0.226985,-0.2938028 0.226985,-0.4778615 0,-0.1840494 -0.07566,-0.3432989 -0.226985,-0.4778616 L 16.5364,0.2030911 C 16.384891,0.0685559 16.205841,1.5e-6 15.998805,0 Z" />
+			</svg>
+		</LunaticIcon>
+	);
+}
+
+export default CrossIcon;

package/src/utils/icons/opened.icon.js

@@ -0,0 +1,24 @@
+import React from 'react';
+import LunaticIcon from './lunatic-icon';
+
+function OpenedIcon({ className, width = 32, height = 32 }) {
+	return (
+		<LunaticIcon className={className}>
+			<svg
+				xmlns="http://www.w3.org/2000/svg"
+				width={width}
+				height={height}
+				x="0"
+				y="0"
+				enableBackground="new 0 0 32 32"
+				version="1.1"
+				viewBox="0 0 32 32"
+				xmlSpace="preserve"
+			>
+				<path d="M 11.329813,6.371252 C 11.109877,6.61848 11,6.911541 11,7.250162 v 17.499744 c 0,0.338758 0.109877,0.631614 0.329813,0.879047 C 11.549992,25.876386 11.810303,26 12.111233,26 c 0.300869,0 0.56118,-0.123614 0.781177,-0.371047 l 7.777534,-8.749906 C 20.88988,16.631341 21,16.338484 21,16 21,15.661516 20.88988,15.368386 20.669944,15.121158 L 12.892349,6.371252 C 12.672413,6.124093 12.412102,6 12.111172,6 11.810303,6 11.549992,6.124093 11.329813,6.371252 Z"></path>
+			</svg>
+		</LunaticIcon>
+	);
+}
+
+export default OpenedIcon;

package/src/utils/idb-tools/clear-store.js

@@ -0,0 +1,16 @@
+async function clearStore(db, name) {
+	new Promise(function (resolve, reject) {
+		try {
+			const transaction = db.transaction(name, 'readwrite');
+			transaction.oncomplete = function () {
+				resolve(true);
+			};
+			const store = transaction.objectStore(name);
+			store.clear();
+		} catch (e) {
+			reject(e);
+		}
+	});
+}
+
+export default clearStore;

package/src/utils/idb-tools/get-entity.js

@@ -0,0 +1,15 @@
+function get(db, storeName, id) {
+	return new Promise(function (resolve, reject) {
+		const transaction = db.transaction(storeName, 'readwrite');
+		var store = transaction.objectStore(storeName);
+		const request = store.get(id);
+		transaction.onerror = function () {
+			reject(transaction.error);
+		};
+		request.onsuccess = function () {
+			resolve(request.result);
+		};
+	});
+}
+
+export default get;

package/src/utils/idb-tools/get-idb.js

@@ -0,0 +1,12 @@
+/* eslint-disable no-restricted-globals */
+function getIDB() {
+	const what = self || window;
+	return (
+		what.indexedDB ||
+		what.mozIndexedDB ||
+		what.webkitIndexedDB ||
+		what.msIndexedDB
+	);
+}
+
+export default getIDB;

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

@@ -0,0 +1,4 @@
+export { default as openDb } from './open-db';
+export { default as clearDb } from './clear-store';
+export { default as getIDB } from './get-idb';
+export { default as getEntity } from './get-entity';

package/src/utils/idb-tools/open-db.js

@@ -0,0 +1,32 @@
+/* eslint-disable no-restricted-globals */
+import getIDB from './get-idb';
+
+const IDB_REF = getIDB();
+
+function openStorage(name, version = 1) {
+	return new Promise(function (resolve, reject) {
+		if (!IDB_REF) {
+			reject('indexedDb not supported !');
+		}
+		const request = IDB_REF.open(name, version);
+		let db;
+		let doIt = true;
+
+		request.onupgradeneeded = function (e) {
+			doIt = false;
+			e.target.transaction.abort();
+			reject('fail');
+		};
+
+		request.onsuccess = function () {
+			db = request.result;
+			if (doIt) resolve(db);
+		};
+
+		request.onerror = function (e) {
+			reject(e);
+		};
+	});
+}
+
+export default openStorage;

package/src/utils/lib/alphabet.js

@@ -0,0 +1 @@
+export const getAlphabet = () => 'abcdefghijklmnopqrstuvwxyz'.split('');

package/src/utils/lib/array.js

@@ -0,0 +1,7 @@
+export const buildNullNestedArray = (array) => {
+	if (!Array.isArray(array)) return [];
+	return array.map((a) => {
+		if (Array.isArray(a)) return buildNullNestedArray(a);
+		return null;
+	});
+};

package/src/utils/lib/checkbox/group.js

@@ -0,0 +1,21 @@
+export const responseToClean = (response) => (preferences) => {
+	if (!preferences || !response.values) return false;
+	const { values } = response;
+	if (!values) return false;
+	const cutedValues = {
+		...values,
+		[preferences[preferences.length - 1]]: null,
+	};
+	return Object.values(cutedValues).filter((v) => v !== null).length === 0;
+};
+
+export const responsesToClean = (responses) => (preferences) => (key) => {
+	if (!preferences || !key) return false;
+	const values = responses.find((r) => r.response.name === key).response.values;
+	if (!values) return false;
+	const cutedValues = {
+		...values,
+		[preferences[preferences.length - 1]]: null,
+	};
+	return Object.values(cutedValues).filter((v) => v !== null).length === 0;
+};

package/src/utils/lib/checkbox/index.js

@@ -0,0 +1 @@
+export * from './group';

package/src/utils/lib/decorator/index.js

@@ -0,0 +1 @@
+export { default as titleDecorator } from './title-decorator';

package/src/utils/lib/decorator/title-decorator.js

@@ -0,0 +1,16 @@
+import React from 'react';
+
+const titleDecorator = WrappedComponent => {
+	const TitleComponent = props => {
+		const { title } = props;
+		return (
+			<>
+				<h1>{title}</h1>
+				<WrappedComponent />
+			</>
+		);
+	};
+	return TitleComponent;
+};
+
+export default titleDecorator;

package/src/utils/lib/env.js

@@ -0,0 +1,2 @@
+export const isDev =
+	!process.env.NODE_ENV || process.env.NODE_ENV === 'development';

package/src/utils/lib/event.js

@@ -0,0 +1,15 @@
+export const createObjectEvent = (
+	idParadataObject,
+	typeParadataObject,
+	type,
+	responseName,
+	value
+) => {
+	return {
+		idParadataObject,
+		typeParadataObject,
+		type,
+		responseName,
+		value,
+	};
+};

package/src/utils/lib/function.js

@@ -0,0 +1 @@
+export const isFunction = (f) => f && typeof f === 'function';

package/src/utils/lib/index.js

@@ -0,0 +1,19 @@
+export { getAlphabet } from './alphabet';
+export * from './array';
+export * from './checkbox';
+export { titleDecorator } from './decorator';
+export * from './env';
+export * from './input-number';
+export * from './label-position';
+export * from './loops';
+export * from './memo-check';
+export * from './missing';
+export * from './options-positioning';
+export * from './pagination';
+export * from './prop-types';
+export * from './responses';
+export { buildStyleObject } from './style';
+export * from './table';
+export * from './tooltip';
+export { isFunction } from './function';
+export { createObjectEvent } from './event';

package/src/utils/lib/input-number.js

@@ -0,0 +1,6 @@
+export const isNumberValid = (num, decimals = 0) => {
+	// \\ because of escaping, basic regex has only one \
+	if (num.includes('.') && !decimals) return false;
+	const regex = new RegExp(`^(-)?(0|[1-9]\\d*)(\\.(\\d){0,${decimals}})?$`);
+	return regex.test(num);
+};

package/src/utils/{label-position.js → lib/label-position.js}

@@ -1,12 +1,12 @@
-export const getLabelPositionClass = position => {
+export const getLabelPositionClass = (position) => {
 	switch (position) {
-		case 'TOP':
-			return 'label-top';
+		case 'LEFT':
+			return 'label-left';
 		case 'BOTTOM':
 			return 'label-bottom';
 		case 'RIGHT':
 			return 'label-right';
 		default:
-			return 'label-left';
+			return 'label-top';
 	}
 };

package/src/utils/lib/loops/bindings.js

@@ -0,0 +1,66 @@
+export const buildBindingsForDeeperComponents = (index) => (bindings) =>
+	bindings
+		? Object.entries(bindings).reduce((_, [name, value]) => {
+				if (Array.isArray(value)) return { ..._, [name]: value[index] };
+				return { ..._, [name]: value };
+		  }, {})
+		: {};
+
+export const buildLoopBindings = (index) => (vars) =>
+	Array.isArray(vars)
+		? vars.reduce((_, [name, value]) => {
+				if (Array.isArray(value)) return { ..._, [name]: value[index] };
+				return { ..._, [name]: value };
+		  }, {})
+		: {};
+
+export const buildLoopMissingResponse = (index) => (missingResponse) => {
+	if ((!index && index !== 0) || !missingResponse) return undefined;
+	const { name, values } = missingResponse;
+	const newValues = Object.entries(values).reduce(
+		(acc, [k, v]) => ({ ...acc, [k]: v[index] }),
+		{}
+	);
+	return { name, values: newValues };
+};
+
+const getDefaultDatasetStructure = (name, value) => ({
+	[name]: { dataStructure: { [name]: {} }, dataPoints: { [name]: value } },
+});
+
+export const buildVectorialBindings = (bindings) =>
+	bindings
+		? Object.entries(bindings).reduce((_, [name, value]) => {
+				if (Array.isArray(value))
+					return {
+						..._,
+						...getDefaultDatasetStructure(name, value),
+					};
+				return { ..._, [name]: value };
+		  }, {})
+		: {};
+
+export const displayLoop = (dependencyList) => (bindings) => {
+	if (!Array.isArray(dependencyList) || !bindings) return false;
+	return !(
+		dependencyList
+			.map((iv) =>
+				Array.isArray(bindings[iv][0])
+					? bindings[iv][0].flat()[0]
+					: bindings[iv][0]
+			)
+			.filter((v) => v).length === 0
+	);
+};
+
+export const displayLoopQuestion = (dependencyList) => (bindings) => {
+	if (!Array.isArray(dependencyList) || !bindings) return false;
+	if (dependencyList.length === 1) return true;
+	return !(
+		dependencyList
+			.map((iv) =>
+				Array.isArray(bindings[iv]) ? bindings[iv].flat()[0] : bindings[iv]
+			)
+			.filter((v) => v).length === 0
+	);
+};