@inseefr/lunatic 0.2.3-experimental → 0.2.3-prisme

package/src/components/suggester/find-best-label/find-best-label.js

@@ -1,49 +1,51 @@
-const WORKER_PATH =
-	process.env.LUNATIC_LABEL_WORKER_PATH ||
-	process.env.REACT_APP_LUNATIC_LABEL_WORKER_PATH;
-
-let WORKER;
-const TASKS = new Map();
-
-function getIdTask() {
-	const id = `${Date.now()}`;
-	if (id in TASKS) {
-		return getIdTask();
-	}
-	return id;
-}
-
-function getWorker() {
-	if (!WORKER) {
-		WORKER = new Worker(WORKER_PATH);
-		WORKER.addEventListener('message', function (e) {
-			const { data } = e;
-			const { response, idTask } = data;
-			if (idTask in TASKS) {
-				TASKS[idTask](response);
-			}
-		});
-	}
-	return WORKER;
-}
-
-/**
- *
- * @param {*} option
- * @param {*} search
- * @returns
- */
-function findBestLabel(option, search) {
-	return new Promise(function (resolve) {
-		const idTask = getIdTask();
-		const worker = getWorker();
-
-		TASKS[idTask] = function (response) {
-			resolve(response);
-			delete TASKS[idTask];
-		};
-		worker.postMessage({ option, search, idTask });
-	});
-}
-
-export default findBestLabel;
+import { createWorker } from '../../../utils/suggester-workers/create-worker';
+
+const WORKER_PATH =
+	process.env.LUNATIC_LABEL_WORKER_PATH ||
+	process.env.REACT_APP_LUNATIC_LABEL_WORKER_PATH;
+
+let WORKER;
+const TASKS = new Map();
+
+function getIdTask() {
+	const id = `${Date.now()}`;
+	if (id in TASKS) {
+		return getIdTask();
+	}
+	return id;
+}
+
+function getWorker() {
+	if (!WORKER) {
+		WORKER = createWorker(WORKER_PATH);
+		WORKER.addEventListener('message', function (e) {
+			const { data } = e;
+			const { response, idTask } = data;
+			if (idTask in TASKS) {
+				TASKS[idTask](response);
+			}
+		});
+	}
+	return WORKER;
+}
+
+/**
+ *
+ * @param {*} option
+ * @param {*} search
+ * @returns
+ */
+function findBestLabel(option, search) {
+	return new Promise(function (resolve) {
+		const idTask = getIdTask();
+		const worker = getWorker();
+
+		TASKS[idTask] = function (response) {
+			resolve(response);
+			delete TASKS[idTask];
+		};
+		worker.postMessage({ option, search, idTask });
+	});
+}
+
+export default findBestLabel;

package/src/components/suggester/find-best-label/index.js

@@ -1 +1 @@
-export { default } from './find-best-label';
+export { default } from './find-best-label';

package/src/components/suggester/idb-suggester.js

