- fixed styles for paragraph field;

- update user's new faq item field - now editor;
- fixed displaying docs requested as html content;
- fixed displaying flow;
- fixed submitting new faq item;

src/assets/scss/components/appForm.scss

@@ -153,5 +153,42 @@
 }
 
 .appForm__content {
+  p {
+    margin-bottom: 10px;
 
+    &.ql-indent-1 {
+      padding-left: 3em;
+    }
+    &.ql-indent-2 {
+      padding-left: 6em;
+    }
+    &.ql-indent-3 {
+      padding-left: 9em;
+    }
+    &.ql-indent-4 {
+      padding-left: 12em;
+    }
+    &.ql-indent-5 {
+      padding-left: 15em;
+    }
+    &.ql-indent-6 {
+      padding-left: 18em;
+    }
+    &.ql-indent-7 {
+      padding-left: 21em;
+    }
+  }
+
+  h2 {
+    margin-bottom: 15px;
+    font-size: 1.5em;
+  }
+  h3 {
+    font-size: 1.2em;
+    margin-bottom: 10px;
+  }
+
+  li[data-list="bullet"] {
+    list-style: disc;
+  }
 }

src/assets/scss/components/formBuilder.scss

@@ -59,6 +59,47 @@
     align-items: flex-start;
   }
 
