#1689 Add set active tab method in Common Properties (#1690)

canvas_modules/common-canvas/__tests__/common-properties/properties-controller-test.js

@@ -26,6 +26,7 @@ import datasetMetadata from "../test_resources/json/datasetMetadata.json";
 import structureListEditorParamDef from "../test_resources/paramDefs/structurelisteditor_paramDef.json";
 import structureTableParamDef from "../test_resources/paramDefs/structuretable_paramDef.json";
 import checkboxsetParamDef from "../test_resources/paramDefs/checkboxset_paramDef.json";
+import tabParamDef from "../test_resources/paramDefs/tab_paramDef.json";
 import checkboxParamDef from "../test_resources/paramDefs/checkbox_paramDef.json";
 import actionParamDef from "../test_resources/paramDefs/action_paramDef.json";
 import numberfieldParamDef from "../test_resources/paramDefs/numberfield_paramDef.json";
@@ -2407,3 +2408,22 @@ describe("Properties Controller getTopLevelActiveGroupId", () => {
 
 	});
 });
+
+describe("Properties Controller setTopLevelActiveGroup", () => {
+	it("should set the top level active group id in properties controller", () => {
+		reset();
+		const renderedObject = testUtils.flyoutEditorForm(tabParamDef);
+		controller = renderedObject.controller;
+		const wrapper = renderedObject.wrapper;
+
+		controller.setTopLevelActiveGroupId("Primary3");
+		let topLevelActiveGroupId = controller.getTopLevelActiveGroupId();
+		expect(topLevelActiveGroupId).to.equal("Primary3");
+
+		// Select Condition in accordion
+		const conditionsCategory = wrapper.find("div.properties-category-container").at(2);
+		conditionsCategory.find("button.properties-category-title").simulate("click");
+		topLevelActiveGroupId = controller.getTopLevelActiveGroupId();
+		expect(topLevelActiveGroupId).to.equal("Primary2");
+	});
+});

canvas_modules/common-canvas/src/common-properties/properties-controller.js

@@ -136,6 +136,11 @@ export default class PropertiesController {
 		return this.propertiesStore.getActiveTab();
 	}
 
+	// Set the top-level active tab using tabId
+	setTopLevelActiveGroupId(tabId) {
+		this.propertiesStore.setActiveTab(tabId);
+	}
+
 	isTearsheetContainer() {
 		return this.propertiesConfig.containerType === "Tearsheet";
 	}

canvas_modules/harness/src/client/App.js

