- form field label setting is reuqired when at least one validation setting is defined for a form field;

src/pages/BandoFormsEdit/components/BuilderElementSettings/components/ElementSetting/index.js

@@ -26,7 +26,7 @@ import getTokens from '../../../../../../helpers/getTokens';
 const ElementSettingSpreadsheet = React.lazy(() => import('../ElementSettingSpreadsheet'));
 
 
-const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus, context }) => {
+const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus, context, required, hasError }) => {
     const [existingVars, setExistingVars] = useState([]);
     const documentCategories = useStoreValue('documentCategories');
 
@@ -176,6 +176,7 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus, context
                 </>
         } else {
             return <InputText id={setting.name} aria-describedby={`${setting.name}-help`}
+                              className={hasError ? 'p-invalid' : undefined}
                               value={setting.value}
                               onChange={(e) => changeFn(e.target.value, setting.name)}/>
         }
@@ -199,8 +200,14 @@ const ElementSetting = ({ setting, changeFn, updateDataFn, bandoStatus, context
     }, []);
 
     return <div className="formElementSettings__field" key={setting.name}>
-        <label htmlFor={setting.name}>{settingLabels[setting.name]}</label>
+        <label htmlFor={setting.name}>
+            {settingLabels[setting.name]}
+            {required ? <span style={{ color: 'red', marginLeft: '4px' }}>*</span> : null}
+        </label>
         {getProperField(setting)}
+        {setting.name === 'label' && hasError
+            ? <small className="p-error">{__('Label è obbligatoria quando è impostata una validazione.', 'gepafin')}</small>
+            : null}
         {setting.name === 'formula' && !isEmpty(existingVars)
             ? <div className="formElementSettings__fieldVarsList">
                 <p>Existing variables: {existingVars.map(v => <code key={v}>{`{${v}}`}</code>)}</p>

src/pages/BandoFormsEdit/components/BuilderElementSettings/index.js

@@ -29,6 +29,7 @@ const BuilderElementSettings = ({ closeSettingsFn, callStatus, context }) => {
     const [validators, setValidators] = useState({});
     const [dynamicData, setDynamicData] = useState([]);
     const [criteria, setCriteria] = useState([]);
+    const [labelError, setLabelError] = useState(false);
     const numberBasedValidatorFields = ['min', 'max', 'minLength', 'maxLength'];
     const customValidationOptions = [
         { value: 'isPIVA', label: 'isPIVA' },
@@ -44,7 +45,18 @@ const BuilderElementSettings = ({ closeSettingsFn, callStatus, context }) => {
         { value: 'nonEmptyTables', label: 'nonEmptyTables' }
     ]
 
+    const hasAnyValidation = !isEmpty(validators) && (
+        validators.isRequired === true ||
+        Object.entries(validators)
+            .filter(([k]) => k !== 'isRequired')
+            .some(([, v]) => !isNil(v))
+    );
+
     const onChange = (value, name) => {
+        if (name === 'label' && labelError) {
+            setLabelError(false);
+        }
+
         const newSettings = settings
             .map(o => {
                 if (o.name === name) {
@@ -73,11 +85,21 @@ const BuilderElementSettings = ({ closeSettingsFn, callStatus, context }) => {
     }
 
     const saveSettings = () => {
+        const latestSettings = storeGet('chosenFieldSettings') || settings;
+
+        if (hasAnyValidation) {
+            const labelSetting = head(latestSettings.filter(o => o.name === 'label'));
+            if (labelSetting && isEmpty(labelSetting.value.trim())) {
+                setLabelError(true);
+                return;
+            }
+        }
+        setLabelError(false);
+
         let newActiveElementData = klona(activeElementData);
         // Prefer the store value over React state: child components (e.g. ElementSettingSpreadsheet)
         // write to the store synchronously, but React state updates are batched and may lag behind
         // when saveSettings is called in the same event as the last setDataFn call.
-        const latestSettings = storeGet('chosenFieldSettings') || settings;
         newActiveElementData = wrap(newActiveElementData).set(['settings'], latestSettings).value();
         newActiveElementData = wrap(newActiveElementData).set(['validators'], validators).value();
         newActiveElementData = wrap(newActiveElementData).set(['dynamicData'], dynamicData).value();
@@ -167,7 +189,9 @@ const BuilderElementSettings = ({ closeSettingsFn, callStatus, context }) => {
                                     context={context}
                                     callStatus={callStatus}
                                     changeFn={onChange}
-                                    updateDataFn={onUpdateOptions}/>)
+                                    updateDataFn={onUpdateOptions}
+                                    required={o.name === 'label' && hasAnyValidation}
+                                    hasError={o.name === 'label' && labelError && hasAnyValidation}/>)
                             : null}
                         {!isNil(dynamicDataOptions[activeElementData.name]) && context === 'application'
                             ? <div className="formElementSettings__field">