function isMobileDevice() {
  return /Mobi|Android|iPhone|iPad|iPod/i.test(navigator.userAgent);
}

/* window.addEventListener('load', function () {
  const cookieExists = document.cookie.includes('extra_metadata');
  if (!cookieExists && !isMobileDevice()) {
    google.accounts.id.prompt();
  }
}); */

// START Apple ID Auth
AppleID.auth.init({
  clientId: 'com.epro.web',
  scope: 'name email',
  redirectURI: 'https://essayservice.com/apple-signin',
  state: 'init',
  nonce: '9b1deb4d-3b7d-4bad-9baw-2b0d7b3dcb6d',
  usePopup: true,
});

let accessTokenApple;
function signInWithApple() {
  AppleID.auth
    .signIn()
    .then((response) => {
      accessTokenApple = response.authorization.id_token;
      sendAppleRequest(accessTokenApple, false);
    })
    .catch((error) => {
      console.error('Sign in with Apple failed:', error);
    });

  userMethodRegisterEvent('click_apple_icon');
}

document.querySelectorAll('.js-apple-login-btn').forEach((button) => {
  button.addEventListener('click', signInWithApple);
});

// END Apple ID

// START FB Auth
window.fbAsyncInit = function () {
  FB.init({
    appId: '1710223702565893',
    cookie: true,
    xfbml: true,
    version: 'v14.0',
  });

  FB.AppEvents.logPageView();
};

(function (d, s, id) {
  var js,
    fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) {
    return;
  }
  js = d.createElement(s);
  js.id = id;
  js.src = 'https://connect.facebook.net/en_US/sdk.js';
  fjs.parentNode.insertBefore(js, fjs);
})(document, 'script', 'facebook-jssdk');

let accessTokenFb;
// Event handler for 'Login with Facebook' button click
document.querySelectorAll('.js-fb-login-btn').forEach((button) => {
  button.addEventListener('click', function () {
    FB.login(
      function (response) {
        if (response.status === 'connected') {
          accessTokenFb = response.authResponse.accessToken;
          sendFbRequest(false);
        } else {
          console.log('User cancelled login or did not fully authorize.');
        }
      },
      { scope: 'public_profile,email' }
    );

    userMethodRegisterEvent('click_facebook_icon');
  });
});
// END FB Auth

// START Google Auth render buttons
let googleBtnWidth;

function renderGoogleButton(index) {
  const buttonElement = document.getElementById(`googleBtnRender${index}`);
  const buttonWrap = document.getElementById(`googleBtnWrap${index}`);

  googleBtnWidth = buttonWrap?.offsetWidth || googleBtnWidth;

  google.accounts.id.renderButton(buttonElement, {
    theme: 'filled_black',
    size: 'large',
    width: googleBtnWidth,
    text: 'continue_with',
    click_listener: onGoogleClickHandler,
  });
}

document.querySelectorAll('.auth-form__tabs__link.w-tab-link').forEach((tabLink) => {
  tabLink.addEventListener('click', (event) => {
    const lastChar = event.target.id.slice(-1);
    renderGoogleButton(lastChar);
  });
});
// END Google Auth render buttons

let loginToken = '';

if (getCookie('accessToken')) {
  fetchUserData().then(() => {
    const storedData = localStorage.getItem('currentUser');
    if (storedData) {
      const user = JSON.parse(storedData);

      if (user.state === 'unverified') {
        toggleIsActive('auth-form', true);
        toggleIsActive('initial-state', false);
        toggleIsActive('auth-form-social', false);
        toggleIsActive('confirm-state', true);
        document.getElementById('confirm-email').textContent = user.email;
      }
    }
  });
}

// START GENERAL FUNCTIONS

// facebook api request
function sendFbRequest(activateValue) {
  fetch('https://app.essayservice.com/api/social/auth/signin/facebook/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      access_token: accessTokenFb,
      activate: activateValue,
      client_id: 'pgnfidgwuKhlfrh4jRuIirRpvteChDGnga9I4hmj',
      is_test: false,
      role: 'customer',
      site: 'app.essayservice.com',
      is_premium_blog_user: true,
    }),
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      if (data.is_sms_otp_allow) {
        showTwoFactorStep();
        loginToken = data.token;
      } else if (!data.error_map) {
        setCookie({ name: 'accessToken', value: data.access_token, domain: '.essayservice.com' });
        setCookie({ name: 'refreshToken', value: data.refresh_token, domain: '.essayservice.com' });
        if (data.is_new) {
          setCookie({ name: 'new_user', value: 'true', domain: '.essayservice.com' });
        }
        fetchUserData().then((userData) => {
          if (userData.new_user) {
            userSignUpEvent(userData.id, 'facebook');
          } else {
            userLoginEvent(userData.id, 'facebook');
          }
          if (!userData.allow_unverified_user && userData.state === 'unverified') {
            showConfirmEmailStep(userData.email);
          } else {
            window.location.href = 'https://app.essayservice.com/';
          }
        });
      } else {
        showCodeErrorStep(data.code, 'facebook');
      }
    })
    .catch((error) => console.error('Error:', error));
}

