- fixed issue with undefined initial value for text input;

- completed company profile;
- updated logic of creating the application;

src/pages/ProfileCompany/index.js

@@ -1,40 +1,58 @@
-import React, { useMemo, useRef } from 'react';
+import React, { useEffect, useMemo, useRef, useState } from 'react';
 import { __ } from '@wordpress/i18n';
-import { isEmpty, isNil } from 'ramda';
+import { isEmpty, isNil, pathOr } from 'ramda';
 
 // store
 import { storeSet, useStore } from '../../store';
 
 // components
 import { Messages } from 'primereact/messages';
-import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
 import FormField from '../../components/FormField';
 import { Button } from 'primereact/button';
 import { useForm } from 'react-hook-form';
+import BlockingOverlay from '../../components/BlockingOverlay';
 
 // api
 import CompanyService from '../../service/company-service';
 
 // tools
 import { isPIVA } from '../../helpers/validators';
-import BlockingOverlay from '../../components/BlockingOverlay';
+import set404FromErrorResponse from '../../helpers/set404FromErrorResponse';
+import { klona } from 'klona';
 
 const ProfileCompany = () => {
     const isAsyncRequest = useStore().main.isAsyncRequest();
     const companies = useStore().main.companies();
     const infoMsgs = useRef(null);
+    const [formInitialData, setFormInitialData] = useState({});
 
     const {
         control,
         handleSubmit,
         formState: { errors },
-        setValue
+        setValue,
+        getValues
     } = useForm({
         defaultValues: useMemo(() => {
-            return companies[0];
-        }, [companies]),
+            return formInitialData;
+        }, [formInitialData]),
         mode: 'onChange'
     });
+    const values = getValues();
+    const emptyValues = Object.values(values).filter(v => isEmpty(v) || isNil(v)).length;
+
+    const setEmptyValues = () => {
+        const formData = {
+            cap: '',
+            pec: '',
+            email: '',
+            city: '',
+            codiceFiscale: '',
+            address: '',
+            companyName: ''
+        }
+        Object.keys(formData).map(k => setValue(k, formData[k]));
+    }
 
     const onSubmit = (formData) => {
         infoMsgs.current.clear();
@@ -66,6 +84,8 @@ const ProfileCompany = () => {
         if (isValid) {
             storeSet.main.setAsyncRequest();
             CompanyService.checkVat(checkVatCallback, errCheckVatCallback, [['vatNumber', e.target.value]])
+        } else {
+            setEmptyValues();
         }
     }
 
@@ -87,19 +107,32 @@ const ProfileCompany = () => {
                     vatNumber: piva,
                     companyName: denominazione
                 }
-                console.log('formData', formData);
                 Object.keys(formData).map(k => setValue(k, formData[k]));
             }
             //setData(getFormattedBandiData(data.data));
+        } else {
+            setEmptyValues();
         }
         storeSet.main.unsetAsyncRequest();
     }
 
     const errCheckVatCallback = (data) => {
+        setEmptyValues();
         set404FromErrorResponse(data);
         storeSet.main.unsetAsyncRequest();
     }
 
+    useEffect(() => {
+        const newFormData = klona(formInitialData);
+        Object.keys(newFormData).map(v => setValue(v, newFormData[v]));
+    }, [formInitialData]);
+
+    useEffect(() => {
+        const chosenCompany = pathOr({}, [0], companies);
+        console.log('chosenCompany', chosenCompany, companies)
+        setFormInitialData(chosenCompany);
+    }, [companies]);
+
     return (
         <div className="appPage">
             <div className="appPage__pageHeader">
@@ -221,7 +254,7 @@ const ProfileCompany = () => {
                 <div className="appPageSection">
                     <div className="appPageSection__actions">
                         <Button
-                            disabled={isAsyncRequest}
+                            disabled={isAsyncRequest || emptyValues || values.id}
                             label={__('Salva modifiche', 'gepafin')}
                             icon="pi pi-check" iconPos="right"/>
                     </div>