Fix bug where dependencies override the element's title, used for the label, to the definition's title. (#161)

Author: Sabantu

src/formBuilder/utils.js

@@ -356,14 +356,15 @@ export function checkForUnsupportedFeatures(
 }
 
 // make an element out of the corresponding properties and UI properties
-function generateElement(
+function generateDependencyElement(
   name: string,
   dataProps: any,
   uiProperties: any,
   requiredNames: any,
   definitionData?: { [string]: any },
   definitionUi?: { [string]: any },
   categoryHash: { [string]: string },
+  useDefinitionDetails: boolean = true, // determines whether to use an element's definition details or not.
 ) {
   let uiProps = {
     ...uiProperties,
@@ -381,7 +382,8 @@ function generateElement(
     if (
       pathArr[0] === '#' &&
       pathArr[1] === 'definitions' &&
-      definitionData[pathArr[2]]
+      definitionData[pathArr[2]] &&
+      useDefinitionDetails === true
     ) {
       elementDetails = {
         ...elementDetails,
@@ -480,7 +482,6 @@ export function generateElementPropsFromSchemas(parameters: {
         ...uischema[parameter],
       };
     }
-
     newElement.name = parameter;
     newElement.required = requiredNames.includes(parameter);
     newElement.$ref = elementDetails.$ref;
@@ -513,6 +514,7 @@ export function generateElementPropsFromSchemas(parameters: {
   });
   // read dependent elements from dependencies
   if (schema.dependencies) {
+    const useDefinitionDetails = false;
     Object.keys(schema.dependencies).forEach((parent) => {
       const group = schema.dependencies[parent];
       if (group.oneOf) {
@@ -530,14 +532,15 @@ export function generateElementPropsFromSchemas(parameters: {
             ([parameter, element]) => {
               // create a new element if not present in main properties
               if (!Object.keys(elementDict).includes(parameter)) {
-                const newElement = generateElement(
+                const newElement = generateDependencyElement(
                   parameter,
                   element,
                   uischema[parameter],
                   requiredNames,
                   definitionData,
                   definitionUi,
                   categoryHash,
+                  useDefinitionDetails,
                 );
                 newElement.required = requiredValues.includes(newElement.name);
                 elementDict[newElement.name] = newElement;
@@ -557,14 +560,15 @@ export function generateElementPropsFromSchemas(parameters: {
       } else if (group.properties) {
         const requiredValues = group.required || [];
         Object.entries(group.properties).forEach(([parameter, element]) => {
-          const newElement = generateElement(
+          const newElement = generateDependencyElement(
             parameter,
             element,
             uischema[parameter],
             requiredNames,
             definitionData,
             definitionUi,
             categoryHash,
+            useDefinitionDetails,
           );
           newElement.required = requiredValues.includes(newElement.name);
           newElement.dependent = true;

src/formBuilder/utils.test.js

@@ -392,6 +392,55 @@ describe('generateElementPropsFromSchemas', () => {
     expect(cardObjArr[1].name).toEqual('obj3');
     expect(cardObjArr[2].name).toEqual('obj1');
   });
+
+  it('generates an array of card objects with titles that remain the same for dependency updates', () => {
+    const dependencySchema = {
+      type: 'object',
+      properties: {
+        parentFirstNames: {
+          $ref: '#/definitions/firstNames',
+          title: 'Parent First Names',
+          description: '',
+        },
+      },
+      dependencies: {
+        parentFirstNames: {
+          properties: {
+            childFirstNames: {
+              $ref: '#/definitions/firstNames',
+              title: 'Child First Names',
+              description: '',
+            },
+          },
+          required: [],
+        },
+      },
+      definitions: {
+        first_names: {
+          title: 'First Names',
+          type: 'string',
+        },
+      },
+      required: [],
+    };
+
+    const dependencyUiSchema = {
+      'ui:order': ['parentFirstNames', 'childFirstNames'],
+    };
+
+    const cardObjArr = generateElementPropsFromSchemas({
+      schema: dependencySchema,
+      uischema: dependencyUiSchema,
+      categoryHash: generateCategoryHash(DEFAULT_FORM_INPUTS),
+      allFormInputs: DEFAULT_FORM_INPUTS,
+    });
+    expect(cardObjArr).toHaveLength(2);
+
+    //check that the dependency element's title remains the same.
+    expect(cardObjArr[1].dataOptions.title).toEqual('Child First Names');
+    //check that the dependency element's title is not the definition's title.
+    expect(cardObjArr[1].dataOptions.title).not.toEqual('First Names');
+  });
 });
 
 describe('generateSchemaFromElementProps', () => {