// apple api request
function sendAppleRequest(token, activateValue) {
  fetch('https://app.essayservice.com/api/social/auth/signin/apple-id/', {
    method: 'POST',
    body: JSON.stringify({
      access_token: token,
      client_id: 'pgnfidgwuKhlfrh4jRuIirRpvteChDGnga9I4hmj',
      role: 'customer',
      activate: activateValue,
      is_premium_blog_user: true,
    }),
    headers: {
      'Content-Type': 'application/json',
    },
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      if (data.is_sms_otp_allow) {
        showTwoFactorStep();
        loginToken = data.token;
      } else if (!data.error_map) {
        setCookie({ name: 'accessToken', value: data.access_token, domain: '.essayservice.com' });
        setCookie({ name: 'refreshToken', value: data.refresh_token, domain: '.essayservice.com' });
        if (data.is_new) {
          setCookie({ name: 'new_user', value: 'true', domain: '.essayservice.com' });
        }
        fetchUserData().then((userData) => {
          if (userData.new_user) {
            userSignUpEvent(userData.id, 'apple-id');
          } else {
            userLoginEvent(userData.id, 'apple-id');
          }
          if (!userData.allow_unverified_user && userData.state === 'unverified') {
            showConfirmEmailStep(userData.email);
          } else {
            window.location.href = 'https://app.essayservice.com/';
          }
        });
      } else {
        showCodeErrorStep(data.code, 'apple');
      }
    })
    .catch((error) => {
      console.error('Error during login', error);
    });
}

