From 86172fa4d8d2d1772d9a76b8f10267c2cb03afa5 Mon Sep 17 00:00:00 2001
From: YanJin <yanjin.cheng@scality.com>
Date: Tue, 21 Nov 2023 18:25:30 +0100
Subject: [PATCH] stepper: group stepnumber and stepProps

---
 .../components/steppers/Stepper.component.tsx   | 17 +++++++++--------
 1 file changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/lib/components/steppers/Stepper.component.tsx b/src/lib/components/steppers/Stepper.component.tsx
index f2a433e72b..8a8744dcae 100644
--- a/src/lib/components/steppers/Stepper.component.tsx
+++ b/src/lib/components/steppers/Stepper.component.tsx
@@ -55,26 +55,27 @@ export const Stepper = <T extends any[]>({
 }: {
   steps: readonly [...Steps<T>];
 }) => {
-  const [currentStep, setCurrentStep] = useState<number>(0);
-  const [stepProps, setStepProps] = useState<Record<string, unknown>>({});
+  // const [currentStep, setCurrentStep] = useState<number>(0);
+  const [stepProps, setStepProps] = useState<{
+    step: number;
+    props: Record<string, unknown>;
+  }>({ step: 0, props: {} });
 
   const next = (props: Record<string, unknown>) => {
-    setCurrentStep(currentStep + 1);
-    setStepProps(props);
+    setStepProps({ step: stepProps.step + 1, props });
   };
 
   const prev = (props: Record<string, unknown>) => {
-    setCurrentStep(currentStep - 1);
-    setStepProps(props);
+    setStepProps({ step: stepProps.step - 1, props });
   };
 
-  const { Component } = steps[currentStep];
+  const { Component } = steps[stepProps.step];
 
   return (
     <window.StepperContext.Provider value={{ next, prev }}>
       <Box display={'flex'} gap={32} padding={16} flex={1}>
         <Steppers
-          activeStep={currentStep}
+          activeStep={stepProps.step}
           steps={steps.map((step) => {
             return {
               title: step.label,