@inseefr/lunatic 3.4.8 → 3.4.10-rc.0

package/src/stories/utils/orchestrator.scss

@@ -18,7 +18,7 @@
 .story-with-sidebar aside label {
 	display: block;
 	font-weight: bold;
-	margin-bottom: .3em;
+	margin-bottom: 0.3em;
 }
 
 .story-with-sidebar aside {
@@ -26,7 +26,9 @@
 	grid-template-columns: 1fr;
 	gap: 1rem;
 	padding: 1rem;
-	box-shadow: 0 4px 3px rgba(0, 0, 0, 0.07), 0px 2px 2px rgba(0, 0, 0, 0.06);
+	box-shadow:
+		0 4px 3px rgba(0, 0, 0, 0.07),
+		0px 2px 2px rgba(0, 0, 0, 0.06);
 	background-color: #f1f5f9;
 
 	.pagination {
@@ -36,8 +38,8 @@
 
 .story-pager h3 {
 	font-size: 1rem;
-	padding-bottom: .3rem;
-	margin-bottom: .5rem;
+	padding-bottom: 0.3rem;
+	margin-bottom: 0.5rem;
 	border-bottom: solid 1px rgba(0, 0, 0, 0.3);
 }
 
@@ -46,7 +48,7 @@
 	padding: 0 0 0 20px;
 	line-height: 1.4;
 	font-size: 0.9rem;
-	color: rgba(0, 0, 0, 0.75)
+	color: rgba(0, 0, 0, 0.75);
 }
 
 .story-pager ul strong {
@@ -57,8 +59,8 @@
 	color: #721c24;
 	background-color: #f8d7da;
 	position: relative;
-	padding: .75rem 1.25rem;
+	padding: 0.75rem 1.25rem;
 	margin-bottom: 1rem;
 	border: 1px solid #f5c6cb;
-	border-radius: .25rem;
+	border-radius: 0.25rem;
 }

package/src/stories/utils/overview.scss

@@ -35,4 +35,3 @@
 		list-style: none;
 	}
 }
-

package/src/use-lunatic/commons/fill-components/fill-components.ts