// get initial user data
function fetchUserData() {
  const accessToken = getCookie('accessToken');

  return fetch('https://app.essayservice.com/api/auth/user/', {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${accessToken}`,
    },
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      if (data.error_map) {
        localStorage.removeItem('currentUser');
      } else {
        localStorage.setItem('currentUser', JSON.stringify(data));
      }
      return data;
    })
    .catch((error) => {
      console.error('Error:', error);
    });
}

// get Cookie function
function getCookie(name) {
  const value = `; ${document.cookie}`;
  const parts = value.split(`; ${name}=`);
  if (parts.length === 2) return parts.pop().split(';').shift();
}

// set Cookie function
function setCookie({ name, value, domain }) {
  document.cookie = name + '=' + encodeURIComponent(value) + '; domain=' + domain + '; path=/';
}

// Function to toggle 'is-active' class
function toggleIsActive(id, add = true) {
  const element = document.getElementById(id);
  if (add) {
    element.classList.add('is-active');
  } else {
    element.classList.remove('is-active');
  }
}

// Function to switch tabs
function switchTab(tabIndex) {
  document.querySelectorAll('.auth-form__tabs__link.w-tab-link')[tabIndex].click();
  setTimeout(() => {
    renderGoogleButton(tabIndex);
  }, 100);
}

// Function to validate email
function isValidEmail(email) {
  const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
  return emailPattern.test(email);
}

// Function to handle form errors
function handleFormError(inputWrap, errorText, message) {
  inputWrap.classList.add('is-error');
  if (message === 'Incorrect credentials') {
    errorText.textContent = 'Invalid email address or password. Try again';
  } else {
    errorText.textContent = message;
  }
}

// Function to clear form errors
function clearFormError(inputWrap, errorText) {
  inputWrap.classList.remove('is-error');
  errorText.textContent = '';
}

// Universal function to handle API response
function handleApiResponse(data, emailInputWrap, passwordInputWrap, passErrorText, emailErrorText) {
  if (data.is_sms_otp_allow) {
    showTwoFactorStep();
    loginToken = data.token;
  } else if (!data.error_map) {
    if (!data.allow_unverified_user && data.state === 'unverified') {
      showConfirmEmailStep(data.email);
    } else {
      window.location.href = 'https://app.essayservice.com/';
    }
  } else {
    let message = '';
    if (typeof data.message === 'object' && data.message !== null) {
      message = data.message.email || '';
    } else {
      message = data.message;
    }

    if (message[0].includes('Email')) {
      handleFormError(emailInputWrap, emailErrorText, message);
      handleFormError(passwordInputWrap, passErrorText, '');
    } else if (message.includes('WriterPro')) {
      document.getElementById('auth-modal-error').style.display = 'block';
      setTimeout(() => {
        document.getElementById('auth-modal-error').style.display = 'none';
      }, 5000);
      document.getElementById('auth-modal-error').textContent = message;
    } else {
      handleFormError(emailInputWrap, emailErrorText, '');
      handleFormError(passwordInputWrap, passErrorText, message);
    }
    showCodeErrorStep(data.code, 'email');
  }
}

// Function when api response with two-factor authentication
function showTwoFactorStep() {
  toggleIsActive('initial-state', false);
  toggleIsActive('auth-form-social', false);
  toggleIsActive('code-state', true);
}

// Function when api response with confirm email
function showConfirmEmailStep(email) {
  document.getElementById('confirm-email').textContent = email;
  toggleIsActive('initial-state', false);
  toggleIsActive('auth-form-social', false);
  toggleIsActive('confirm-state', true);
}

// Function when api response with code error
function showCodeErrorStep(codeStatus, authType) {
  if (codeStatus === 'DEACTIVATED_USER_ERROR') {
    if (authType === 'facebook') {
      toggleIsActive('reactivate-yes', false);
      toggleIsActive('reactivate-yes-fb', true);
    } else if (authType === 'apple') {
      toggleIsActive('reactivate-yes', false);
      toggleIsActive('reactivate-yes-apple', true);
    }
    toggleIsActive('reactivate-popup', true);
  } else if (codeStatus === 'LOCKED_USER_ERROR') {
    toggleIsActive('locked-popup', true);
  }
}

// Function to validate form input
function validateForm(
  email,
  password,
  emailInputWrap,
  emailErrorText,
  passwordInputWrap,
  passErrorText
) {
  let isValid = true;

  if (emailInputWrap && emailErrorText) {
    clearFormError(emailInputWrap, emailErrorText);

    if (!email) {
      handleFormError(emailInputWrap, emailErrorText, 'Email is required');
      isValid = false;
    } else if (!isValidEmail(email)) {
      handleFormError(emailInputWrap, emailErrorText, 'Invalid email address');
      isValid = false;
    }
  }

  if (passwordInputWrap && passErrorText) {
    clearFormError(passwordInputWrap, passErrorText);

    if (!password) {
      handleFormError(passwordInputWrap, passErrorText, 'Password is required');
      isValid = false;
    } else if (password.length < 6) {
      handleFormError(
        passwordInputWrap,
        passErrorText,
        'Password must be at least 6 characters long'
      );
      isValid = false;
    }
  }

  return isValid;
}

// Toggle password visibility
document.querySelectorAll('.js-toggle-password').forEach((icon) => {
  icon.addEventListener('click', function () {
    const parent = this.closest('.auth-form__input-wrap-upd');
    const passwordInput = parent.querySelector('input');
    const passwordHideIcon = parent.querySelector('.auth-form__input-hide-pass');
    const passwordShowIcon = parent.querySelector('.auth-form__input-show-pass');

    const isPassword = passwordInput.type === 'password';
    passwordInput.type = isPassword ? 'text' : 'password';
    passwordHideIcon.classList.toggle('hide', !isPassword);
    passwordShowIcon.classList.toggle('hide', isPassword);
  });
});

// Event handler for switching to forgot password
document.getElementById('forgot-password-btn').addEventListener('click', function () {
  toggleIsActive('initial-state', false);
  toggleIsActive('auth-form-social', false);
  toggleIsActive('forgot-state', true);
});

// Returning from forgot password
document.querySelectorAll('.js-forgot-back').forEach((btn) => {
  btn.addEventListener('click', function () {
    toggleIsActive('forgot-state', false);
    toggleIsActive('initial-state', true);
    toggleIsActive('auth-form-social', true);
    toggleIsActive('forgot-success-block', false);
    document.getElementById('email-form-forgot').classList.remove('is-hide');
    document.querySelector('.js-email-for-reset').textContent = '';
    document.getElementById('forgot-email').value = '';
  });
});

// show email auth state
document.querySelectorAll('.js-start-email-btn').forEach((button) => {
  button.addEventListener('click', () => {
    document.querySelectorAll('.js-auth-email-step').forEach((step) => {
      step.classList.remove('is-hide');
    });
    document.querySelectorAll('.js-google-icon').forEach((btn) => {
      btn.classList.remove('is-hide');
    });
    document.querySelectorAll('.js-auth-start-state').forEach((state) => {
      state.classList.add('is-hide');
    });

    userMethodRegisterEvent('click_with_email_icon');
  });
});

// show/hide loader on btn
function toggleLoader(button, isLoading) {
  if (isLoading) {
    button.classList.add('is-loading');
  } else {
    button.classList.remove('is-loading');
  }
}
// END GENERAL FUNCTIONS

// START reactivate logic
// Event handler for 'Reactivate No' button click
document
  .getElementById('reactivate-no')
  .addEventListener('click', () => toggleIsActive('reactivate-popup', false));

// Event handler for 'Contact Help' button click
document.getElementById('contact-help-btn').addEventListener('click', () => {
  Intercom('show');
  toggleIsActive('locked-popup', false);
});

// Event handler for 'Reactivate Yes' button click
document.getElementById('reactivate-yes').addEventListener('click', function () {
  const email = document.getElementById('signin-email').value;
  const password = document.getElementById('signin-password').value;
  const emailInputWrap = document.getElementById('signin-email-input-wrap');
  const emailErrorText = document.getElementById('signin-email-input-error');
  const passwordInputWrap = document.getElementById('signin-pass-input-wrap');
  const passErrorText = document.getElementById('signin-pass-input-error');

  fetch('https://app.essayservice.com/api/auth/signin/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      activate: true,
      remember_me: true,
      email: email,
      password: password,
      client_id: 'pgnfidgwuKhlfrh4jRuIirRpvteChDGnga9I4hmj',
      site: 'app.essayservice.com',
      is_premium_blog_user: true,
    }),
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      setCookie({ name: 'accessToken', value: data.access_token, domain: '.essayservice.com' });
      setCookie({ name: 'refreshToken', value: data.refresh_token, domain: '.essayservice.com' });
      handleApiResponse(data, emailInputWrap, passwordInputWrap, passErrorText, emailErrorText);
    })
    .catch((error) => console.error('Error:', error));

  toggleIsActive('reactivate-popup', false);
});

// Event handler for 'Reactivate Yes' google button click
document.getElementById('reactivate-yes-google').addEventListener('click', function () {
  const accessToken = getCookie('accessToken');

  const authForm = document.getElementById('auth-form');
  const isPremiumUser = authForm && authForm.classList.contains('is-active');

  fetch('https://app.essayservice.com/api/social/auth/signin/google-oauth2/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      activate: true,
      access_token: accessToken,
      client_id: 'pgnfidgwuKhlfrh4jRuIirRpvteChDGnga9I4hmj',
      is_test: false,
      role: 'customer',
      site: 'app.essayservice.com',
      ...(isPremiumUser && { is_premium_blog_user: true }),
    }),
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      if (data.is_sms_otp_allow) {
        showTwoFactorStep();
        loginToken = data.token;
      } else if (!data.error_map) {
        setCookie({ name: 'accessToken', value: data.access_token, domain: '.essayservice.com' });
        setCookie({
          name: 'refreshToken',
          value: data.refresh_token,
          domain: '.essayservice.com',
        });
        if (!data.allow_unverified_user && data.state === 'unverified') {
          showConfirmEmailStep(data.email);
        } else {
          window.location.href = 'https://app.essayservice.com/';
        }
      }
    })
    .catch((error) => console.error('Error:', error));

  toggleIsActive('reactivate-popup', false);
});

// Event handler for 'Reactivate Yes' facebook button click
document.getElementById('reactivate-yes-fb').addEventListener('click', function () {
  sendFbRequest(true);
  toggleIsActive('reactivate-popup', false);
});

// Event handler for 'Reactivate Yes' apple button click
document.getElementById('reactivate-yes-apple').addEventListener('click', function () {
  sendAppleRequest(accessTokenApple, true);
  toggleIsActive('reactivate-popup', false);
});
// END reactivate logic

// START Login form logic via email
function getLoginEmailValidationElements() {
  return {
    emailInputWrap: document.getElementById('signin-email-input-wrap'),
    emailErrorText: document.getElementById('signin-email-input-error'),
    email: document.getElementById('signin-email').value,
  };
}

function getLoginPasswordValidationElements() {
  return {
    passwordInputWrap: document.getElementById('signin-pass-input-wrap'),
    passErrorText: document.getElementById('signin-pass-input-error'),
    password: document.getElementById('signin-password').value,
  };
}

function validateLoginEmail() {
  const { email, emailInputWrap, emailErrorText } = getLoginEmailValidationElements();
  validateForm(email, '', emailInputWrap, emailErrorText, null, null);
}

function validateLoginPassword() {
  const { password, passwordInputWrap, passErrorText } = getLoginPasswordValidationElements();
  validateForm('', password, null, null, passwordInputWrap, passErrorText);
}

document.getElementById('loginButton').addEventListener('click', function (event) {
  const currentBtn = event.currentTarget;

  const { email, emailInputWrap, emailErrorText } = getLoginEmailValidationElements();
  const { password, passwordInputWrap, passErrorText } = getLoginPasswordValidationElements();

  const isEmailValid = validateForm(email, '', emailInputWrap, emailErrorText, null, null);
  const isPasswordValid = validateForm('', password, null, null, passwordInputWrap, passErrorText);

  if (!isEmailValid || !isPasswordValid) return;

  toggleLoader(currentBtn, true);

  fetch('https://app.essayservice.com/api/auth/signin/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      activate: null,
      remember_me: true,
      email: email,
      password: password,
      client_id: 'pgnfidgwuKhlfrh4jRuIirRpvteChDGnga9I4hmj',
      site: 'app.essayservice.com',
      is_premium_blog_user: true,
    }),
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      const userId = getCookie('extra_metadata');
      setCookie({ name: 'accessToken', value: data.access_token, domain: '.essayservice.com' });
      setCookie({ name: 'refreshToken', value: data.refresh_token, domain: '.essayservice.com' });

      localStorage.setItem('currentUser', JSON.stringify(data));
      if (!data.error_map) {
        userLoginEvent(userId, 'email');
      }
      handleApiResponse(data, emailInputWrap, passwordInputWrap, passErrorText, emailErrorText);
    })
    .catch((error) => console.error('Error:', error))
    .finally(() => {
      toggleLoader(currentBtn, false);
    });
});

document.getElementById('signin-email').addEventListener('input', validateLoginEmail);
document.getElementById('signin-password').addEventListener('input', validateLoginPassword);
// END Login form logic via email

// START Sign Up logic
function getSignEmailValidationElements() {
  return {
    emailInputWrap: document.getElementById('signup-email-input-wrap'),
    emailErrorText: document.getElementById('signup-email-input-error'),
    email: document.getElementById('signup-email').value,
  };
}

function getSignPasswordValidationElements() {
  return {
    passwordInputWrap: document.getElementById('signup-pass-input-wrap'),
    passErrorText: document.getElementById('signup-pass-input-error'),
    password: document.getElementById('signup-password').value,
  };
}

function validateSignEmail() {
  const { email, emailInputWrap, emailErrorText } = getSignEmailValidationElements();
  validateForm(email, '', emailInputWrap, emailErrorText, null, null);
}

function validateSignPassword() {
  const { password, passwordInputWrap, passErrorText } = getSignPasswordValidationElements();
  validateForm('', password, null, null, passwordInputWrap, passErrorText);
}

let recaptchaResponse;
function onSubmitSignUp(token) {
  recaptchaResponse = token;
  document.getElementById('signUpButton').click();
}

document.getElementById('signUpButton').addEventListener('click', function (event) {
  if (!recaptchaResponse) {
    return;
  }
  const currentBtn = event.currentTarget;

  let responseData = {};

  const { email, emailInputWrap, emailErrorText } = getSignEmailValidationElements();
  const { password, passwordInputWrap, passErrorText } = getSignPasswordValidationElements();

  const isEmailValid = validateForm(email, '', emailInputWrap, emailErrorText, null, null);
  const isPasswordValid = validateForm('', password, null, null, passwordInputWrap, passErrorText);

  if (!isEmailValid) {
    window.dataLayer.push({
      event: 'auth_error_email',
      order_error_type: emailErrorText.innerText,
    });
  }

  if (!isPasswordValid) {
    window.dataLayer.push({
      event: 'auth_error_password',
      order_error_type: passErrorText.innerText,
    });
  }

  if (!isEmailValid || !isPasswordValid) return;

  toggleLoader(currentBtn, true);
  fetch('https://app.essayservice.com/api/auth/signup/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      email,
      password,
      role: 'customer',
      client_id: 'pgnfidgwuKhlfrh4jRuIirRpvteChDGnga9I4hmj',
      g_recaptcha_response: recaptchaResponse,
      site: 'app.essayservice.com',
      is_premium_blog_user: true,
    }),
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      responseData = data;

      const userId = getCookie('extra_metadata');
      setCookie({ name: 'accessToken', value: data.access_token, domain: '.essayservice.com' });
      setCookie({ name: 'refreshToken', value: data.refresh_token, domain: '.essayservice.com' });

      if (!data.error_map) {
        return fetchUserData();
      }
      if (typeof data.message === 'object' && data.message !== null) {
        window.dataLayer.push({
          event: 'auth_error_email',
          order_error_type: data.message.email[0] || '',
        });
      } else {
        window.dataLayer.push({
          event: 'auth_error_password',
          order_error_type: data.message,
        });
      }
    })
    .then((userData) => {
      const combinedData = {
        ...responseData,
        ...userData,
      };

      if (combinedData.new_user) {
        setCookie({ name: 'new_user', value: 'true', domain: '.essayservice.com' });
        userSignUpEvent(combinedData.id, 'email');
      } else {
        userLoginEvent(combinedData.id, 'email');
      }

      handleApiResponse(
        combinedData,
        emailInputWrap,
        passwordInputWrap,
        passErrorText,
        emailErrorText
      );
    })
    .catch((error) => console.error('Error:', error))
    .finally(() => {
      toggleLoader(currentBtn, false);
    });
});

document.getElementById('signup-email').addEventListener('input', validateSignEmail);
document.getElementById('signup-password').addEventListener('input', validateSignPassword);

// END Sign Up logic

// START Forgot Password logic
function getForgotEmailValidationElements() {
  return {
    emailInputWrap: document.getElementById('forgot-email-input-wrap'),
    emailErrorText: document.getElementById('forgot-email-input-error'),
    email: document.getElementById('forgot-email').value,
  };
}

function validateForgotEmail() {
  const { email, emailInputWrap, emailErrorText } = getForgotEmailValidationElements();
  validateForm(email, '', emailInputWrap, emailErrorText, null, null);
}

document.getElementById('forgotButton').addEventListener('click', function () {
  const { email, emailInputWrap, emailErrorText } = getForgotEmailValidationElements();

  const isEmailValid = validateForm(email, '', emailInputWrap, emailErrorText, null, null);

  if (!isEmailValid) return;

  fetch(
    `https://app.essayservice.com/api/auth/forgot-password?email=${encodeURIComponent(email)}`,
    {
      method: 'GET',
    }
  )
    .then((response) => response)
    .then((data) => {
      if (data.status === 200) {
        toggleIsActive('forgot-success-block', true);
        document.getElementById('email-form-forgot').classList.add('is-hide');
        document.querySelector('.js-email-for-reset').textContent = email;
      } else {
        handleFormError(emailInputWrap, emailErrorText, 'Email not registered');
      }
    })
    .catch((error) => console.error('Error:', error));
});

