(() => {
  const { EventManager, pageHelper, constants, utils } = ShopbySkin;

  const signInHelper = pageHelper.signInHelper();

  signInHelper.initialize({
    helperKey: 'sign-in-form',
  });

  const containerEl = document.querySelector('sign-in-form');
  const getFromUrl = () => {
    const searchParams = new URLSearchParams(location.search);

    const from = searchParams.get('from');

    const mainUrl = constants.PAGE.MAIN;

    return decodeURIComponent(from || mainUrl);
  };

  if (utils.getLocalStorage('OPEN_ID_DORMANT_CALLBACK')) {
    const openIdDormantInformation = JSON.parse(utils.getLocalStorage('OPEN_ID_DORMANT_CALLBACK') ?? '{}');

    EventManager.fire('OPEN_LAYER_MODAL', {
      name: 'dormant-sign-in',
      data: {
        ...openIdDormantInformation?.dormantMemberResponse,
        accessToken: openIdDormantInformation?.accessToken,
        expireIn: openIdDormantInformation?.expireIn,
      },
      onClose: ({ reason }) => {
        utils.removeLocalStorage('OPEN_ID_DORMANT_CALLBACK');

        if (reason === 'DID_SUBMIT') {
          utils.moveTo({
            url: getFromUrl(),
            replace: true,
          });

          return;
        }

        signInHelper.signOut();
      },
    });
  }

  const checkSignInValid = (params) => {
    if (!params || !params?.memberId) {
      return {
        field: 'memberId',
        message: '아이디를 입력하세요.',
      };
    }

    if (!params?.password) {
      return {
        field: 'password',
        message: '비밀번호를 입력하세요.',
      };
    }

    return {
      field: '',
      message: '',
    };
  };

  const showInvalidModal = (validResult) => {
    if (validResult.message) {
      EventManager.fire('MODAL_ALERT_OPEN', {
        noticeType: 'CAUTION',
        message: validResult.message,
        onClose: () => {
          utils.handleFocusEvent({ containerEl, fields: validResult.field });
        },
      });

      return false;
    }

    return true;
  };

  // eslint-disable-next-line complexity
  const handleSignInSubmit = async (params) => {
    const memberIdEl = containerEl.querySelector('input[slot="memberId"]');
    const passwordEl = containerEl.querySelector('input[slot="password"]');

    const memberId = params?.memberId ?? memberIdEl.value.trim();
    const password = params?.password ?? passwordEl.value.trim();

    const trackingKey = ShopbySkin.utils.getTrackingKey();

    const validationResult = checkSignInValid({ memberId, password });
    if (!showInvalidModal(validationResult)) {
      return;
    }

    const { data } = await signInHelper.signIn({
      payload: {
        requestBody: {
          memberId,
          password,
        },
        queryString: {
          ...(trackingKey && { trackingKey }),
        },
      },
    });

    const saveIdCheckedEl = containerEl.querySelector('input[slot="saveIdChecked"]');

    const saveIdChecked = params?.saveIdChecked ?? saveIdCheckedEl.checked;

    if (saveIdChecked) {
      utils.setLocalStorage('SAVE_MEMBER_ID', params.memberId);
    }

    if (data.dormantMemberResponse) {
      EventManager.fire('OPEN_LAYER_MODAL', {
        name: 'dormant-sign-in',
        data: data.dormantMemberResponse,
        onClose: ({ reason }) => {
          if (reason === 'DID_SUBMIT') {
            utils.moveTo({
              url: getFromUrl(),
              replace: true,
            });

            return;
          }

          signInHelper.signOut();
        },
      });

      return;
    }

    if (data.daysFromLastPasswordChange > 90) {
      const nextUrl = constants.PAGE.EXPIRED_PASSWORD_CHANGE_FORM;

      utils.moveTo({
        url: `${nextUrl}?from=${getFromUrl()}`,
        replace: true,
      });

      return;
    }

    utils.moveTo({
      url: getFromUrl(),
      replace: true,
    });
  };

  const clickEventListener = ({ target }) => {
    const action = target.getAttribute('shopby-action');

    if (action === 'SIGN_IN') {
      const { signInForm } = signInHelper.getState();

      handleSignInSubmit(signInForm);
    }
  };

  const keypressEventListener = ({ target, key }) => {
    const action = target.getAttribute('shopby-action');

    if (key === 'Enter' && action === 'PASSWORD_KEYPRESS') {
      const { signInForm } = signInHelper.getState();
      handleSignInSubmit({ memberId: signInForm.memberId, password: target.value.trim() });
    }
  };

  containerEl.addEventListener('click', clickEventListener);
  containerEl.addEventListener('keypress', keypressEventListener);

  EventManager.fire('MYAPP:PROXY_REGISTER', {
    proxyFnKey: 'signInFormProxy',
    applyProxy: (proxyFn) => {
      signInHelper.signIn = proxyFn(signInHelper.signIn);
    },
  });
})();