import { useEffect } from "react";
import { Modal } from "react-bootstrap";
import "./Success_Modal.css";
import Green_Check_Lottie from "../../../Animation/green_check_lottie/Green_Check_Lottie";

const Success_Modal = ({ show, onHide, successText, ...props }) => {
  useEffect(() => {
    if (!show) return;

    const timer = setTimeout(() => {
      onHide?.();
    }, 3000);

    return () => clearTimeout(timer);
  }, [show, onHide]);

  return (
    <Modal
      className="Success_Modal"
      size="md"
      show={show}
      onHide={onHide}
      centered
      {...props}
    >
      <div className="lottie-wrapper">
        <div className="animation_holder">
          <Green_Check_Lottie />
        </div>
      </div>

      <Modal.Body>
        <p className="success_text">{successText}</p>
      </Modal.Body>
    </Modal>
  );
};

export default Success_Modal;
