/* eslint-disable no-console */
import { useState } from "react";
import { useBoolean } from "usehooks-ts";

import { UsageMasterpassBanner } from "@/components/widget/payment/usage-masterpass-banner/usage-masterpass-banner";
import { useCheckMasterpassAndUserQuery } from "@/services/masterpass/check-masterpass-and-user/check-masterpass-and-user.service";
import { useLinkCardToClientMutation } from "@/services/masterpass/link-card-to-client/link-card-to-client.service";
import { useListManagementMutation } from "@/services/masterpass/list-management/list-management.service";
import { useResendOtpMutation } from "@/services/masterpass/resend-otp/resend-otp.service";
import { useUpdateUserMutation } from "@/services/masterpass/update-user/update-user.service";
import { useValidateTransactionMutation } from "@/services/masterpass/validate-transaction/validate-transaction.service";
import { useMasterpassStore } from "@/store/masterpass-store/use-masterpass-store";

import { useMasterpass } from "../hooks/use-check-masterpass";
import { useMasterpassErrorModal } from "../hooks/use-masterpass-error-modal";
import { MasterpassErrorModal } from "./masterpass-error-modal";
import { MasterpassOtpModal } from "./masterpass-otp-modal";

interface MasterpassBannerProps {
  setPaymentMethod: (value: string) => void;
}

const MasterPassBanner = (props: MasterpassBannerProps) => {
  const showMasterPassBanner = useBoolean(false);
  const openOtp = useBoolean(false);
  const loading = useBoolean(true);
  const listManagementState = useBoolean(false);
  const linktoCardClientState = useBoolean(false);
  const { masterpassState, setMasterpassData } = useMasterpassStore();

  const [validateTransactionToken, setValidateTransactionToken] = useState("");
  const {
    CheckMasterpassAndUser,
    CheckListManagement,
    CheckUpdateUser,
    CheckListManagementCardStatus,
  } = useMasterpass();

  const {
    modalOpenMasterpassModal,
    openMasterpassErrorModal,
    closeMasterpassErrorModal,
    errorMessage,
    setErrorMessage,
  } = useMasterpassErrorModal();

  const updateUserServices = useUpdateUserMutation({
    onSuccess(data) {
      const errorCodes = ["1051", "1078", "1408", "6005"];
      if (errorCodes.includes(data.responseCode)) {
        openOtp.setFalse();
        setErrorMessage(data.responseDesc);
        openMasterpassErrorModal();
      } else if (data.responseCode) {
        const { showOtp } = CheckUpdateUser(data.responseCode);
        if (showOtp) {
          setValidateTransactionToken(data.token);
          loading.setFalse();
        }
      }
    },
  });
  const listManagementService = useListManagementMutation({
    onSuccess(data) {
      if (data.success) {
        const { updateUser } = CheckListManagement(data.responseCode);
        if (updateUser) {
          loading.setTrue();
          updateUserServices.mutate({
            token: masterpassState.data?.payload?.masterpassUserData.token!,
            msisdn: masterpassState.data?.payload.masterpassUserData.msisdn!,
            referenceNumber:
              masterpassState.data?.payload?.masterpassUserData
                .referenceNumber!,
            theNewValue:
              masterpassState.data?.payload?.masterpassUserData.userId!,
          });
        }
        if (data.cardList?.ListItem?.length > 0) {
          const cardList = CheckListManagementCardStatus(
            data.cardList.ListItem,
          );
          setMasterpassData({
            moduleName: "Hotel",
            payload: {
              ...masterpassState!.data!.payload,
              masterpassLoginState: true,
              cardList: cardList ?? [],
              selectedCard: cardList[0],
            },
          });
          openOtp.setFalse();
          props.setPaymentMethod("masterpass");
          loading.setFalse();
        }
      }
    },
  });
  const checkMasterpassData = useCheckMasterpassAndUserQuery(
    {
      token: masterpassState.data?.payload?.masterpassUserData?.token!,
      msisdn: masterpassState.data?.payload?.masterpassUserData?.msisdn!,
    },
    {
      onSuccess: (data) => {
        if (data.success) {
          const { showBanner, listManagement, linktoCardClient } =
            CheckMasterpassAndUser(data.accountStatus);
          if (showBanner) {
            showMasterPassBanner.setTrue();
          }
          if (listManagement) {
            listManagementState.setTrue();
          }
          if (linktoCardClient) {
            linktoCardClientState.setTrue();
          }
        }
      },
    },
  );
  const validateTransactionService = useValidateTransactionMutation({
    onSuccess(data) {
      if (data.success) {
        setTimeout(() => {
          listManagementService.mutate({
            referenceNo:
              masterpassState.data?.payload.masterpassUserData.referenceNumber!,
            token: masterpassState.data?.payload?.masterpassUserData.token!,
            msisdn: masterpassState.data?.payload?.masterpassUserData.msisdn!,
          });
        }, 10000);
      }
    },
  });

  const linktoCartToClientService = useLinkCardToClientMutation({
    onSuccess(data) {
      if (data.responseCode === "1051") {
        openOtp.setFalse();
        setErrorMessage(data.responseDesc);
        openMasterpassErrorModal();
      } else if (data.responseCode === "5001") {
        loading.setFalse();
        setValidateTransactionToken(data.token);
      }
    },
  });

  const resendOtpMutation = useResendOtpMutation({
    onSuccess: (data) => {
      if (data.success) {
        if (data.responseCode === "5001") {
          loading.setFalse();
          setValidateTransactionToken(data.token);
        }
      }
    },
  });

  return (
    <div>
      {checkMasterpassData.isSuccess && showMasterPassBanner.value && (
        <UsageMasterpassBanner
          phoneNumber={
            masterpassState.data?.payload?.masterpassUserData.msisdn!
          }
          onOk={() => {
            if (linktoCardClientState.value) {
              openOtp.setTrue();
              linktoCartToClientService.mutate({
                msisdn:
                  masterpassState.data?.payload?.masterpassUserData.msisdn!,
                token: masterpassState.data?.payload?.masterpassUserData.token!,
                referenceNo:
                  masterpassState.data?.payload?.masterpassUserData
                    .referenceNumber!,
              });
            } else if (listManagementState.value) {
              openOtp.setTrue();
              listManagementService.mutate({
                referenceNo:
                  masterpassState.data?.payload.masterpassUserData
                    .referenceNumber!,
                token: masterpassState.data?.payload?.masterpassUserData.token!,
                msisdn:
                  masterpassState.data?.payload?.masterpassUserData.msisdn!,
              });
            }
            showMasterPassBanner.setFalse();
          }}
          onCancel={() => showMasterPassBanner.setFalse()}
        />
      )}

      {openOtp.value && (
        <MasterpassOtpModal
          loading={loading.value}
          onResendButton={() => {
            loading.setTrue();
            resendOtpMutation.mutate({
              validationRefNo: validateTransactionToken,
            });
          }}
          setValidationCode={(value) => {
            loading.setTrue();
            validateTransactionService.mutate({
              validationRefNo: validateTransactionToken,
              userId: masterpassState.data?.payload?.masterpassUserData.msisdn!,
              referenceNo:
                masterpassState.data?.payload.masterpassUserData
                  .referenceNumber!,
              validationCode: value,
            });
          }}
        />
      )}
      {modalOpenMasterpassModal && (
        <MasterpassErrorModal
          modalState={modalOpenMasterpassModal}
          closeMasterpassErrorModal={() => closeMasterpassErrorModal()}
          message={errorMessage}
        />
      )}
    </div>
  );
};

export { MasterPassBanner };