me puedes dar un ejemplo porfas

[noble storm]

Custom Hook:

import { useState } from 'react';

const useSteps = (steps) => {
  const [currentStep, setCurrentStep] = useState(0);

  const handleNext = () => {
    if (currentStep < steps.length - 1) {
      setCurrentStep(currentStep + 1);
    }
  };

  const handlePrevious = () => {
    if (currentStep > 0) {
      setCurrentStep(currentStep - 1);
    }
  };

  return {
    currentStep,
    handleNext,
    handlePrevious,
    isNextDisabled: currentStep === steps.length - 1,
    isPreviousDisabled: currentStep === 0,
  };
};

export default useSteps;

Tu componente:

import Step1 from '../components/Step1';
import Step2 from '../components/Step2';
import Step3 from '../components/Step3';
import useSteps from '../hooks/useSteps';

const steps = [<Step1 />, <Step2 />, <Step3 />];

export default function StepsPage() {
  const { currentStep, handleNext, handlePrevious, isNextDisabled, isPreviousDisabled } = useSteps(steps);

  return (
    <div>
      {steps[currentStep]}
      <div>
        <button onClick={handlePrevious} disabled={isPreviousDisabled}>
          Anterior
        </button>
        <button onClick={handleNext} disabled={isNextDisabled}>
          Siguiente
        </button>
      </div>
    </div>
  );
}