diff --git a/src/components/layout/Stepper.js b/src/components/layout/Stepper.js index 879075a..dd9ac1f 100644 --- a/src/components/layout/Stepper.js +++ b/src/components/layout/Stepper.js @@ -1,4 +1,4 @@ -import React, { useState } from "react"; +import React, { useState, useEffect } from "react"; import steps from "../../constants/steps"; import { Card, @@ -21,13 +21,22 @@ const styles = () => ({ const useStyles = makeStyles(styles); const ApplicationStepper = () => { - const [activeStep, setActiveStep] = useState(0); + const firstStep = steps.find((z) => z.id === 0); + const [activeStep, setActiveStep] = useState(firstStep); const classes = useStyles(); const location = useLocation(); const history = useHistory(); + useEffect(() => { + const step = steps.find((z) => z.route === location.pathname); + if (step) { + setActiveStep(step); + } + }, [location.pathname]); + const handleStepClick = (step) => { if (!step) return; + setActiveStep(step); if (location.pathname === step.route) return; history.push(step.route); }; @@ -36,11 +45,11 @@ const ApplicationStepper = () => { - + {steps.map((step) => ( handleStepClick(step)} >