Add download kubeconfig wizard page

Signed-off-by: Elay Aharoni <elayaha@gmail.com>

Author: ElayAharoni

libs/ui-lib/lib/ocm/components/clusterWizard/ClusterWizard.tsx

@@ -16,6 +16,7 @@ import {
   InfraEnv,
   InfraEnvUpdateParams,
 } from '@openshift-assisted/types/assisted-installer-service';
+import KubeconfigDownload from './KubeconfigDownload';
 
 type ClusterWizardProps = {
   cluster: Cluster;
@@ -44,6 +45,8 @@ const ClusterWizard = ({ cluster, infraEnv, updateInfraEnv }: ClusterWizardProps
       case 'static-ip-network-wide-configurations':
       case 'static-ip-yaml-view':
         return <StaticIp cluster={cluster} infraEnv={infraEnv} updateInfraEnv={updateInfraEnv} />;
+      case 'kubeconfig-download':
+        return <KubeconfigDownload cluster={cluster} />;
       case 'cluster-details':
       default:
         return <ClusterDetails cluster={cluster} infraEnv={infraEnv} />;

libs/ui-lib/lib/ocm/components/clusterWizard/ClusterWizardContextProvider.tsx

@@ -69,8 +69,7 @@ const getWizardStepIds = (
     stepsCopy = removeStepFromClusterWizard(stepsCopy, 'custom-manifests', 1);
   }
   if (isSingleClusterFeatureEnabled) {
-    // tentatively removed, proper waiting on support by backend
-    stepsCopy = removeStepFromClusterWizard(stepsCopy, 'operators', 1);
+    stepsCopy = addStepToClusterWizard(stepsCopy, 'networking', ['kubeconfig-download']);
   }
 
   return stepsCopy;

libs/ui-lib/lib/ocm/components/clusterWizard/KubeconfigDownload.tsx

@@ -0,0 +1,39 @@
+import React from 'react';
+import { ClusterWizardStep, ClusterWizardStepHeader } from '../../../common';
+import { useClusterWizardContext } from './ClusterWizardContext';
+import ClusterWizardFooter from './ClusterWizardFooter';
+import ClusterWizardNavigation from './ClusterWizardNavigation';
+import { WithErrorBoundary } from '../../../common/components/ErrorHandling/WithErrorBoundary';
+import { Cluster } from '@openshift-assisted/types/assisted-installer-service';
+import { Checkbox } from '@patternfly/react-core';
+
+const KubeconfigDownload: React.FC<{ cluster: Cluster }> = ({ cluster }) => {
+  const [isChecked, setIsChecked] = React.useState<boolean>(false);
+  const clusterWizardContext = useClusterWizardContext();
+
+  const footer = (
+    <ClusterWizardFooter
+      cluster={cluster}
+      onNext={() => clusterWizardContext.moveNext()}
+      onBack={() => clusterWizardContext.moveBack()}
+      isNextDisabled={!isChecked}
+      nextButtonText="Download Kubeconfig"
+    />
+  );
+
+  return (
+    <ClusterWizardStep navigation={<ClusterWizardNavigation cluster={cluster} />} footer={footer}>
+      <WithErrorBoundary title="Failed to load Kubeconfig Download step">
+        <ClusterWizardStepHeader>Download Kubeconfig</ClusterWizardStepHeader>
+        <Checkbox
+          id="Kubeconfig-download-agreement"
+          isChecked={isChecked}
+          onChange={() => setIsChecked(!isChecked)}
+          label="I understand that I need to download Kubeconfig file prior of proceeding with the cluster installation."
+        />
+      </WithErrorBoundary>
+    </ClusterWizardStep>
+  );
+};
+
+export default KubeconfigDownload;

libs/ui-lib/lib/ocm/components/clusterWizard/constants.ts

@@ -11,6 +11,7 @@ export const wizardStepNames: { [key in ClusterWizardStepsType]: string } = {
   networking: 'Networking',
   'custom-manifests': 'Custom manifests',
   review: 'Review and create',
+  'kubeconfig-download': 'Download Kubeconfig',
 };
 
 export const defaultWizardSteps: ClusterWizardStepsType[] = [

libs/ui-lib/lib/ocm/components/clusterWizard/wizardTransition.ts

@@ -28,7 +28,8 @@ export type ClusterWizardStepsType =
   | 'storage'
   | 'networking'
   | 'review'
-  | 'custom-manifests';
+  | 'custom-manifests'
+  | 'kubeconfig-download';
 
 const wizardStepsOrder: ClusterWizardStepsType[] = [
   'cluster-details',
@@ -40,6 +41,7 @@ const wizardStepsOrder: ClusterWizardStepsType[] = [
   'storage',
   'networking',
   'custom-manifests',
+  'kubeconfig-download',
   'review',
 ];
 
@@ -245,6 +247,8 @@ const reviewStepValidationsMap: WizardStepValidationMap = {
   softValidationIds: [],
 };
 
+const kubeconfigValidationMap = buildEmptyValidationsMap();
+
 const customManifestsValidationsMap = buildEmptyValidationsMap();
 
 export const wizardStepsValidationsMap: WizardStepsValidationMap<ClusterWizardStepsType> = {
@@ -258,6 +262,7 @@ export const wizardStepsValidationsMap: WizardStepsValidationMap<ClusterWizardSt
   storage: storageStepValidationsMap,
   networking: networkingStepValidationsMap,
   review: reviewStepValidationsMap,
+  'kubeconfig-download': kubeconfigValidationMap,
 };
 
 export const allClusterWizardSoftValidationIds =