@@ -14,6 +14,7 @@ import { getIterationsProp } from '../../props/propIterations';
 import { getOptionsProp } from '../../props/propOptions';
 
 type FillComponentArgs = {
+	disableFilters?: boolean;
 	handleChanges: LunaticChangesHandler;
 	executeExpression: LunaticReducerState['executeExpression'];
 	goToPage: LunaticState['goToPage'];
@@ -71,5 +72,7 @@ export function fillComponents(
 ): LunaticComponentProps[] {
 	return components
 		.map((component) => fillComponent(component, state))
-		.filter(({ conditionFilter }) => conditionFilter ?? true);
+		.filter(
+			({ conditionFilter }) => state.disableFilters || (conditionFilter ?? true)
+		);
 }

package/src/use-lunatic/commons/page.ts

@@ -24,10 +24,13 @@ export function pageStringToNumbers(page: string): number[] {
  * if no components can be displayed on this page (using filter)
  */
 export function isPageEmpty(state: LunaticReducerState): boolean {
-	const { executeExpression, pager } = state;
+	const { executeExpression, pager, options } = state;
 	const { iteration } = pager;
 	const components = getComponentsFromState(state);
 	const visibleComponents = components.filter((component) => {
+		if (options.disableFilters) {
+			return true;
+		}
 		if ('conditionFilter' in component && component.conditionFilter) {
 			return executeConditionFilter(
 				component.conditionFilter,

package/src/use-lunatic/lunatic-context.tsx

@@ -15,6 +15,7 @@ const LunaticContext = createContext({
 	missingShortcut: { dontKnow: '', refused: '' },
 	dontKnowButton: D.DK,
 	refusedButton: D.RF,
+	componentsOptions: { detailAlwaysDisplayed: false },
 });
 /** Provide `missing` `missingStrategy`, `shortcut` and `missingShortcut`, `dontKnowButton`, `refusedButton` to Missing component
  *  to manage non-response buttons and shortcut */
@@ -37,6 +38,11 @@ export const useLunaticMissing = () => {
 	};
 };
 
+export const useLunaticComponentsOptions = () => {
+	const { componentsOptions } = useContext(LunaticContext);
+	return componentsOptions;
+};
+
 /** Provide `management` to display data states [COLLECTED,EDITED,FORCED] */
 export const useLunaticManagement = () => {
 	return useContext(LunaticContext).management;
@@ -50,6 +56,7 @@ export function createLunaticProvider({
 	missingShortcut,
 	dontKnowButton,
 	refusedButton,
+	componentsOptions,
 }: {
 	management: boolean;
 	missing: boolean;
@@ -58,6 +65,7 @@ export function createLunaticProvider({
 	missingShortcut: { dontKnow: string; refused: string };
 	dontKnowButton: string;
 	refusedButton: string;
+	componentsOptions: { detailAlwaysDisplayed: boolean };
 }): FunctionComponent<PropsWithChildren> {
 	const value = {
 		management,
@@ -67,6 +75,7 @@ export function createLunaticProvider({
 		missingShortcut,
 		dontKnowButton,
 		refusedButton,
+		componentsOptions,
 	};
 	return function Provider({ children }: PropsWithChildren) {
 		return (

package/src/use-lunatic/props/propOptions.ts

@@ -8,12 +8,13 @@ import type { DeepTranslateExpression } from '../commons/fill-components/fill-co
 import { isNumber } from '../../utils/number';
 import type { LunaticVariablesStore } from '../commons/variables/lunatic-variables-store';
 
+/* Used for radio option and checkbox one option */
 export type InterpretedOption = {
 	label: ReactNode;
 	value?: string;
 	checked?: boolean;
-	detailLabel?: ReactNode;
 	description?: ReactNode;
+	detailLabel?: ReactNode;
 	detailValue?: string | null;
 	onDetailChange?: (value: string) => void;
 	onCheck?: () => void;

package/src/use-lunatic/reducer/reducerInitializer.tsx

@@ -35,6 +35,7 @@ const baseState = {
 	overview: [],
 	updateBindings: () => {},
 	executeExpression: <T,>() => null as T,
+	options: { disableFilters: false },
 } satisfies LunaticReducerState;
 
 export function reducerInitializer({
@@ -44,6 +45,7 @@ export function reducerInitializer({
 	initialPage = '1',
 	lastReachedPage = undefined,
 	withOverview = false,
+	disableFilters = false,
 	getReferentiel,
 	onVariableChange,
 	logger,
@@ -54,6 +56,7 @@ export function reducerInitializer({
 	initialPage?: LunaticOptions['initialPage'];
 	lastReachedPage?: LunaticOptions['lastReachedPage'];
 	withOverview?: LunaticOptions['withOverview'];
+	disableFilters?: LunaticOptions['disableFilters'];
 	getReferentiel?: LunaticOptions['getReferentiel'];
 	onVariableChange: RefObject<LunaticOptions['onVariableChange']>;
 	logger: LunaticLogger;
@@ -145,6 +148,7 @@ export function reducerInitializer({
 		overview: withOverview ? buildOverview(source) : [],
 		updateBindings,
 		executeExpression,
+		options: { disableFilters },
 	});
 }
 

package/src/use-lunatic/type.ts

@@ -131,9 +131,13 @@ export type LunaticReducerState = {
 		value: unknown,
 		options: { iteration?: number[] }
 	) => unknown;
+	options: {
+		disableFilters?: boolean;
+	};
 };
 
 export type LunaticOptions = {
+	disableFilters?: boolean;
 	features?: ('MD' | 'VTL')[];
 	preferences?: ['COLLECTED'];
 	savingType?: 'COLLECTED';
@@ -157,6 +161,7 @@ export type LunaticOptions = {
 	// Enable change tracking to keep a track of what variable changed (allow using getChangedData())
 	trackChanges?: boolean;
 	logger?: LunaticLogger;
+	componentsOptions?: { detailAlwaysDisplayed?: boolean };
 };
 
 // Type representing the return type of "useLunatic()"

package/src/use-lunatic/use-lunatic.test.ts

@@ -11,6 +11,7 @@ import sourceCleaningLoop from '../stories/behaviour/cleaning/source-loop.json';
 import sourceCleaningResizing from '../stories/behaviour/resizing/source-resizing-cleaning.json';
 import type { LunaticData, PageTag } from './type';
 import { useLunatic } from './use-lunatic';
+import { useCallback } from 'react';
 
 const dataFromObject = (o: Record<string, unknown>): LunaticData => {
 	return {
@@ -79,8 +80,22 @@ describe('use-lunatic()', () => {
 
 	describe('Provider', () => {
 		it('should not generate a new Provider every render', () => {
-			const { result } = renderHook(() => useLunatic(...defaultParams));
+			const { result } = renderHook(() => {
+				const missingStrategy = useCallback(() => {}, []);
+				return useLunatic(sourceSimpsons as any, undefined, {
+					management: false,
+					missing: false,
+					missingStrategy,
+					shortcut: false,
+					missingShortcut: { dontKnow: '1', refused: '2' },
+					dontKnowButton: 'DK',
+					refusedButton: 'RF',
+					componentsOptions: { detailAlwaysDisplayed: false },
+				});
+			});
+
 			const oldProvider = result.current.Provider;
+
 			act(() => {
 				result.current.goNextPage();
 			});
@@ -179,6 +194,58 @@ describe('use-lunatic()', () => {
 		});
 	});
 
+	describe('disable filters', () => {
+		const lunaticConfigurationWithoutDisableFilters = {
+			management: false,
+			activeControls: false,
+			initialPage: '1' as PageTag,
+			getStoreInfo: () => {},
+			missing: false,
+			shortcut: false,
+			activeGoNextForMissing: false,
+			showOverview: false,
+			filterDescription: true,
+		};
+
+		it('should filter out some components by default', function () {
+			const { result } = renderHook(() =>
+				useLunatic(
+					sourceLogement as any,
+					undefined,
+					lunaticConfigurationWithoutDisableFilters
+				)
+			);
+			act(() => result.current.goToPage({ page: '3' }));
+			const currentPage = result.current.pageTag;
+			expect(currentPage).not.toBe('3');
+		});
+		it('should filter out some components when false', function () {
+			const { result } = renderHook(() =>
+				useLunatic(sourceLogement as any, undefined, {
+					...lunaticConfigurationWithoutDisableFilters,
+					disableFilters: false,
+				})
+			);
+			act(() => result.current.goToPage({ page: '3' }));
+			const currentPage = result.current.pageTag;
+			expect(currentPage).not.toBe('3');
+		});
+		it('should not filter any component when true', function () {
+			const { result } = renderHook(() =>
+				useLunatic(sourceLogement as any, undefined, {
+					...lunaticConfigurationWithoutDisableFilters,
+					disableFilters: true,
+				})
+			);
+			act(() => result.current.goToPage({ page: '3' }));
+			const currentPage = result.current.pageTag;
+			expect(currentPage).toBe('3');
+
+			const components = result.current.getComponents();
+			expect(components.length).toBe(1);
+		});
+	});
+
 	describe('cleaning', () => {
 		it('should handle cleaning in a loop', () => {
 			const { result } = renderHook(() =>

package/src/use-lunatic/use-lunatic.ts

@@ -42,6 +42,7 @@ const DEFAULT_DONT_KNOW = D.DK;
 const DEFAULT_REFUSED = D.RF;
 
 const defaultOptions = {
+	disableFilters: false,
 	features: DEFAULT_FEATURES,
 	preferences: DEFAULT_PREFERENCES,
 	savingType: COLLECTED,
@@ -62,6 +63,7 @@ const defaultOptions = {
 	refusedButton: DEFAULT_REFUSED,
 	trackChanges: false,
 	logger: ConsoleLogger,
+	componentsOptions: { detailAlwaysDisplayed: false },
 } satisfies LunaticOptions;
 
 export function useLunatic(
@@ -71,6 +73,7 @@ export function useLunatic(
 ) {
 	const options = mergeDefault(argOptions, defaultOptions);
 	const {
+		disableFilters,
 		management,
 		missing,
 		missingStrategy,
@@ -82,6 +85,7 @@ export function useLunatic(
 		trackChanges,
 		preferences,
 		logger,
+		componentsOptions,
 	} = options;
 
 	// Help debug with warnings for options expected to be memoized
@@ -113,15 +117,19 @@ export function useLunatic(
 				missingShortcut,
 				dontKnowButton,
 				refusedButton,
+				componentsOptions,
 			}),
+		/* eslint-disable-next-line react-hooks/exhaustive-deps -- object deps are not being handled very well by useMemo so we need to compare single values */
 		[
 			management,
 			missing,
 			missingStrategy,
 			shortcut,
-			missingShortcut,
+			missingShortcut.dontKnow,
+			missingShortcut.refused,
 			dontKnowButton,
 			refusedButton,
+			componentsOptions.detailAlwaysDisplayed,
 		]
 	);
 
@@ -179,6 +187,7 @@ export function useLunatic(
 	const { isFirstPage, isLastPage } = isFirstLastPage(state.pager);
 
 	const components = fillComponents(getComponentsFromState(state), {
+		disableFilters,
 		handleChanges,
 		preferences,
 		goToPage,