Source: listeners/sign-up.js

import Listener from "./listener.js";

/**
 * Listener for signup attempts.
 * Triggered when the user submits the sign-up form.
 * @class
 * @extends Listener
 */
export class SignupAttemptListener extends Listener {
    eventName = 'sign_up';

    /**
     * Gets the sign-up form element.
     * @returns {HTMLElement} The sign-up form.
     */
    get signupForm() {
        return document.querySelector('#create_customer');
    }

    /**
     * Creates the payload object with the given status.
     * @param {string} status - The status of the signup attempt.
     * @returns {Object} The payload object containing the status.
     */
    createPayload(status) {
        return { status };
    }

    /**
     * Adds an event listener for the submit event on the signup form.
     */
    listen() {
        this.signupForm.addEventListener('submit', () => this.trigger('signup_attempt'));
    }
}

/**
 * Listener for successful signups.
 * Triggered after the user signs up if the signup was successful.
 * The signup is considered successful if the user is logged in after attempting to sign up.
 * @class
 * @extends SignupAttemptListener
 * @param {string} customerID - The ID of the customer if signed in.
 */
export class SignupSuccessListener extends SignupAttemptListener {
    constructor(customerID) {
        super();
        this.customerID = customerID;
    }

    /**
     * Checks if the signup was successful and triggers a signup success event if so.
     */
    listen() {
        const signupSuccess = sessionStorage.getItem('signup_attempt') && this.customerID;
        if (signupSuccess) this.trigger("signup_success");
    }
}

/**
 * Listener for signup failures.
 * Triggered if the signup form contains errors.
 * @class
 * @extends SignupAttemptListener
 */
export class SignupFailureListener extends SignupAttemptListener {
    /**
     * Gets the signup error container.
     * @returns {HTMLElement|null} The container for signup errors, or null if none exists.
     */
    get signupError() {
        return this.signupForm.querySelector('div.errors');
    }

    /**
     * Gets the content of the signup error message.
     * @returns {string} The content of the signup error message.
     */
    get signupErrorMessage() {
        return this.signupError.textContent;
    }

    /**
     * Checks if the signup was a failure and triggers a signup failure event if so.
     */
    listen() {
        const isFailure = this.signupError && !this.signupError.textContent.includes('verify your email');
        if (isFailure) this.trigger("signup_failure");
    }
}

/**
 * Listener for signup success messages.
 * Triggered after the user signs up if a "verify your email" message is displayed.
 * Extends the SignupFailureListener to specifically listen for the "verify your email" success message.
 * @class
 * @extends SignupFailureListener
 */
export class SignupSuccessMessageListener extends SignupFailureListener {
    /**
     * Checks if the signup was successful and contained a "verify your email" message, and triggers a signup success event if so.
     */
    listen() {
        const isSuccessMessage = this.signupError && this.signupError.textContent.includes('verify your email');
        if (isSuccessMessage) this.trigger("signup_success");
    }
}