Added container component for field with object type

Signed-off-by: Natalia Luzuriaga <[email protected]>

Author: natalialuzuriaga

js/generateFormComponents.js

@@ -23,7 +23,9 @@ function transformArrayToOptions(arr) {
 }
 
 function determineType(field) {
-	if (field.type === "array") {
+	if (field.type === "object") {
+		return "container";
+	} else if (field.type === "array") {
 		// Multi-select
 		if (field.items.hasOwnProperty("enum")) {
 			return "selectboxes";
@@ -148,7 +150,7 @@ function createComponent(fieldName, fieldObject) {
 					"maxDate": null
 				},
 				description: fieldObject["description"]
-			}
+			};
 		case "select-boolean":
 			return {
 				"label": fieldName,
@@ -171,7 +173,17 @@ function createComponent(fieldName, fieldObject) {
 				"type": "select",
 				"input": true,
 				description: fieldObject["description"]
-			}
+			};
+		case "container": 
+			return {
+				label: fieldName,
+				tableView: false,
+				validateWhenHidden: false,
+				key: fieldName,
+				type: "container",
+				input: true,
+				components: []
+			};
 		default:
 			break;
 	}
@@ -182,6 +194,28 @@ function createFormHeading(title, description) {
 	container.innerHTML = `<h1>${title}</h1>\n<h2>${description}</h2>`;
 }
 
+function createAllComponents(schema, prefix = ""){
+	let components = [];
+
+	console.log("checking schema", schema);
+
+	if (schema.type === "object" && schema.properties) {
+        for (const [key, value] of Object.entries(schema.properties)) {
+            
+			const fullKey = prefix ? `${prefix}.${key}` : key;
+
+			var fieldComponent = createComponent(key, value);
+
+			if (fieldComponent.type === "container") {
+				fieldComponent.components = createAllComponents(value, fullKey);
+			}
+			components.push(fieldComponent);
+        }
+    }
+
+    return components;
+}
+
 // Iterates through each json field and creates component array for Form.io
 async function createFormComponents() {
 	let components = [];
@@ -193,14 +227,7 @@ async function createFormComponents() {
 
 	createFormHeading(jsonData["title"], jsonData["description"]);
 
-	formFields = jsonData["properties"];
-	console.log("form Fields:", formFields);
-
-	for (const key in formFields) {
-		console.log(`${key}:`, formFields[key]);
-		var fieldComponent = createComponent(key, formFields[key]);
-		components.push(fieldComponent);
-	}
+	components = createAllComponents(jsonData);
 
 	// Add submit button to form
 	components.push({

schemas/schema-0.0.0.json

@@ -182,6 +182,7 @@
             },
             "date": {
                 "type": "object",
+                "description": "A date object describing the release",
                 "properties": {
                     "created": {
                         "type": "string",
@@ -209,6 +210,7 @@
             },
             "contact": {
                 "type": "object",
+                "description": "Point of contact for the release",
                 "properties": {
                     "email": {
                         "type": "string",