@@ -280,6 +280,7 @@ class App extends React.Component {
 			tableButtonEnabled: true,
 			staticRowsPropertyId: "{ \"name\": \"parameterName\"}",
 			staticRowsIndexes: "",
+			setActiveTab: "",
 			disableWideFlyoutPrimaryButtonForPanelId: "{ \"name\": \"panelName\"}",
 			wideFlyoutPrimaryButtonDisabled: false,
 
@@ -356,6 +357,7 @@ class App extends React.Component {
 		this.setHideEditButton = this.setHideEditButton.bind(this);
 		this.setTableButtonEnabled = this.setTableButtonEnabled.bind(this);
 		this.setStaticRows = this.setStaticRows.bind(this);
+		this.setActiveTabTopLevel = this.setActiveTabTopLevel.bind(this);
 		this.disableWideFlyoutPrimaryButton = this.disableWideFlyoutPrimaryButton.bind(this);
 
 		this.clearSavedZoomValues = this.clearSavedZoomValues.bind(this);
@@ -955,6 +957,18 @@ class App extends React.Component {
 		}
 	}
 
+	// Button to call propertiesController to set active top level tab
+	setActiveTabTopLevel() {
+		if (this.propertiesController) {
+			try {
+				const activeTab = this.state.setActiveTab;
+				this.propertiesController.setTopLevelActiveGroupId(activeTab);
+			} catch (ex) {
+				console.error(ex);
+			}
+		}
+	}
+
 	// Button to call propertiesController to set addRemoveRows
 	disableWideFlyoutPrimaryButton() {
 		if (this.propertiesController) {
@@ -2715,6 +2729,8 @@ class App extends React.Component {
 			staticRowsPropertyId: this.state.staticRowsPropertyId,
 			staticRowsIndexes: this.state.staticRowsIndexes,
 			setStaticRows: this.setStaticRows,
+			setActiveTab: this.state.setActiveTab,
+			setActiveTabTopLevel: this.setActiveTabTopLevel,
 			maxLengthForMultiLineControls: this.state.maxLengthForMultiLineControls,
 			maxLengthForSingleLineControls: this.state.maxLengthForSingleLineControls,
 			selectedPropertiesDropdownFile: this.state.selectedPropertiesDropdownFile,

canvas_modules/harness/src/client/components/sidepanel/properties/sidepanel-properties-param-def.json

@@ -32,6 +32,7 @@
 		"tableButtonEnabled": true,
 		"staticRowsPropertyId": "{ \"name\": \"parameterName\"}",
 		"staticRowsIndexes": "",
+		"setActiveTab": "",
 		"disableWideFlyoutPrimaryButtonForPanelId": "{ \"name\": \"panelId\"}",
 		"wideFlyoutPrimaryButtonDisabled": false
 	},
@@ -204,6 +205,10 @@
 			"id": "staticRowsIndexes",
 			"type": "string"
 		},
+		{
+			"id": "setActiveTab",
+			"type": "string"
+		},
 		{
 			"id": "disableWideFlyoutPrimaryButtonForPanelId",
 			"type": "string"
@@ -532,6 +537,18 @@
 					"default": "[0, 1]"
 				}
 			},
+			{
+				"parameter_ref": "setActiveTab",
+				"label": {
+					"default": "Set the active tab in top level"
+				},
+				"description": {
+					"default": "Active tab in string format"
+				},
+				"place_holder_text": {
+					"default": ""
+				}
+			},
 			{
 				"parameter_ref": "disableWideFlyoutPrimaryButtonForPanelId",
 				"label": {
@@ -634,6 +651,21 @@
 					"actionCallback": "setStaticRows"
 				}
 			},
+			{
+				"id": "submit-active-tabs",
+				"label": {
+					"resource_key": "Submit"
+				},
+				"control": "button",
+				"button": {
+					"kind": "primary",
+					"size": "sm"
+				},
+				"data": {
+					"parameter_ref_data": "setActiveTab",
+					"actionCallback": "setActiveTabTopLevel"
+				}
+			},
 			{
 				"id": "submit-enable-wide-flyout-button",
 				"label": {
@@ -769,14 +801,28 @@
 							"staticRowsPropertyId",
 							"staticRowsIndexes"
 						]
-					},
+					},		
 					{
 						"id": "static-rows-panel",
 						"type": "actionPanel",
 						"action_refs": [
 							"submit-static-rows"
 						]
 					},
+					{
+						"id": "active-tab-controls",
+						"type": "controls",
+						"parameter_refs": [
+							"setActiveTab"
+						]
+					},
+					{
+						"id": "static-rows-panel",
+						"type": "actionPanel",
+						"action_refs": [
+							"submit-active-tabs"
+						]
+					},
 					{
 						"id": "wide-flyout-button-controls",
 						"type": "controls",

canvas_modules/harness/src/client/components/sidepanel/properties/sidepanel-properties.jsx

@@ -363,6 +363,7 @@ SidePanelProperties.propTypes = {
 		staticRowsPropertyId: PropTypes.string,
 		staticRowsIndexes: PropTypes.string,
 		setStaticRows: PropTypes.func, // action
+		setActiveTabTopLevel: PropTypes.func,
 		maxLengthForMultiLineControls: PropTypes.number,
 		maxLengthForSingleLineControls: PropTypes.number,
 		selectedPropertiesDropdownFile: PropTypes.string,