@visns-studio/visns-components 4.7.7 → 4.7.9

package/package.json

@@ -75,7 +75,7 @@
         "react-dom": "^17.0.0 || ^18.0.0"
     },
     "name": "@visns-studio/visns-components",
-    "version": "4.7.7",
+    "version": "4.7.9",
     "description": "Various packages to assist in the development of our Custom Applications.",
     "main": "src/index.js",
     "files": [

package/src/components/crm/Field.jsx

@@ -25,6 +25,7 @@ import VisnsDropZone from '../cms/DropZone';
 
 import 'react-toggle/style.css';
 import 'react-datepicker/dist/react-datepicker.css';
+import Item from '../cms/sorting/Item';
 
 function Field({
     api,
@@ -32,6 +33,7 @@ function Field({
     childDropdownCallback,
     fetchData,
     formData,
+    formSettings,
     inputValue,
     inputClass,
     mapbox,
@@ -153,83 +155,71 @@ function Field({
         }
     }, [settings, counter]);
 
-    useEffect(() => {
-        const fetchChildDropdownData = () => {
-            let filter = {};
-
-            if (settings.child && inputValue) {
-                let _inputValue = inputValue.value
-                    ? inputValue.value
-                    : inputValue;
-
-                if (_inputValue > 0) {
-                    if (Array.isArray(settings.child)) {
-                        settings.child.forEach((a) => {
-                            filter = {
-                                where: [
-                                    {
-                                        id: settings.id,
-                                        value: _inputValue,
-                                    },
-                                ],
-                            };
-
-                            if (a.fields) {
-                                filter.fields = a.fields;
-                            }
+    const fetchChildDropdownData = (s, v) => {
+        let filter = {};
 
-                            if (a.orderBy) {
-                                filter.orderBy = a.orderBy;
-                            }
+        if (s.child && v) {
+            let _inputValue = v.value ? v.value : v;
 
-                            CustomFetch(
-                                a.url,
-                                'POST',
-                                filter,
-                                function (result) {
-                                    childDropdownCallback({
-                                        id: a.id,
-                                        data: result.data,
-                                    });
-                                }
-                            );
-                        });
-                    } else {
+            if (_inputValue > 0) {
+                if (Array.isArray(s.child)) {
+                    s.child.forEach((a) => {
                         filter = {
                             where: [
                                 {
-                                    id: settings.id,
+                                    id: s.id,
                                     value: _inputValue,
                                 },
                             ],
                         };
 
-                        if (settings.fields) {
-                            filter.fields = settings.fields;
+                        if (a.fields) {
+                            filter.fields = a.fields;
                         }
 
-                        if (settings.orderBy) {
-                            filter.orderBy = settings.orderBy;
+                        if (a.orderBy) {
+                            filter.orderBy = a.orderBy;
                         }
 
-                        CustomFetch(
-                            settings.child.url,
-                            'POST',
-                            filter,
-                            function (result) {
-                                childDropdownCallback({
-                                    id: settings.child.id,
-                                    data: result.data,
-                                });
-                            }
-                        );
+                        CustomFetch(a.url, 'POST', filter, function (result) {
+                            childDropdownCallback({
+                                id: a.id,
+                                data: result.data,
+                            });
+                        });
+                    });
+                } else {
+                    filter = {
+                        where: [
+                            {
+                                id: s.id,
+                                value: _inputValue,
+                            },
+                        ],
+                    };
+
+                    if (s.fields) {
+                        filter.fields = s.fields;
                     }
+
+                    if (s.orderBy) {
+                        filter.orderBy = s.orderBy;
+                    }
+
+                    CustomFetch(s.child.url, 'POST', filter, function (result) {
+                        childDropdownCallback({
+                            id: s.child.id,
+                            data: result.data,
+                        });
+                    });
                 }
             }
-        };
+        }
+    };
 
-        fetchChildDropdownData();
-    }, [inputValue, settings, counter]);
+    useEffect(() => {
+        fetchChildDropdownData(settings, inputValue);
+    }, [inputValue, settings]);
 
     useEffect(() => {
         const processOptions = () => {
@@ -259,7 +249,7 @@ function Field({
         };
 
         processOptions();
-    }, [settings.options, settings]);
+    }, [settings.options, settings, counter]);
 
     const renderLabel = () => {
         if (
@@ -1582,13 +1572,29 @@ function Field({
 
     const handleAddEntry = (form) => {
         if (form) {
-            let f = form;
+            let f = { ...form }; // Create a copy of the form object to avoid direct mutation
 
             form.fields.forEach((item, itemKey) => {
-                if (item.hasOwnProperty('dataId') && formData[item.dataId]) {
-                    f.fields[itemKey].value = formData[item.dataId].value
-                        ? formData[item.dataId].value
-                        : formData[item.dataId];
+                if (item.hasOwnProperty('dataId')) {
+                    let value;
+
+                    if (Array.isArray(item.dataId)) {
+                        // If dataId is an array, nest the keys to access formData
+                        value = item.dataId.reduce((acc, key) => {
+                            return acc && acc[key] ? acc[key] : undefined;
+                        }, formData);
+                    } else {
+                        // If dataId is not an array, access formData directly
+                        value = formData[item.dataId]
+                            ? formData[item.dataId].value ||
+                              formData[item.dataId]
+                            : undefined;
+                    }
+
+                    // Set the value if it exists
+                    if (value !== undefined) {
+                        f.fields[itemKey].value = value;
+                    }
                 }
             });
 
@@ -1601,6 +1607,21 @@ function Field({
         setCounter(counter + 1);
     };
 
+    useEffect(() => {
+        if (counter > 0) {
+            if (settings.create.parent_id !== '') {
+                formSettings.fields.forEach((item) => {
+                    if (item.id === settings.create.parent_id) {
+                        fetchChildDropdownData(
+                            item,
+                            formData[settings.create.parent_id]
+                        );
+                    }
+                });
+            }
+        }
+    }, [counter]);
+
     return (
         <div className={formItemClass} style={formItemStyle}>
             <label className={styles.fi__label}>

package/src/components/crm/Form.jsx

@@ -693,8 +693,6 @@ function Form({
                         return acc;
                     }, {});
 
-                    console.info(payload);
-
                     const res = await CustomFetch(url, method, payload);
 
                     if (res.data.error === '') {
@@ -1158,6 +1156,7 @@ function Form({
                                         }
                                         fetchData={fetchData}
                                         formData={formData}
+                                        formSettings={formSettings}
                                         inputClass={inputClass}
                                         inputValue={renderInputValue(
                                             item,
@@ -1302,6 +1301,7 @@ function Form({
                                             }
                                             fetchData={fetchData}
                                             formData={formData}
+                                            formSettings={formSettings}
                                             inputClass={inputClass}
                                             inputValue={renderInputValue(
                                                 item,

package/src/components/crm/generic/GenericFormBuilder.jsx

@@ -1541,8 +1541,6 @@ function GenericFormBuilder({ setting, urlParam, userProfile }) {
                                                             <input
                                                                 type="text"
                                                                 style={{
-                                                                    padding:
-                                                                        '5px',
                                                                     height: '52px',
                                                                     padding:
                                                                         '1rem',