Reinitialize the values of the fields react-hook-form multi step

I’m am working on implementation of a multi step form with react-hook-form but I can’t do that input fields do get initialized with the form data when I return to the previous page.

I want the fields I filled out in that step to be saved when I go back to the previous step.

//EstudianteForm.jsx
function EstudianteForm() {
    const { register, handleSubmit, reset } = useForm();
    const [carrerasDisponibles, setCarrerasDisponibles] = useState([]);
    const { formData, nextStep, prevStep, updateEstudianteData } = useFormContext();

    useEffect(() => {
        const fetchCarreras = async () => {
            try {
                const response = await fetch('http://localhost:8000/carreras');
                if (!response.ok) {
                    throw new Error('Error al obtener las carreras');
                }
                const data = await response.json();
                setCarrerasDisponibles(data);
            } catch (error) {
                console.error('Error:', error);
            }
        };

        fetchCarreras();
    }, []);

    const onSubmit = handleSubmit(async (data) => {
        const estudianteData = {
            nombreEstudiante: data["nombreEstudiante"],
            telefono: data["telefono"],
            correo: data["email"],
            curso: data["curso"],
            carreraInteres: data["carreraInteres"],
            idEquipo: formData.EquipoData.idEquipo,
        };
        await updateEstudianteData(estudianteData);
        nextStep();
        reset();
    });


    return (
        <form onSubmit={onSubmit}>
            <div className='estudiante-form-container'>
                <label> Nombre del estudiante: </label>
                <input type="text" {...register("nombreEstudiante")} />
            </div>

            <div className='estudiante-form-container'>
                <label> Teléfono: </label>
                <input type="text" {...register("telefono")} />
            </div>

            <div className='estudiante-form-container'>
                <label> Correo electrónico: </label>
                <input type="email" {...register("email")} />
            </div>

            <div className='estudiante-form-container'>
                <label> Curso: </label>
                <select className="custom-select" {...register('curso')}>
                    <option value="">Seleccionar</option>
                    <option value="5">5to secundaria</option>
                    <option value="6">6to secundaria</option>
                </select>
            </div>

            <div className='estudiante-form-container'>
                <label> Carreras de interés: </label>
                <select multiple className="custom-select" {...register('carreraInteres')}>
                    <option value="">Seleccionar</option>
                    {carrerasDisponibles.map(carrera => (
                        <option key={carrera.idCarrera} value={carrera.idCarrera}>{carrera.nombre}</option>
                    ))}
                </select>
            </div>
            <div className='next-previouse-buttons'>
                <button type="button" className='previouse' onClick={prevStep}>Anterior</button>
                <button type="submit" >Siguiente</button>
            </div>
        </form>
    );
}

export default EstudianteForm;

import React, { createContext, useContext, useState } from "react";

const FormContext = createContext();

const useFormContext = () => useContext(FormContext);

const FormProvider = ({ children }) => {

    const [currentStep, setCurrentStep] = useState(0);
    const [formData, setFormData] = useState({
        EquipoData: {},
        EstudianteData: [],
    });

    const nextStep = () => setCurrentStep(currentStep + 1);
    const prevStep = () => setCurrentStep(currentStep - 1);

    const updateEquipoData = (data) => {
        setFormData({ ...formData, EquipoData: data });
    };
    const updateEstudianteData = (data) => {
        setFormData({ ...formData, EstudianteData: [...formData.EstudianteData, data] });
    };


    return (
        <FormContext.Provider value={{
            formData,
            updateEstudianteData,
            updateEquipoData,
            currentStep,
            nextStep,
            prevStep,
        }}>
            {children}
        </FormContext.Provider>
    );
};

export { FormProvider, useFormContext };    

I want the fields I filled out in that step to be saved when I go back to the previous step.