@@ -1,67 +1,73 @@
-import React, { useEffect, useMemo, useState } from 'react';
-import PropTypes from 'prop-types';
-import SuggesterWrapper from './suggester-wrapper';
-import createSearching from './searching';
-import CheckStore from './check-store';
-
-function IDBSuggester({
-	storeName,
-	idbVersion,
-	id,
-	className,
-	labelledBy,
-	optionRenderer,
-	labelRenderer,
-	onSelect,
-	disabled,
-	value,
-}) {
-	const [store, setStore] = useState(undefined);
-	const searching = useMemo(
-		function () {
-			if (store) {
-				return createSearching(storeName, idbVersion);
-			}
-			return undefined;
-		},
-		[storeName, idbVersion, store]
-	);
-
-	return (
-		<CheckStore
-			storeName={storeName}
-			idbVersion={idbVersion}
-			setStore={setStore}
-		>
-			<SuggesterWrapper
-				id={id}
-				className={className}
-				labelledBy={labelledBy}
-				optionRenderer={optionRenderer}
-				labelRenderer={labelRenderer}
-				onSelect={onSelect}
-				searching={searching}
-				storeName={storeName}
-				disabled={disabled}
-				value={value}
-			/>
-		</CheckStore>
-	);
-}
-
-IDBSuggester.defaultProps = {
-	idbVersion: '1',
-};
-
-IDBSuggester.propTypes = {
-	storeName: PropTypes.string.isRequired,
-	idbVersion: PropTypes.string,
-	id: PropTypes.string,
-	className: PropTypes.string,
-	labelledBy: PropTypes.string,
-	optionRenderer: PropTypes.func,
-	labelRenderer: PropTypes.func,
-	onSelect: PropTypes.func,
-};
-
-export default IDBSuggester;
+import React, { useMemo, useState } from 'react';
+import PropTypes from 'prop-types';
+import SuggesterWrapper from './suggester-wrapper';
+import createSearching from './searching';
+import CheckStore from './check-store';
+
+function IDBSuggester({
+	storeName,
+	idbVersion,
+	id,
+	className,
+	labelledBy,
+	optionRenderer,
+	labelRenderer,
+	onSelect,
+	disabled,
+	value,
+	focused,
+	response,
+	logFunction,
+}) {
+	const [store, setStore] = useState(undefined);
+	const searching = useMemo(
+		function () {
+			if (store) {
+				return createSearching(storeName, idbVersion);
+			}
+			return undefined;
+		},
+		[storeName, idbVersion, store]
+	);
+
+	return (
+		<CheckStore
+			storeName={storeName}
+			idbVersion={idbVersion}
+			setStore={setStore}
+		>
+			<SuggesterWrapper
+				id={id}
+				className={className}
+				labelledBy={labelledBy}
+				optionRenderer={optionRenderer}
+				labelRenderer={labelRenderer}
+				onSelect={onSelect}
+				searching={searching}
+				storeName={storeName}
+				disabled={disabled}
+				value={value}
+				focused={focused}
+				response={response}
+				logFunction={logFunction}
+			/>
+		</CheckStore>
+	);
+}
+
+IDBSuggester.defaultProps = {
+	idbVersion: '1',
+};
+
+IDBSuggester.propTypes = {
+	storeName: PropTypes.string.isRequired,
+	idbVersion: PropTypes.string,
+	id: PropTypes.string,
+	className: PropTypes.string,
+	labelledBy: PropTypes.string,
+	optionRenderer: PropTypes.func,
+	labelRenderer: PropTypes.func,
+	onSelect: PropTypes.func,
+};
+
+export default IDBSuggester;

package/src/components/suggester/lunatic-suggester.js

