import { Col, Row } from "reactstrap";
import ValidationField from "../../../../Components/ValidationField/ValidationField";
import { useFormikContext } from "formik";
import { useModalState } from "../../../../zustand/Modal";
import { useEffect } from "react";
import { Payments } from "../../../../types/App";
const Form = () => {
  const formik = useFormikContext();
  const { isOpen } = useModalState((state) => state);

  useEffect(() => {
    if (isOpen === "") {
      formik.setErrors({});
      // formik.resetForm();
    }
    if (isOpen === "isSuccess") {
      formik.setErrors({});
      formik.resetForm();
    }
  }, [isOpen]);
  // console.log(registration_record,"registration_record");

  return (
    <Row className="w-100">
      <Col>
        <ValidationField placeholder="details" label="details" name="details" />

        <ValidationField
          placeholder="date"
          label="date"
          type="Date"
          name="date"
        />
        <ValidationField
          placeholder="receipt_number"
          label="receipt_number"
          name="receipt_number"
        />
      </Col>

      <Col>
        <ValidationField
          placeholder="payment_type"
          label="payment_type"
          type="Select"
          option={Payments}
          name="type"
        />

        <ValidationField
          placeholder="value"
          label="value"
          type="NumberFormate"
          name="value"
        />
      </Col>
    </Row>
  );
};

export default Form;
