From f0da1baa199b49c7f1ca4846c226b639a604ea31 Mon Sep 17 00:00:00 2001
From: RadoslavDimchev <RadoslavDimchev111@gmail.com>
Date: Thu, 24 Aug 2023 10:49:18 +0300
Subject: [PATCH] feat: remove state and get it from parent

---
 src/pages/ValidatorOnboarding/FormStepper.tsx | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/pages/ValidatorOnboarding/FormStepper.tsx b/src/pages/ValidatorOnboarding/FormStepper.tsx
index 294f0fc4..b4e0bef1 100644
--- a/src/pages/ValidatorOnboarding/FormStepper.tsx
+++ b/src/pages/ValidatorOnboarding/FormStepper.tsx
@@ -1,10 +1,12 @@
-import { useState } from 'react'
 import { Stepper, Step } from 'react-form-stepper'
 import './FormStepper.css'
 
-const FormStepper = () => {
-  const [activeStep, setActiveStep] = useState<number>(0)
+type FormStepperProps = {
+  activeStep: number
+  changeActiveStep: (step: number) => void
+}
 
+const FormStepper = ({ activeStep, changeActiveStep }: FormStepperProps) => {
   return (
     <Stepper
       activeStep={activeStep}
@@ -16,31 +18,31 @@ const FormStepper = () => {
       <Step
         className="custom-step"
         label={'Overview'}
-        onClick={() => setActiveStep(0)}
+        onClick={() => changeActiveStep(0)}
         completed={activeStep >= 0}
       />
       <Step
         className="custom-step"
         label="Advicsories"
-        onClick={() => setActiveStep(1)}
+        onClick={() => changeActiveStep(1)}
         completed={activeStep > 0}
       />
       <Step
         label="Validator Setup"
         className="custom-step"
-        onClick={() => setActiveStep(2)}
+        onClick={() => changeActiveStep(2)}
         completed={activeStep > 1}
       />
       <Step
         label="Key Generation"
         className="custom-step"
-        onClick={() => setActiveStep(3)}
+        onClick={() => changeActiveStep(3)}
         completed={activeStep > 2}
       />
       <Step
         label="Activation"
         className="custom-step"
-        onClick={() => setActiveStep(4)}
+        onClick={() => changeActiveStep(4)}
         completed={activeStep > 3}
       />
     </Stepper>