document.getElementById('forgot-email').addEventListener('input', validateForgotEmail);
// END Forgot Password logic

// START logic for opening/closing popup
function handleAuthPopupClick(tabIndex) {
  const countryInfo = getCountryInfoByTimezone(Intl.DateTimeFormat().resolvedOptions().timeZone);

  const allowedCountries = ['GB', 'AU', 'NZ', 'IE'];

  if (allowedCountries.includes(countryInfo?.country_code)) {
    document.getElementById('auth-country').textContent = countryInfo.name;
    document.getElementById('auth-country-with-s').textContent = `${countryInfo.name}'s`;
    toggleIsActive('authFormCountry', true);
  }

  switchTab(tabIndex);
  toggleIsActive('auth-form', true);
  document.body.style.overflow = 'hidden';
  window.dataLayer.push({
    event: 'auth_page_visit',
  });
}

document.getElementById('close-auth-popup').addEventListener('click', () => {
  toggleIsActive('auth-form', false);
  document.body.style.overflow = '';

  const codeStateElement = document.getElementById('code-state');
  if (codeStateElement && codeStateElement.classList.contains('is-active')) {
    toggleIsActive('initial-state', true);
    toggleIsActive('auth-form-social', true);
    toggleIsActive('code-state', false);
  }

  window.dataLayer.push({
    event: 'auth_modal_click_close',
    click_text: 'Close popup',
  });
});
// END logic for opening/closing popup

