import React, { useState } from 'react';
import ShareholderForm from './Sharetransferrequests';
import DocumentForm from './DocumentForm';
import "../Sharetransferrequests/sharetransferrequest.css"
/**
 * A multi-step form for capturing shareholder information and documents.
 * @returns {JSX.Element} The rendered component.
 */
const MultiStepForm = () => {
  const [step, setStep] = useState(1);
  // const [formData, setFormData] = useState({});

  const nextStep = () => {
    // setFormData({ ...formData, ...data });
    setStep(step + 1);
    // function logFormData(formData) {
    //   Array.from(formData.entries()).map(entry => {
    //   });
    // }
    // logFormData(formData)
  };

  const prevStep = () => {
    setStep(step - 1);
  };

  return (
    <div className='sharetransferrequest_container'>
      {step === 1 && <ShareholderForm next={nextStep} />}
      {step === 2 && <DocumentForm  prev={prevStep} />}
    </div>
  );
};

export default MultiStepForm;