Merge pull request #787 from Piumal1999/APIM-3199

Fix step indicators of Create API forms
wso2 · Oct 9, 2024 · e08c197 · e08c197
2 parents e525959 + 5ead1cc
commit e08c197
Show file tree

Hide file tree

Showing 5 changed files with 28 additions and 63 deletions.
diff --git a/.../publisher/src/main/webapp/source/src/app/components/Apis/Create/AIAPI/APICreateAIAPI.jsx b/.../publisher/src/main/webapp/source/src/app/components/Apis/Create/AIAPI/APICreateAIAPI.jsx
@@ -202,7 +202,7 @@ export default function ApiCreateAIAPI(props) {
             )}
         >
             <Box sx={{ mb: 2 }}>
-                <Stepper alternativeLabel activeStep={0}>
+                <Stepper alternativeLabel activeStep={wizardStep}>
                     <Step>
                         <StepLabel>
                             <FormattedMessage

diff --git a/.../main/webapp/source/src/app/components/Apis/Create/APIProduct/APIProductCreateWrapper.jsx b/.../main/webapp/source/src/app/components/Apis/Create/APIProduct/APIProductCreateWrapper.jsx
@@ -360,25 +360,13 @@ export default function ApiProductCreateWrapper(props) {
             title={pageTitle}
         >
             <Box sx={{ mb: 3 }}>
-                {wizardStep === 0 && (
-                    <Stepper alternativeLabel activeStep={0}>
-                        {steps.map((label) => (
-                            <Step key={label}>
-                                <StepLabel className={classes.alternativeLabel}>{label}</StepLabel>
-                            </Step>
-                        ))}
-
-                    </Stepper>
-                )}
-                {wizardStep === 1 && (
-                    <Stepper alternativeLabel activeStep={1}>
-                        {steps.map((label) => (
-                            <Step key={label}>
-                                <StepLabel>{label}</StepLabel>
-                            </Step>
-                        ))}
-                    </Stepper>
-                )}
+                <Stepper alternativeLabel activeStep={wizardStep}>
+                    {steps.map((label) => (
+                        <Step key={label}>
+                            <StepLabel className={classes.alternativeLabel}>{label}</StepLabel>
+                        </Step>
+                    ))}
+                </Stepper>
             </Box>
             <Grid container>
                 <Grid item md={12}>

diff --git a/...sher/src/main/webapp/source/src/app/components/Apis/Create/AsyncAPI/ApiCreateAsyncAPI.jsx b/...sher/src/main/webapp/source/src/app/components/Apis/Create/AsyncAPI/ApiCreateAsyncAPI.jsx
@@ -316,7 +316,7 @@ export default function ApiCreateAsyncAPI(props) {
             )}
         >
             <Box sx={{ mb: 2 }}>
-                <Stepper alternativeLabel activeStep={0}>
+                <Stepper alternativeLabel activeStep={wizardStep}>
                     <Step>
                         <StepLabel>
                             <FormattedMessage

diff --git a/...lisher/src/main/webapp/source/src/app/components/Apis/Create/GraphQL/ApiCreateGraphQL.jsx b/...lisher/src/main/webapp/source/src/app/components/Apis/Create/GraphQL/ApiCreateGraphQL.jsx
@@ -235,48 +235,25 @@ export default function ApiCreateGraphQL(props) {
             )}
         >
             <Box sx={{ mb: 2 }}>
-                {wizardStep === 0 && (
-                    <Stepper alternativeLabel activeStep={0}>
-                        <Step>
-                            <StepLabel>
-                                <FormattedMessage
-                                    id='Apis.Create.GraphQL.ApiCreateGraphQL.wizard.one'
-                                    defaultMessage='Provide GraphQL'
-                                />
-                            </StepLabel>
-                        </Step>
+                <Stepper alternativeLabel activeStep={wizardStep}>
+                    <Step>
+                        <StepLabel>
+                            <FormattedMessage
+                                id='Apis.Create.GraphQL.ApiCreateGraphQL.wizard.one'
+                                defaultMessage='Provide GraphQL'
+                            />
+                        </StepLabel>
+                    </Step>
 
-                        <Step>
-                            <StepLabel>
-                                <FormattedMessage
-                                    id='Apis.Create.GraphQL.ApiCreateGraphQL.wizard.two'
-                                    defaultMessage='Create API'
-                                />
-                            </StepLabel>
-                        </Step>
-                    </Stepper>
-                )}
-                {wizardStep === 1 && (
-                    <Stepper alternativeLabel activeStep={1}>
-                        <Step>
-                            <StepLabel>
-                                <FormattedMessage
-                                    id='Apis.Create.GraphQL.ApiCreateGraphQL.wizard.one'
-                                    defaultMessage='Provide GraphQL'
-                                />
-                            </StepLabel>
-                        </Step>
-
-                        <Step>
-                            <StepLabel>
-                                <FormattedMessage
-                                    id='Apis.Create.GraphQL.ApiCreateGraphQL.wizard.two'
-                                    defaultMessage='Create API'
-                                />
-                            </StepLabel>
-                        </Step>
-                    </Stepper>
-                )}
+                    <Step>
+                        <StepLabel>
+                            <FormattedMessage
+                                id='Apis.Create.GraphQL.ApiCreateGraphQL.wizard.two'
+                                defaultMessage='Create API'
+                            />
+                        </StepLabel>
+                    </Step>
+                </Stepper>
             </Box>
 
             <Grid container spacing={2}>

diff --git a/...lisher/src/main/webapp/source/src/app/components/Apis/Create/OpenAPI/ApiCreateOpenAPI.jsx b/...lisher/src/main/webapp/source/src/app/components/Apis/Create/OpenAPI/ApiCreateOpenAPI.jsx
@@ -196,7 +196,7 @@ export default function ApiCreateOpenAPI(props) {
             )}
         >
             <Box sx={{ mb: 2 }}>
-                <Stepper alternativeLabel activeStep={0}>
+                <Stepper alternativeLabel activeStep={wizardStep}>
                     <Step>
                         <StepLabel>
                             <FormattedMessage