resolve breadcrumb confl

dashboard/src/components/Breadcrumb.tsx

@@ -1,28 +1,28 @@
 import { Steps } from "main/home/onboarding/types";
-import React, { useState } from "react";
+import React, { Fragment, useState } from "react";
 
 import styled from "styled-components";
 
 type Props = {
   currentStep: string;
-  steps: { value: string, label: string }[];
-  onClickStep?: (step: string) => void;
+  steps: { value: string; label: string }[];
+  onClickStep: (step: string) => void;
 };
 
 const Breadcrumb: React.FC<Props> = ({ currentStep, steps, onClickStep }) => {
   return (
     <StyledBreadcrumb>
-      {steps.map((step: { value: string, label: string }, i: number) => {
+      {steps.map((step: { value: string; label: string }, i: number) => {
         return (
-          <>
-          <Crumb
-            bold={currentStep === step.value}
-            onClick={() => onClickStep && onClickStep(step.value)}
-          >
-            {step.label}
-          </Crumb>
-          {i !== steps.length - 1 && " > "}
-          </>
+          <Fragment key={i}>
+            <Crumb
+              bold={currentStep === step.value}
+              onClick={() => onClickStep && onClickStep(step.value)}
+            >
+              {step.label}
+            </Crumb>
+            {i !== steps.length - 1 && " > "}
+          </Fragment>
         );
       })}
     </StyledBreadcrumb>
@@ -39,4 +39,4 @@ const Crumb = styled.span<{ bold: boolean }>`
   font-weight: ${props => props.bold ? "600" : "normal"};
   color: ${props => props.bold ? "#ffffff" : "#aaaabb"};
   font-size: 13px;
-`;
+`;

dashboard/src/main/home/onboarding/state/index.ts

@@ -121,9 +121,9 @@ const decompressState = (prev_state: any) => {
 
   let provision: any = {
     skip: state.skip_resource_provision,
-    provider: state.resource_provision_provider,
+    provider: state.cluster_infra_provider,
     credentials: {
-      id: state.resource_provision_credentials_id,
+      id: state.cluster_infra_credential_id,
     },
     settings: {
       cluster_name: state.resource_provision_settings_cluster_name,

dashboard/src/main/home/onboarding/steps/ProvisionResources/ProvisionResources.tsx

@@ -57,6 +57,7 @@ const ProvisionResources: React.FC<Props> = ({
               onSaveCredentials={onSaveCredentials}
               onSaveSettings={onSaveSettings}
               project={project}
+              goBack={goBack}
             />
           </>
         );

dashboard/src/main/home/onboarding/steps/ProvisionResources/ProvisionResourcesWrapper.tsx

@@ -21,7 +21,7 @@ const ProvisionResourcesWrapper = () => {
       onSaveSettings={(data) => OFState.actions.nextStep("continue", data)}
       onSuccess={() => OFState.actions.nextStep("continue")}
       onSkip={() => OFState.actions.nextStep("skip")}
-      enable_go_back={snap.StepHandler.canGoBack}
+      enable_go_back={snap.StepHandler.canGoBack && !snap.StepHandler.isSubFlow}
       goBack={() => OFState.actions.nextStep("go_back")}
     />
   );

dashboard/src/main/home/onboarding/steps/ProvisionResources/forms/FormFlow.tsx

@@ -62,6 +62,7 @@ type Props = {
   provider: SupportedProviders | "external";
   currentStep: "credentials" | "settings";
   project: { id: number; name: string };
+  goBack: () => void;
 };
 
 const FormFlowWrapper: React.FC<Props> = ({
@@ -70,6 +71,7 @@ const FormFlowWrapper: React.FC<Props> = ({
   provider,
   currentStep,
   project,
+  goBack,
 }) => {
   const nextFormStep = (
     data?: Partial<Exclude<ProvisionerConfig, SkipProvisionConfig>>
@@ -103,7 +105,7 @@ const FormFlowWrapper: React.FC<Props> = ({
   return (
     <FormWrapper>
       <FormHeader>
-        <CloseButton onClick={() => alert("go back")}>
+        <CloseButton onClick={() => goBack()}>
           <i className="material-icons">keyboard_backspace</i>
         </CloseButton>
         {FormTitle[provider] && <img src={FormTitle[provider].icon} />}