feat(orchestrator): a wizard step is skipped if both empty and set to 'hidden' (#1236)

Signed-off-by: Marek Libra <marek.libra@gmail.com>

Author: mareklibra

workspaces/orchestrator/.changeset/itchy-readers-swim.md

@@ -0,0 +1,5 @@
+---
+'@red-hat-developer-hub/backstage-plugin-orchestrator-form-react': patch
+---
+
+A wizard step is not rendered if it's properites are both empty and "ui:widget" is set to "hidden".

workspaces/orchestrator/plugins/orchestrator-form-react/report.api.md

@@ -10,7 +10,7 @@ import { OrchestratorFormContextProps } from '@red-hat-developer-hub/backstage-p
 import { default as React_2 } from 'react';
 
 // @public
-export const OrchestratorForm: ({ schema, updateSchema, handleExecute, isExecuting, initialFormData, isDataReadonly, setAuthTokenDescriptors, }: OrchestratorFormProps) => React_2.JSX.Element;
+export const OrchestratorForm: ({ schema: rawSchema, updateSchema, handleExecute, isExecuting, initialFormData, isDataReadonly, setAuthTokenDescriptors, }: OrchestratorFormProps) => React_2.JSX.Element;
 
 // @public
 export type OrchestratorFormProps = {

workspaces/orchestrator/plugins/orchestrator-form-react/src/components/OrchestratorForm.tsx

@@ -19,7 +19,9 @@ import React, { Fragment } from 'react';
 import { JsonObject } from '@backstage/types';
 
 import { UiSchema } from '@rjsf/utils';
-import type { JSONSchema7 } from 'json-schema';
+import type { JSONSchema7, JSONSchema7Definition } from 'json-schema';
+import cloneDeep from 'lodash/cloneDeep';
+import get from 'lodash/get';
 
 import { OrchestratorFormContextProps } from '@red-hat-developer-hub/backstage-plugin-orchestrator-form-api';
 
@@ -51,12 +53,54 @@ export type OrchestratorFormProps = {
   isDataReadonly?: boolean;
 };
 
+/**
+ * Remove hidden steps from the schema.
+ *
+ * A wizard step is removed when
+ *   "type": "object"
+ *   "ui:widget": "hidden"
+ *   and properties are empty ("properties": {})
+ *
+ * @param schema - The schema to remove hidden steps from.
+ * @returns The schema with hidden steps removed.
+ */
+const removeHiddenSteps = (schema: JSONSchema7): JSONSchema7 => {
+  if (typeof schema.properties === 'object') {
+    const hiddenSteps = Object.entries(schema.properties)
+      .map(([key, value]: [string, JSONSchema7Definition]) => {
+        const uiWidget = get(value, 'ui:widget');
+        if (
+          typeof value !== 'boolean' &&
+          value.type === 'object' &&
+          uiWidget === 'hidden' &&
+          value.properties &&
+          Object.keys(value.properties).length === 0
+        ) {
+          return key;
+        }
+        return undefined;
+      })
+      .filter(Boolean) as string[];
+
+    if (hiddenSteps.length > 0) {
+      const newSchema = cloneDeep(schema);
+      hiddenSteps.forEach(step => {
+        delete newSchema.properties?.[step];
+      });
+
+      return newSchema;
+    }
+  }
+
+  return schema;
+};
+
 /**
  * @public
  * The component contains the react-json-schema-form and serves as an extensible form. It allows loading a custom plugin decorator to override the default react-json-schema-form properties.
  */
 const OrchestratorForm = ({
-  schema,
+  schema: rawSchema,
   updateSchema,
   handleExecute,
   isExecuting,
@@ -69,6 +113,8 @@ const OrchestratorForm = ({
     initialFormData ? () => structuredClone(initialFormData) : {},
   );
 
+  const schema = React.useMemo(() => removeHiddenSteps(rawSchema), [rawSchema]);
+
   const numStepsInMultiStepSchema = React.useMemo(
     () => getNumSteps(schema),
     [schema],