diff --git a/_dev/js/theme/core/checkout/components/useCheckoutStepsController.js b/_dev/js/theme/core/checkout/components/useCheckoutStepsController.js index 5d5271ad..20eaea41 100644 --- a/_dev/js/theme/core/checkout/components/useCheckoutStepsController.js +++ b/_dev/js/theme/core/checkout/components/useCheckoutStepsController.js @@ -1,7 +1,13 @@ import prestashop from 'prestashop'; - import { getAllSiblingsBeforeElement, getAllSiblingsAfterElement } from '../../../utils/DOMSelectorsHelper'; +/** + * A utility function to control checkout steps in Prestashop. + * + * @module useCheckoutStepsController + * @param {string} stepsSelector - The selector for identifying checkout steps. Defaults to Prestashop's default selector. + * @returns {object} An object with functions for controlling checkout steps. + */ const useCheckoutStepsController = (stepsSelector = prestashop.selectors.checkout.step) => { const DOMClasses = { STEP_CURRENT: '-current', @@ -11,19 +17,58 @@ const useCheckoutStepsController = (stepsSelector = prestashop.selectors.checkou STEP_UNREACHABLE: '-unreachable', }; + /** + * Checks if a step is the current step. + * + * @function + * @param {HTMLElement} step - The step element to check. + * @returns {boolean} True if the step is the current step, false otherwise. + */ const isStepCurrent = (step) => step.classList.contains(DOMClasses.STEP_CURRENT); + /** + * Checks if a step is unreachable. + * + * @function + * @param {HTMLElement} step - The step element to check. + * @returns {boolean} True if the step is unreachable, false otherwise. + */ const isStepUnreachable = (step) => step.classList.contains(DOMClasses.STEP_UNREACHABLE); + /** + * Checks if a step has a continue button. + * + * @function + * @param {HTMLElement} step - The step element to check. + * @returns {boolean} True if the step has a continue button, false otherwise. + */ const hasStepContinueButton = (step) => step.querySelector('button.continue') !== null; + /** + * Gets the current step. + * + * @function + * @returns {HTMLElement|null} The current step element, or null if not found. + */ const getCurrentStep = () => document.querySelector(`${stepsSelector}.${DOMClasses.STEP_CURRENT}`); + /** + * Sets a step as the current step. + * + * @function + * @param {HTMLElement} step - The step element to set as current. + */ const setCurrentStep = (step) => { getCurrentStep()?.classList.remove(DOMClasses.STEP_CURRENT); step.classList.add(DOMClasses.STEP_CURRENT); }; + /** + * Disables all steps after the provided step. + * + * @function + * @param {HTMLElement} step - The step after which all steps should be disabled. + */ const disableAllAfter = (step) => { const nextSteps = getAllSiblingsAfterElement(step); @@ -34,6 +79,12 @@ const useCheckoutStepsController = (stepsSelector = prestashop.selectors.checkou } }; + /** + * Enables all steps before the provided step. + * + * @function + * @param {HTMLElement} step - The step before which all steps should be enabled. + */ const enableAllBefore = (step) => { const prevSteps = getAllSiblingsBeforeElement(step); @@ -44,6 +95,12 @@ const useCheckoutStepsController = (stepsSelector = prestashop.selectors.checkou } }; + /** + * Changes the current step and adjusts the reachable and unreachable steps accordingly. + * + * @function + * @param {HTMLElement} step - The step to change to. + */ const changeStep = (step) => { if (!step) { return; diff --git a/_dev/js/theme/core/checkout/handler/address/changeAddressHandler.js b/_dev/js/theme/core/checkout/handler/address/changeAddressHandler.js index 5222cda4..d634dd2b 100644 --- a/_dev/js/theme/core/checkout/handler/address/changeAddressHandler.js +++ b/_dev/js/theme/core/checkout/handler/address/changeAddressHandler.js @@ -6,8 +6,10 @@ import switchConfirmAddressesButtonState from '../../utils/switchConfirmAddresse import { isElementVisible, each } from '../../../../utils/DOMHelpers'; /** - * Change address handler - * @param event {object} - change event + * Handles the change event for address selection in the Prestashop checkout process. + * + * @function + * @param {object} event - The change event object. */ const changeAddressHandler = (event) => { const {