+  .label {
+    p {
+      margin-bottom: 10px;
+
+      &.ql-indent-1 {
+        padding-left: 3em;
+      }
+      &.ql-indent-2 {
+        padding-left: 6em;
+      }
+      &.ql-indent-3 {
+        padding-left: 9em;
+      }
+      &.ql-indent-4 {
+        padding-left: 12em;
+      }
+      &.ql-indent-5 {
+        padding-left: 15em;
+      }
+      &.ql-indent-6 {
+        padding-left: 18em;
+      }
+      &.ql-indent-7 {
+        padding-left: 21em;
+      }
+    }
+
+    h2 {
+      margin-bottom: 15px;
+      font-size: 1.5em;
+    }
+    h3 {
+      font-size: 1.2em;
+      margin-bottom: 10px;
+    }
+    
+    li[data-list="bullet"] {
+      list-style: disc;
+    }
+  }
+
   .actions {
     display: flex;
     gap: 0.5rem;

src/components/FormField/components/Wysiwyg/index.js

@@ -23,7 +23,6 @@ const Wysiwyg = ({
                 <button className="ql-underline" aria-label="Underline"></button>
                 <button className="ql-link" aria-label="Link"></button>
                 <button className="ql-list" value="ordered"></button>
-                <button className="ql-header" value="1"></button>
                 <button className="ql-header" value="2"></button>
                 <button className="ql-blockquote"></button>
                 <button className="ql-list" value="bullet"></button>

src/pages/BandoEdit/components/BandoEditFormStep2/index.js

@@ -96,11 +96,7 @@ const BandoEditFormStep2 = forwardRef(function ({ initialData, getFormErrors, st
         }
 
         storeSet.main.setAsyncRequest();
-        if (!formData.id) {
+        BandoService.updateBandoStep2(formData.id, formData, createCallback, errCreateCallback);
-            BandoService.createBando(formData, createCallback, errCreateCallback);
-        } else {
-            BandoService.updateBandoStep1(formData.id, formData, createCallback, errCreateCallback);
-        }
     }
 
     const createCallback = (data) => {

src/pages/BandoFlowEdit/index.js

@@ -129,6 +129,9 @@ const BandoFlowEdit = () => {
             const formOptions = data.data.map(o => ({ label: o.label, value: o.id }))
             storeSet.main.flowForms(data.data);
             setFormOptions([{label: '', value: ''}, ...formOptions]);
+            const bandoId = getBandoId();
+            storeSet.main.setAsyncRequest();
+            FlowService.getFlow(bandoId, getFlowCallback, errGetFlowCallback);
         }
         storeSet.main.unsetAsyncRequest();
     }
@@ -233,7 +236,6 @@ const BandoFlowEdit = () => {
         const bandoId = getBandoId();
         storeSet.main.setAsyncRequest();
         FormsService.getFormsForCall(bandoId, getFormsCallback, errGetFormsCallback);
-        FlowService.getFlow(bandoId, getFlowCallback, errGetFlowCallback)
     }, [id]);
 
     useEffect(() => {

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

@@ -3,22 +3,27 @@ import { head } from 'ramda';
 
 // store
 import { useStore } from '../../../../store';
+import renderHtmlContent from '../../../../helpers/renderHtmlContent';
 
 const BuilderElementProperLabel = ({ id, defaultLabel }) => {
     const elements = useStore().main.formElements();
-    const [label, setLabel] = useState();
+    const [label, setLabel] = useState('');
 
     useEffect(() => {
         const element = head(elements.filter(o => o.id === id));
-        const setting = head(element.settings.filter(o => o.name === 'label'));
+        const label = head(element.settings.filter(o => o.name === 'label'));
-        if (setting) {
+        const text = head(element.settings.filter(o => o.name === 'text'));
-            setLabel(setting.value);
+
+        if (label) {
+            setLabel(label.value);
+        } else if (text) {
+            setLabel(text.value);
         } else {
             setLabel(defaultLabel);
         }
     }, [elements]);
 
-    return label
+    return <div className="label">{renderHtmlContent(label)}</div>
 }
 
 export default BuilderElementProperLabel;

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

@@ -29,8 +29,8 @@ const ElementSetting = ({ setting, changeFn, updateDataFn }) => {
                 <button className="ql-underline" aria-label="Underline"></button>
                 <button className="ql-link" aria-label="Link"></button>
                 <button className="ql-list" value="ordered"></button>
-                <button className="ql-header" value="1"></button>
                 <button className="ql-header" value="2"></button>
+                <button className="ql-header" value="3"></button>
                 <button className="ql-blockquote"></button>
                 <button className="ql-list" value="bullet"></button>
                 <button className="ql-indent" value="-1"></button>
@@ -40,7 +40,7 @@ const ElementSetting = ({ setting, changeFn, updateDataFn }) => {
     };
 
     const header = renderHeader();
-console.log('setting', setting)
+
     return <div className="formElementSettings__field" key={setting.name}>
         <label htmlFor={setting.name}>{settingLabels[setting.name]}</label>
         {setting.name === 'options'

src/pages/BandoView/index.js

@@ -156,7 +156,7 @@ const BandoView = () => {
                     <div className="appPageSection__withBorder">
                         <h2>{__('Documentazione Richiesta', 'gepafin')}</h2>
                         <div className="row rowContent">
-                            <p>{data.documentationRequested}</p>
+                            <p>{renderHtmlContent(data.documentationRequested)}</p>
                         </div>
                     </div>
 

src/pages/BandoViewBeneficiario/index.js

@@ -25,6 +25,7 @@ import { Message } from 'primereact/message';
 import BandoService from '../../service/bando-service';
 import FaqItemService from '../../service/faq-item-service';
 import ApplicationService from '../../service/application-service';
+import { Editor } from 'primereact/editor';
 
 const BandoViewBeneficiario = () => {
     const isAsyncRequest = useStore().main.isAsyncRequest();
@@ -84,7 +85,7 @@ const BandoViewBeneficiario = () => {
     }
 
     const submitNewQuestion = () => {
-        if (newQuestion) {
+        if (newQuestion && chosenCompanyId && 0 !== chosenCompanyId) {
             if (bandoMsgs.current) {
                 bandoMsgs.current.clear();
             }
@@ -97,7 +98,7 @@ const BandoViewBeneficiario = () => {
                 "isVisible": false
             }
             storeSet.main.setAsyncRequest();
-            FaqItemService.addQuestion(id, obj, createCallBack, errCreateCallback)
+            FaqItemService.addQuestion(id, obj, createCallBack, errCreateCallback, [['companyId', chosenCompanyId]])
         }
     }
 
@@ -172,6 +173,26 @@ const BandoViewBeneficiario = () => {
         storeSet.main.unsetAsyncRequest();
     }
 
+    const renderHeader = () => {
+        return (
+            <span className="ql-formats">
+                <button className="ql-bold" aria-label="Bold"></button>
+                <button className="ql-italic" aria-label="Italic"></button>
+                <button className="ql-underline" aria-label="Underline"></button>
+                <button className="ql-link" aria-label="Link"></button>
+                <button className="ql-list" value="ordered"></button>
+                <button className="ql-header" value="2"></button>
+                <button className="ql-header" value="3"></button>
+                <button className="ql-blockquote"></button>
+                <button className="ql-list" value="bullet"></button>
+                <button className="ql-indent" value="-1"></button>
+                <button className="ql-indent" value="+1"></button>
+            </span>
+        );
+    };
+
+    const header = renderHeader();
+
     useEffect(() => {
         const bandoId = getBandoId();
         storeSet.main.setAsyncRequest();
@@ -260,7 +281,7 @@ const BandoViewBeneficiario = () => {
                     <div className="appPageSection__withBorder">
                         <h2>{__('Documentazione Richiesta', 'gepafin')}</h2>
                         <div className="row rowContent">
-                            <p>{data.documentationRequested}</p>
+                            <p>{renderHtmlContent(data.documentationRequested)}</p>
                         </div>
                     </div>
 
@@ -303,13 +324,15 @@ const BandoViewBeneficiario = () => {
                         <h2>{__('Non hai trovato la risposta che cercavi?', 'gepafin')}</h2>
                         <div className="appForm__field">
                             <label htmlFor="newQuestion">{__('Fai una domanda', 'gepafin')}</label>
-                            <InputTextarea
+                            <Editor
                                 id="newQuestion"
-                                rows={7}
                                 value={newQuestion}
                                 placeholder={__('Digita qui la tua domanda', 'gepafin')}
-                                onChange={(e) => setNewQuestion(e.target.value)}
+                                headerTemplate={header}
-                                aria-describedby="newQuestion-help"/>
+                                onTextChange={(e) => setNewQuestion(e.htmlValue)}
+                                style={{ height: 80 * 3 }}
+                                aria-describedby="newQuestion-help"
+                            />
                             <small id="newQuestion-help">
                                 {__('Riceverai una notifica quando ti risponderemo', 'gepafin')}
                             </small>

src/service/faq-item-service.js

@@ -4,7 +4,7 @@ const API_BASE_URL = process.env.REACT_APP_API_EXECUTION_ADDRESS;
 
 export default class FaqItemService {
 
-    static addQuestion = (id, body, callback, errCallback) => {
+    static addQuestion = (id, body, callback, errCallback, queryParams) => {
-        NetworkService.post(`${API_BASE_URL}/faq/call/${id}`, body, callback, errCallback);
+        NetworkService.post(`${API_BASE_URL}/faq/call/${id}`, body, callback, errCallback, queryParams);
     };
 }