@@ -1,137 +1,140 @@
-import React, { useCallback, useState, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import Declarations from '../declarations';
-import * as U from '../../utils/lib';
-import * as C from '../../constants';
-import IDBSuggester from './idb-suggester';
-import LabelWrapper from '../../utils/components/label-wrapper';
-import FieldWrapper from '../../utils/components/field-wrapper';
-
-function getSuggestionId(suggestion) {
-	if (suggestion) {
-		return suggestion.id;
-	}
-	return null;
-}
-
-function Suggester({
-	id,
-	label,
-	preferences,
-	response,
-	handleChange,
-	disabled,
-	focused,
-	declarations,
-	features,
-	bindings,
-	management,
-	labelPosition,
-	style,
-	logFunction,
-	storeName,
-	optionRenderer,
-	labelRenderer,
-	idbVersion,
-}) {
-	const [value, setValue] = useState(() =>
-		U.getResponseByPreference(preferences)(response)
-	);
-	const labelId = `suggester-label-${id}`;
-	const onSelect = useCallback(
-		function (suggestion) {
-			const ids = getSuggestionId(suggestion);
-			handleChange({
-				[U.getResponseName(response)]: ids,
-			});
-			setValue(ids);
-		},
-		[handleChange, response]
-	);
-
-	return (
-		<>
-			<Declarations
-				id={id}
-				type={C.BEFORE_QUESTION_TEXT}
-				declarations={declarations}
-				features={features}
-				bindings={bindings}
-			/>
-			<LabelWrapper
-				id={labelId}
-				htmlFor={id}
-				labelPosition={labelPosition}
-				bindings={bindings}
-				label={label}
-				features={features}
-				logFunction={logFunction}
-			>
-				<Declarations
-					id={id}
-					type={C.AFTER_QUESTION_TEXT}
-					declarations={declarations}
-					features={features}
-					bindings={bindings}
-				/>
-				<FieldWrapper id={id} management={management} response={response}>
-					<IDBSuggester
-						storeName={storeName}
-						optionRenderer={optionRenderer}
-						labelRenderer={labelRenderer}
-						labelledBy={labelId}
-						idbVersion={idbVersion}
-						onSelect={onSelect}
-						focused={focused}
-						disabled={disabled}
-						response={response}
-						id={id}
-						value={value}
-					/>
-				</FieldWrapper>
-			</LabelWrapper>
-			<Declarations
-				id={id}
-				type={C.DETACHABLE}
-				declarations={declarations}
-				features={features}
-				bindings={bindings}
-			/>
-		</>
-	);
-}
-
-Suggester.defaultProps = {
-	label: '',
-	preferences: ['COLLECTED'],
-	response: {},
-	disabled: false,
-	focused: false,
-	declarations: [],
-	features: [],
-	bindings: {},
-	management: false,
-	labelPosition: 'DEFAULT',
-	style: {},
-	getStoreInfo: undefined,
-};
-
-Suggester.propTypes = {
-	id: PropTypes.string.isRequired,
-	label: PropTypes.string,
-	preferences: PropTypes.arrayOf(U.valueTypePropTypes),
-	response: U.responsePropTypes,
-	handleChange: PropTypes.func.isRequired,
-	disabled: PropTypes.bool,
-	focused: PropTypes.bool,
-	declarations: U.declarationsPropTypes,
-	features: PropTypes.arrayOf(PropTypes.string),
-	bindings: PropTypes.object,
-	management: PropTypes.bool,
-	labelPosition: PropTypes.oneOf(['DEFAULT', 'TOP', 'BOTTOM', 'LEFT', 'RIGHT']),
-	style: PropTypes.object,
-	storeInfo: PropTypes.object, //TODO
-	getStoreInfo: PropTypes.func,
-};
-
-export default React.memo(Suggester, U.areEqual);
+import React, { useCallback, useState } from 'react';
+import PropTypes from 'prop-types';
+import componentWrapper from '../component-wrapper';
+import Declarations from '../declarations';
+import * as U from '../../utils/lib';
+import * as C from '../../constants';
+import IDBSuggester from './idb-suggester';
+import LabelWrapper from '../../utils/components/label-wrapper';
+import FieldWrapper from '../../utils/components/field-wrapper';
+
+function getSuggestionId(suggestion) {
+	if (suggestion) {
+		return suggestion.id;
+	}
+	return null;
+}
+
+function Suggester({
+	id,
+	label,
+	preferences,
+	response,
+	handleChange,
+	disabled,
+	focused,
+	declarations,
+	features,
+	bindings,
+	management,
+	labelPosition,
+	style,
+	logFunction,
+	storeName,
+	optionRenderer,
+	labelRenderer,
+	idbVersion,
+}) {
+	const [value, setValue] = useState(() =>
+		U.getResponseByPreference(preferences)(response)
+	);
+	const labelId = `suggester-label-${id}`;
+	const onSelect = useCallback(
+		function (suggestion) {
+			const ids = getSuggestionId(suggestion);
+			// Delete: null --> empty to handle controls
+			handleChange({
+				[U.getResponseName(response)]: ids || '',
+			});
+			setValue(ids);
+		},
+		[handleChange, response]
+	);
+
+	return (
+		<>
+			<Declarations
+				id={id}
+				type={C.BEFORE_QUESTION_TEXT}
+				declarations={declarations}
+				features={features}
+				bindings={bindings}
+			/>
+			<LabelWrapper
+				id={labelId}
+				htmlFor={id}
+				labelPosition={labelPosition}
+				bindings={bindings}
+				label={label}
+				features={features}
+				logFunction={logFunction}
+			>
+				<Declarations
+					id={id}
+					type={C.AFTER_QUESTION_TEXT}
+					declarations={declarations}
+					features={features}
+					bindings={bindings}
+				/>
+				<FieldWrapper id={id} management={management} response={response}>
+					<IDBSuggester
+						storeName={storeName}
+						optionRenderer={optionRenderer}
+						labelRenderer={labelRenderer}
+						labelledBy={labelId}
+						idbVersion={idbVersion}
+						onSelect={onSelect}
+						focused={focused}
+						disabled={disabled}
+						response={response}
+						id={id}
+						value={value}
+						logFunction={logFunction}
+					/>
+				</FieldWrapper>
+			</LabelWrapper>
+			<Declarations
+				id={id}
+				type={C.DETACHABLE}
+				declarations={declarations}
+				features={features}
+				bindings={bindings}
+			/>
+		</>
+	);
+}
+
+Suggester.defaultProps = {
+	label: '',
+	preferences: ['COLLECTED'],
+	response: {},
+	disabled: false,
+	focused: false,
+	declarations: [],
+	features: [],
+	bindings: {},
+	management: false,
+	labelPosition: 'DEFAULT',
+	style: {},
+	getStoreInfo: undefined,
+};
+
+Suggester.propTypes = {
+	id: PropTypes.string.isRequired,
+	label: PropTypes.string,
+	preferences: PropTypes.arrayOf(U.valueTypePropTypes),
+	response: U.responsePropTypes,
+	handleChange: PropTypes.func.isRequired,
+	disabled: PropTypes.bool,
+	focused: PropTypes.bool,
+	declarations: U.declarationsPropTypes,
+	features: PropTypes.arrayOf(PropTypes.string),
+	bindings: PropTypes.object,
+	management: PropTypes.bool,
+	labelPosition: PropTypes.oneOf(['DEFAULT', 'TOP', 'BOTTOM', 'LEFT', 'RIGHT']),
+	style: PropTypes.object,
+	storeInfo: PropTypes.object, //TODO
+	getStoreInfo: PropTypes.func,
+};
+
+export default componentWrapper(React.memo(Suggester, U.areEqual));

package/src/components/suggester/searching/create-searching.js

@@ -1,47 +1,49 @@
-const WORKER_PATH =
-	process.env.LUNATIC_SEARCH_WORKER_PATH ||
-	process.env.REACT_APP_LUNATIC_SEARCH_WORKER_PATH;
-
-export function isWorkerCompatible() {
-	if (window.Worker) {
-		return true;
-	}
-	return false;
-}
-
-const searching = (worker) => (search, name, version) => {
-	if (!WORKER_PATH) {
-		throw new Error("Worker path is required for suggester's searches.");
-	}
-	if (isWorkerCompatible()) {
-		return new Promise(function (resolve) {
-			try {
-				if (worker) {
-					worker.terminate();
-				}
-				worker = new Worker(WORKER_PATH);
-				worker.postMessage({ search, name, version });
-				worker.addEventListener('message', function (e) {
-					const { data } = e;
-					resolve(data);
-					worker.terminate();
-					worker = undefined;
-				});
-			} catch (e) {
-				//TODO
-			}
-		});
-	} else {
-		// TODO
-	}
-};
-
-function createSearching(name, version) {
-	let worker = undefined;
-	const searching_ = searching(worker);
-	return async function (search) {
-		return searching_(search, name, version);
-	};
-}
-
-export default createSearching;
+import { createWorker } from '../../../utils/suggester-workers/create-worker';
+
+const WORKER_PATH =
+	process.env.LUNATIC_SEARCH_WORKER_PATH ||
+	process.env.REACT_APP_LUNATIC_SEARCH_WORKER_PATH;
+
+export function isWorkerCompatible() {
+	if (window.Worker) {
+		return true;
+	}
+	return false;
+}
+
+const searching = (worker) => (search, name, version) => {
+	if (!WORKER_PATH) {
+		throw new Error("Worker path is required for suggester's searches.");
+	}
+	if (isWorkerCompatible()) {
+		return new Promise(function (resolve) {
+			try {
+				if (worker) {
+					worker.terminate();
+				}
+				worker = createWorker(WORKER_PATH);
+				worker.postMessage({ search, name, version });
+				worker.addEventListener('message', function (e) {
+					const { data } = e;
+					resolve(data);
+					worker.terminate();
+					worker = undefined;
+				});
+			} catch (e) {
+				//TODO
+			}
+		});
+	} else {
+		// TODO
+	}
+};
+
+function createSearching(name, version) {
+	let worker = undefined;
+	const searching_ = searching(worker);
+	return async function (search) {
+		return searching_(search, name, version);
+	};
+}
+
+export default createSearching;

package/src/components/suggester/searching/index.js

@@ -1 +1 @@
-export { default } from './create-searching';
+export { default } from './create-searching';