// START Returning from confirm email
document.getElementById('backToSignup').addEventListener('click', function () {
  const accessToken = getCookie('accessToken');

  switchTab(1);
  toggleIsActive('confirm-state', false);
  toggleIsActive('initial-state', true);
  toggleIsActive('auth-form-social', true);

  fetch('https://app.essayservice.com/api/auth/signout/', {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${accessToken}`,
    },
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      if (data.status) {
        localStorage.removeItem('currentUser');
      }
    })
    .catch((error) => {
      console.error('Error:', error);
    });
});
// END Returning from confirm email

// START re-send link to email
document.getElementById('confirmEmailBtn').addEventListener('click', function () {
  const confirmEmail = document.getElementById('confirm-email').textContent;
  const accessToken = getCookie('accessToken');

  fetch('https://app.essayservice.com/api/auth/verify-email/resend/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
      Authorization: `Bearer ${accessToken}`,
    },
    body: JSON.stringify({
      email: confirmEmail,
    }),
    credentials: 'include',
  })
    .then((response) => response)
    .then((data) => {
      if (data.ok) {
        document.getElementById('authFormConfirmBtn').classList.add('is-hide');
        toggleIsActive('authFormConfirmDone', true);
      }
    })
    .catch((error) => console.error('Error:', error));
});

document.getElementById('confirmEmailAgain').addEventListener('click', function () {
  document.getElementById('confirmEmailBtn').click();
});
// END re-send link to email

// START two-factor authentication
const codeInputs = document.querySelectorAll('.js-code-input');
const twoFactorSubmitBtn = document.getElementById('twoFactorCodeButton');
let code = '';

function checkInputs() {
  code = Array.from(codeInputs)
    .map((input) => input.value)
    .join('');
  if (code.length === codeInputs.length) {
    twoFactorSubmitBtn.classList.remove('not-active');
    document.getElementById('twoFactorCodeButton').click();
  } else {
    twoFactorSubmitBtn.classList.add('not-active');
  }
}

function clearCodeInputs() {
  codeInputs.forEach((input) => {
    input.value = '';
  });
  code = '';
  twoFactorSubmitBtn.classList.add('not-active');
  if (codeInputs.length > 0) {
    codeInputs[0].focus();
  }
}

codeInputs.forEach((input, index) => {
  input.addEventListener('input', (e) => {
    let { value } = e.target;

    if (value.length > 1) {
      value = value.charAt(0);
      e.target.value = value;
    }

    if (value.length === 1 && index < codeInputs.length - 1) {
      codeInputs[index + 1].focus();
    }

    checkInputs();
  });

  input.addEventListener('keydown', (e) => {
    if (e.key === 'Backspace' && index > 0 && input.value === '') {
      codeInputs[index - 1].focus();
    }
  });

  input.addEventListener('paste', (e) => {
    e.preventDefault();
    const pasteData = e.clipboardData.getData('text');

    if (pasteData.length === codeInputs.length) {
      codeInputs.forEach((input, i) => {
        input.value = pasteData[i] || '';
      });

      checkInputs();

      codeInputs[codeInputs.length - 1].focus();
    }
  });
});

document.getElementById('twoFactorCodeButton').addEventListener('click', function (event) {
  const currentBtn = event.currentTarget;
  const codeInputWrap = document.getElementById('code-input-wrap');
  const codeInputError = document.getElementById('code-input-error');

  if (!code) {
    handleFormError(codeInputWrap, codeInputError, 'Verification code is required');
    return;
  }

  toggleLoader(currentBtn, true);
  fetch('https://app.essayservice.com/api/auth/signin/two-factor/', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      otp: code,
      token: loginToken,
      client_id: 'pgnfidgwuKhlfrh4jRuIirRpvteChDGnga9I4hmj',
    }),
    credentials: 'include',
  })
    .then((response) => response.json())
    .then((data) => {
      if (!data.error_map) {
        setCookie({ name: 'accessToken', value: data.access_token, domain: '.essayservice.com' });
        setCookie({ name: 'refreshToken', value: data.refresh_token, domain: '.essayservice.com' });
        window.location.href = 'https://app.essayservice.com/';
      } else {
        clearCodeInputs();
        handleFormError(codeInputWrap, codeInputError, data.message?.otp?.[0] || '');
      }
    })
    .catch((error) => console.error('Error:', error))
    .finally(() => {
      toggleLoader(currentBtn, false);
    });
});
// END two-factor authentication

// START Country logic
// Get country params
function getCountryInfoByTimezone(timezone) {
  for (const country of countries) {
    if (country.timezones.includes(timezone)) {
      return {
        country_code: country.country_code,
        name: country.name,
      };
    }
  }
  return null;
}

// Listeners for country popup buttons
document.getElementById('closeCountryPopup').addEventListener('click', function () {
  toggleIsActive('authFormCountry', false);
});

document.getElementById('closeCountryAll').addEventListener('click', function () {
  toggleIsActive('authFormCountry', false);
  toggleIsActive('auth-form', false);
});
//END Country logic

// START analytics
window.dataLayer = window.dataLayer || [];

function userLoginEvent(userId, method) {
  window.dataLayer.push({
    user_id: userId,
    method: method,
    color_theme: 'system',
    event: 'user_login',
  });
}

function userSignUpEvent(userId, method) {
  const currentDate = new Date();
  const formattedDate =
    currentDate.getDate() + '.' + (currentDate.getMonth() + 1) + '.' + currentDate.getFullYear();
  window.dataLayer.push({
    userId: userId,
    eventCategory: 'SignUp',
    eventAction: 'Completed',
    registration_date: formattedDate,
    method: method,
    color_theme: 'system',
    event: 'CompleteRegistration',
  });
}

function userMethodRegisterEvent(eventName) {
  const activeTab = document.querySelector('.auth-form__tabs__link.w--current');
  const clickText = activeTab ? activeTab.textContent.trim() : '';

  window.dataLayer.push({
    event: eventName,
    click_text: clickText,
    type: 'Auth modal',
  });
}

function pushLandingPageEvent(clickText, buttonElement = null) {
  let buttonText = '';
  if (buttonElement) {
    buttonText = buttonElement.textContent.trim() || buttonElement.value || '';
  }

  const urlParams = new URLSearchParams(window.location.search);
  const subjectInput = document.querySelector('input[search-input="subject"]');
  const subject = subjectInput ? subjectInput.value.trim() : '';
  const deadline = urlParams.get('deadline') || '';

  window.dataLayer.push({
    event: 'click_cta_on_landing_page',
    button_text: buttonText,
    click_text: clickText,
    subject: subject,
    deadline: deadline,
  });
}

document
  .querySelectorAll('.auth-form__tabs__link.w-tab-link')[1]
  .addEventListener('click', function () {
    window.dataLayer.push({
      event: 'click_sign_up_tab',
      click_text: 'Sign up',
      type: 'Auth modal',
    });
  });
document
  .querySelectorAll('.auth-form__tabs__link.w-tab-link')[0]
  .addEventListener('click', function () {
    window.dataLayer.push({
      event: 'click_login_tab',
      click_text: 'Log in',
      type: 'Auth modal',
    });
  });

document
  .querySelectorAll('.r-navbar__login--desktop--mod')[0]
  .addEventListener('click', function () {
    window.dataLayer.push({
      event: 'click_cta_on_landing_page',
      click_text: 'Log in',
      type: 'Login block',
    });
  });
document.querySelectorAll('.r-navbar__signup--mod')[0].addEventListener('click', function () {
  window.dataLayer.push({
    event: 'click_cta_on_landing_page',
    click_text: 'Sign up',
    type: 'Login block',
  });
});

document.getElementById('js-hero-btn-event').addEventListener('click', function (event) {
  pushLandingPageEvent('Hero block', event.currentTarget);
});
document.getElementById('js-service-block-btn-event').addEventListener('click', function (event) {
  pushLandingPageEvent('Choose service block', event.currentTarget);
});
document.getElementById('js-steps-block-btn-event').addEventListener('click', function (event) {
  pushLandingPageEvent('How it works block', event.currentTarget);
});
document.getElementById('js-pricing-block-btn-event').addEventListener('click', function (event) {
  pushLandingPageEvent('Pricing block', event.currentTarget);
});
document.getElementById('js-banner-block-btn-event').addEventListener('click', function (event) {
  pushLandingPageEvent('Save hours block', event.currentTarget);
});
document.querySelectorAll('.r-experts .js-sign-in-popup').forEach((button) => {
  button.addEventListener('click', function (event) {
    pushLandingPageEvent('Writers block', event.currentTarget);
  });
});
function onGoogleClickHandler() {
  userMethodRegisterEvent('click_google_icon');
}
// END analytics