@visns-studio/visns-components 6.6.2 → 6.6.3

package/package.json

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

package/src/components/DataGrid.jsx

@@ -711,7 +711,9 @@ const DataGrid = forwardRef(
                             }
 
                             if (j - i > 1) {
-                                const children = rows.slice(i, j);
+                                const children = rows
+                                    .slice(i, j)
+                                    .map((child) => ({ ...child }));
                                 const parent = {
                                     __treeParent: true,
                                     id: `tree-group-${value}`,
@@ -2511,6 +2513,14 @@ const DataGrid = forwardRef(
                     timestamp: new Date().toISOString(),
                 });
 
+                // Synthetic tree parent rows are group summaries with a
+                // fabricated string id — they must never open the update modal
+                // or follow links. Their own controls (chevron, group action
+                // icons) stopPropagation before this handler fires.
+                if (rowProps.data?.__treeParent) {
+                    return;
+                }
+
                 const cellElement = event.target.closest(
                     '.InovuaReactDataGrid__cell'
                 );

package/src/components/Form.jsx

@@ -1310,6 +1310,26 @@ function Form({
                     }
                 }
 
+                // A form that never fetched its record (see the columnId > 0
+                // gate on the record GET) has no primary key — submitting
+                // would PUT/DELETE against `${url}/undefined`. Abort loudly
+                // instead.
+                if (
+                    ['update', 'delete'].includes(formType) &&
+                    !bulkEditMode &&
+                    !formSettings.json &&
+                    !formSettings.customUrl
+                ) {
+                    const pk = formData?.[formSettings.primaryKey];
+
+                    if (pk == null || pk === '' || Number.isNaN(Number(pk))) {
+                        toast.error(
+                            'This record could not be loaded, so it cannot be saved. Please close the form and reopen it from its row.'
+                        );
+                        return;
+                    }
+                }
+
                 let fields = formSettings.fields;
                 let _inputClass = inputClass;
                 let validation = '';
@@ -2199,32 +2219,67 @@ function Form({
                                                 fetchTable(createdItem);
                                             }
                                         } else {
-                                            const saveAnotherUrl = `${
-                                                saveAnother.url
-                                            }/${formData[saveAnother.dataKey]}`;
-                                            const resSaveAnother =
-                                                await CustomFetch(
-                                                    saveAnotherUrl,
-                                                    saveAnother.method,
-                                                    processedData
+                                            // Without a record id the follow-up
+                                            // would hit `${url}/undefined`, so
+                                            // skip the request and report it
+                                            // the same way a failed one is
+                                            const saveAnotherId =
+                                                formData?.[saveAnother.dataKey];
+
+                                            if (
+                                                saveAnotherId == null ||
+                                                saveAnotherId === '' ||
+                                                Number.isNaN(
+                                                    Number(saveAnotherId)
+                                                )
+                                            ) {
+                                                saveAnotherFailed = true;
+                                                toast.error(
+                                                    'Unable to run the follow-up action: the record id is missing.'
                                                 );
 
-                                            if (resSaveAnother.data.error === '') {
-                                                toast.success(saveAnother.message);
                                                 if (fetchTable) {
                                                     const createdItem =
-                                                        res.data.data || res.data;
+                                                        res.data.data ||
+                                                        res.data;
                                                     fetchTable(createdItem);
                                                 }
                                             } else {
-                                                saveAnotherFailed = true;
-                                                toast.error(
-                                                    resSaveAnother.data.error
-                                                );
-                                                if (fetchTable) {
-                                                    const createdItem =
-                                                        res.data.data || res.data;
-                                                    fetchTable(createdItem);
+                                                const saveAnotherUrl = `${
+                                                    saveAnother.url
+                                                }/${saveAnotherId}`;
+                                                const resSaveAnother =
+                                                    await CustomFetch(
+                                                        saveAnotherUrl,
+                                                        saveAnother.method,
+                                                        processedData
+                                                    );
+
+                                                if (
+                                                    resSaveAnother.data
+                                                        .error === ''
+                                                ) {
+                                                    toast.success(
+                                                        saveAnother.message
+                                                    );
+                                                    if (fetchTable) {
+                                                        const createdItem =
+                                                            res.data.data ||
+                                                            res.data;
+                                                        fetchTable(createdItem);
+                                                    }
+                                                } else {
+                                                    saveAnotherFailed = true;
+                                                    toast.error(
+                                                        resSaveAnother.data
+                                                            .error
+                                                    );
+                                                    if (fetchTable) {
+                                                        const createdItem =
+                                                            res.data.data ||
+                                                            res.data;
+                                                        fetchTable(createdItem);
+                                                    }
                                                 }
                                             }
                                         }

package/src/components/MultiSelect.jsx

@@ -36,7 +36,7 @@ const CustomOption = (props) => {
 
 // Custom MultiValue component to display description for selected values
 const CustomMultiValue = (props) => {
-    const { children, data, removeProps, settings, ...rest } = props;
+    const { children, data, settings, ...rest } = props;
     
     return (
         <components.MultiValue {...rest} data={data}>
@@ -62,61 +62,18 @@ const CustomMultiValue = (props) => {
     );
 };
 
-// Custom MultiValueRemove component with proper removal handling
+// Custom MultiValueRemove: fixed values cannot be deselected — render no
+// × at all (the module SCSS forces `display` on the remove button with
+// !important, so hiding it from the styles function is not enough).
+// Removal itself is react-select's own behaviour: CustomMultiValue
+// forwards removeProps, so innerProps already carries working
+// onClick/onTouchEnd handlers.
 const CustomMultiValueRemove = (props) => {
-    // Fixed values cannot be deselected: render no × at all — the module
-    // SCSS forces `display` on the remove button with !important, so
-    // hiding it from the styles function is not enough.
     if (props.data?.isFixed) {
         return null;
     }
 
-    const handleRemove = (e) => {
-        e.stopPropagation();
-        
-        // Try to find the data by looking at the DOM structure
-        const removeButton = e.currentTarget;
-        const multiValueContainer = removeButton.closest('.visns-select__multi-value');
-        
-        if (multiValueContainer) {
-            // Get the index of this multi-value item
-            const allMultiValues = removeButton.closest('.visns-select__value-container').querySelectorAll('.visns-select__multi-value');
-            const index = Array.from(allMultiValues).indexOf(multiValueContainer);
-            
-            console.log('MultiSelect: Found index:', index);
-            
-            // Get current value and remove the item at this index
-            const currentValue = props.selectProps?.value || [];
-            console.log('MultiSelect: Current value:', currentValue);
-            
-            if (index >= 0 && index < currentValue.length) {
-                const itemToRemove = currentValue[index];
-                const newValue = currentValue.filter((_, i) => i !== index);
-                
-                console.log('MultiSelect: Removing item at index', index, ':', itemToRemove);
-                console.log('MultiSelect: New value:', newValue);
-                
-                // Call onChange with the filtered value and remove action
-                if (props.selectProps?.onChange) {
-                    props.selectProps.onChange(newValue, {
-                        action: 'remove-value',
-                        removedValue: itemToRemove
-                    });
-                }
-            }
-        }
-    };
-    
-    return (
-        <components.MultiValueRemove 
-            {...props}
-            innerProps={{
-                ...props.innerProps,
-                onClick: handleRemove,
-                onMouseDown: (e) => e.stopPropagation()
-            }}
-        />
-    );
+    return <components.MultiValueRemove {...props} />;
 };
 
 // Custom NoOptionsMessage component to guide users about creation capability
@@ -333,15 +290,6 @@ function MultiSelect({
             menuPlacement={menuPlacement}
             onMenuOpen={handleMenuOpen}
             onChange={(inputValue, action) => {
-                // Debug logging for delete actions
-                if (action.action === 'remove-value') {
-                    console.log('MultiSelect: Individual item delete:', {
-                        removedValue: action.removedValue,
-                        newValue: inputValue,
-                        action: action
-                    });
-                }
-
                 // Values seeded with isFixed represent memberships this
                 // field is not allowed to take away (e.g. a tag's existing
                 // headers in an add-only group modal): ignore their removal