/* eslint-disable @typescript-eslint/no-explicit-any */
import React from "react";
import Swal from "sweetalert2";
import { Formik, Form, Field, ErrorMessage } from "formik";
import * as Yup from "yup";
import { forgotPassword } from "../../Api/CustomerApi";

interface ForgotModalProps {
  isSubmitting: boolean;
  setModalType: (type: string) => void;
}

const ForgotModal: React.FC<ForgotModalProps> = ({ setModalType }) => {
  const initialValues = { email: "" };

  const validationSchema = Yup.object().shape({
    email: Yup.string()
      .email("Invalid email format")
      .required("Email is required"),
  });

  const handleForgotPassword = async (
    values: { email: string },
    { setSubmitting }: any
  ) => {
    try {
      const response = await forgotPassword({ email: values.email });
      if (response.status) {
        Swal.fire({
          icon: "success",
          title: "Success",
          text: "Reset instructions sent to your email",
          customClass: {
            confirmButton: "delybell-primary px-4",
            cancelButton: 'delybell-dark'
          },
          // text: response.message || 'Your profile has been successfully updated.',
        });
      } else {
        Swal.fire({
          icon: "error",
          title: "Error!",
          text: response.message || "Something went wrong. Please try again.",
          customClass: {
            confirmButton: "delybell-primary px-4",
            cancelButton: 'delybell-dark'
          },
        });
      }
      // Swal.fire("Success", "Reset instructions sent to your email", "success");
      setSubmitting(false);
    } catch (error: any) {
      console.error("Forgot password error:", error);
      Swal.fire(
        "Error",
        error?.response?.data?.message || "Something went wrong",
        "error"
      );
      setSubmitting(false);
    }
  };

  return (
    <Formik
      initialValues={initialValues}
      validationSchema={validationSchema}
      onSubmit={handleForgotPassword}
    >
      {({ isSubmitting }) => (
        <Form>
          <p className="font-600 color-highlight mb-n1">Reset Your Account</p>
          <h1 className="font-30 pt-1">Forgot Password</h1>
          <p>
            Enter your email addresse below and we ll send you the reset
            instructions.
          </p>
          <div className="input-outer-box mb-3">
            <div className="input-style no-borders has-icon validate-field mb-0">
              <i className="fa fa-at" />
              <Field
                type="email"
                name="email"
                className="form-control validate-name"
                id="form1a"
                placeholder="Email"
              />
              <label
                htmlFor="form1a"
                className="color-highlight font-11 font-500"
              >
                Email
              </label>
              <em>(required)</em>
            </div>
            <ErrorMessage
              name="email"
              component="div"
              className="error-message"
            />
          </div>

          {/* Submit Button */}
          <button
            type="submit"
            className="btn btn-full btn-l font-600 font-13 gradient-highlight mt-4 rounded-s text-white w-100"
            disabled={isSubmitting}
          >
            {isSubmitting ? "Sending..." : "Send Reset Instructions"}
          </button>

          <div className="row pt-3 mb-3">
            <div className="col-6 text-start">
              <a
                href="#"
                onClick={() => setModalType("login")}
                className="color-highlight"
              >
                Sign In
              </a>
            </div>
            <div className="col-6 text-end">
              <a
                href="#"
                onClick={() => setModalType("register")}
                className="color-highlight"
              >
                Create Account
              </a>
            </div>
          </div>
        </Form>
      )}
    </Formik>
  );
};

export default ForgotModal;