issue with changing options on schema fields

CHANGELOG.md

@@ -1,3 +1,9 @@
+## 4.5.7 (March 9th, 2022)
+
+### Fixed
+
+- issue with changing options on schema fields ( undefined would clobber defined values in option merge )
+
 ## 4.5.6 (March 8th, 2022)
 
 ### Fixed

src/components/FormField.js

@@ -2,7 +2,8 @@ import React, { useMemo, useEffect, useState } from 'react';
 import {
   computeFieldFromProperty,
   getSchemaPathFromJsonPath,
-  checkCondition
+  checkCondition,
+  sanitize
 } from '../utils';
 import { ObjectMap } from '../ObjectMap';
 import { useFormController } from '../hooks/useFormController';
@@ -98,7 +99,10 @@ const FormField = ({ name, schema, ...rest }) => {
         //   }
 
         if (target === name) {
-          logger('Updating field props for', target);
+          logger(
+            `Updating field props for ${target}`,
+            computeFieldFromProperty(name, property)
+          );
           setCondProp(computeFieldFromProperty(name, property));
         }
       };
@@ -127,9 +131,12 @@ const FormField = ({ name, schema, ...rest }) => {
       const condProps = condProp.props;
 
       // Lay those on top of existing ones
-      const newProps = { ...schemaProps, ...condProps, ...rest };
-
-      logger(`New Props for ${name}`, condProps);
+      const newSchemaProps = sanitize(schemaProps);
+      const newCondProps = sanitize(condProps);
+      const newProps = { ...newSchemaProps, ...newCondProps, ...rest };
+      logger(`Schema Props for ${name}`, newSchemaProps);
+      logger(`Cond Props for ${name}`, newCondProps);
+      logger(`New Props for ${name}`, newProps);
       return newProps;
     },
     [condProp]

src/utils.js

@@ -172,6 +172,18 @@ export const generateValue = ({ fieldType, maskedValue, multiple, value }) => {
   }
 };
 
+export const sanitize = obj => {
+  if (obj) {
+    const cleaned = JSON.parse(
+      JSON.stringify(obj, (key, value) => {
+        return value === undefined ? undefined : value;
+      })
+    );
+    return cleaned;
+  }
+  return obj;
+};
+
 /* -------------------------- Error Utils ----------------------------- */
 
 export const yupToFormErrors = yupError => {