Gestion des contrôles

Les contrôles permettent de définir les règles de validation dans le questionnaire (sous forme d'expression VTL). Le hook useLunatic fournit une fonction compileControls permettant d'exécuter ces contrôles et de récupérer les erreurs.

Structure d'un contrôle

Les contrôles sont définis au niveau des composants dans la source. Chaque contrôle possède les caractéristiques suivantes :

• Criticité : Peut être définie comme information, avertissement ou erreur.
• Type de contrôle : Peut être de format ou de cohérence.
• Expression : Définit la condition d'affichage du contrôle.
• Message d'erreur : Message affiché en cas de non-validation du contrôle.

L'expression et le message d'erreur peuvent être dynamiques et personnalisées via le VTL. La structure TypeScript d'un contrôle est la suivante :

export type ControlType = {
    id: string;
    criticality: 'INFO' | 'WARN' | 'ERROR';
    typeOfControl: 'FORMAT' | 'CONSISTENCY' | 'MANDATORY';
    control: {value: string, type: 'VTL'};
    errorMessage: {value: string, type: 'VTL' | 'VTL|MD' | 'TXT'};
    bindingDependencies?: string[];
    type?: 'roundabout' | 'ROW' | 'simple';
    iterations?: number;
};

Les types 'roundabout' et 'ROW' définissent des contrôles spécifiques. 'ROW' est utilisé uniquement dans un tableau pour définir un contrôle de ligne, tandis que 'roundabout' est utilisé dans le composant rond-point.

Utilisation des contrôles dans les orchestrateurs

Le hook Lunatic fournit la fonction compileControls, qui permet de récupérer la liste des erreurs courantes ainsi qu'un booléen isCritical. Ce dernier vaut true lorsqu'il y a une erreur avec une criticité ERROR ou de type de contrôle FORMAT.

Les composants peuvent ensuite utiliser ces erreurs en tant que propriétés pour les afficher.

Par exemple, en utilisant compileControls à chaque changement de page :

const [errors, setErrors] = useState();

const handleGoNext = () => {
    const { currentErrors } = compileControls();
    setErrors(currentErrors);
    if (!currentErrors) {
        goNextPage();
    }
};

return (
    <>
        {/* ... */}
        <LunaticComponents
            components={components}
            componentProps={() => ({
                errors: errors,
            })}
        />
        {/* ... */}
    </>
);

Dans cet exemple, currentErrors contient les erreurs actuelles retournées par compileControls. Si aucune erreur n'est présente, la fonction goNextPage() est appelée pour passer à la page suivante.