Code structure refactorization part 1

_dev/js/theme/core/checkout/checkoutController.js → _dev/js/checkout/core/checkout/checkoutController.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import useEvent from '../../components/event/useEvent';
+import useEvent from '../../../utils/event/useEvent';
 import editAddressHandler from './handler/address/editAddressHandler';
 import changeAddressHandler from './handler/address/changeAddressHandler';
 import changeDeliveryMethodHandler from './handler/delivery/changeDeliveryMethodHandler';

_dev/js/theme/core/checkout/components/useCheckoutStepsController.js → _dev/js/checkout/core/checkout/components/useCheckoutStepsController.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import { getAllSiblingsBeforeElement, getAllSiblingsAfterElement } from '../../../utils/DOMSelectorsHelper';
+import { getAllSiblingsBeforeElement, getAllSiblingsAfterElement } from '../../../../utils/DOM/DOMSelectorsHelper';
 
 /**
  * A utility function to control checkout steps in Prestashop.

_dev/js/theme/core/checkout/handler/address/changeAddressHandler.js → _dev/js/checkout/core/checkout/handler/address/changeAddressHandler.js

@@ -1,9 +1,9 @@
 import prestashop from 'prestashop';
-import useToggleDisplay from '../../../../components/display/useToggleDisplay';
+import useToggleDisplay from '../../../../../utils/display/useToggleDisplay';
 import switchEditAddressButtonColor from '../../utils/switchEditAddressButtonColor';
 import getEditAddress from '../../utils/getEditAddress';
 import switchConfirmAddressesButtonState from '../../utils/switchConfirmAddressesButtonState';
-import { isElementVisible, each } from '../../../../utils/DOMHelpers';
+import { isElementVisible, each } from '../../../../../utils/DOM/DOMHelpers';
 
 /**
  * Handles the change event for address selection in the Prestashop checkout process.

_dev/js/theme/core/checkout/handler/address/showAddressErrorMessageHandler.js → _dev/js/checkout/core/checkout/handler/address/showAddressErrorMessageHandler.js

@@ -1,8 +1,8 @@
 import prestashop from 'prestashop';
-import useToggleDisplay from '../../../../components/display/useToggleDisplay';
+import useToggleDisplay from '../../../../../utils/display/useToggleDisplay';
 import switchConfirmAddressesButtonState from '../../utils/switchConfirmAddressesButtonState';
 import switchEditAddressButtonColor from '../../utils/switchEditAddressButtonColor';
-import { isElementVisible } from '../../../../utils/DOMHelpers';
+import { isElementVisible } from '../../../../../utils/DOM/DOMHelpers';
 import getEditAddress from '../../utils/getEditAddress';
 
 /**

_dev/js/theme/core/checkout/handler/delivery/changeDeliveryMethodHandler.js → _dev/js/checkout/core/checkout/handler/delivery/changeDeliveryMethodHandler.js

@@ -1,9 +1,8 @@
 import prestashop from 'prestashop';
-import { formSerializeArray, fromSerializeObject } from '../../../../utils/formSerialize';
+import { formSerializeArray, fromSerializeObject } from '../../../../../utils/formSerialize';
 import selectDeliveryMethodRequest from '../../request/selectDeliveryMethodRequest';
-import parseToHtml from '../../../../utils/parseToHtml';
 import refreshCheckoutPage from '../../utils/refreshCheckoutPage';
-import { each } from '../../../../utils/DOMHelpers';
+import { each, parseToHtml } from '../../../../../utils/DOM/DOMHelpers';
 
 /**
  * Handles the change of delivery method in the Prestashop checkout process.

_dev/js/theme/core/checkout/handler/payment/confirmOrderHandler.js → _dev/js/checkout/core/checkout/handler/payment/confirmOrderHandler.js

@@ -3,7 +3,7 @@ import getSelectedPaymentOption from '../../utils/getSelectedPaymentOption';
 import canProceedOrder from '../../utils/canProceedOrder';
 import checkCartStillOrderableRequest from '../../request/checkCartStillOrderableRequest';
 import toggleOrderConfirmationButtonState from '../../utils/toggleOrderConfirmationButtonState';
-import { each } from '../../../../utils/DOMHelpers';
+import { each } from '../../../../../utils/DOM/DOMHelpers';
 
 const showNativeFormErrors = () => {
   const { termsCheckboxSelector } = prestashop.selectors.checkout;

_dev/js/theme/core/checkout/handler/payment/toggleOrderButtonStateHandler.js → _dev/js/checkout/core/checkout/handler/payment/toggleOrderButtonStateHandler.js

@@ -1,8 +1,8 @@
 import prestashop from 'prestashop';
-import useToggleDisplay from '../../../../components/display/useToggleDisplay';
+import useToggleDisplay from '../../../../../utils/display/useToggleDisplay';
 import canProceedOrder from '../../utils/canProceedOrder';
 import toggleOrderConfirmationButtonState from '../../utils/toggleOrderConfirmationButtonState';
-import { each } from '../../../../utils/DOMHelpers';
+import { each } from '../../../../../utils/DOM/DOMHelpers';
 
 const { toggle } = useToggleDisplay();
 

_dev/js/theme/core/checkout/handler/payment/togglePaymentOptionsHandler.js → _dev/js/checkout/core/checkout/handler/payment/togglePaymentOptionsHandler.js

@@ -1,9 +1,9 @@
 import collapseAllPaymentOptions from '../../utils/collapseAllPaymentOptions';
 import getSelectedPaymentOption from '../../utils/getSelectedPaymentOption';
-import useToggleDisplay from '../../../../components/display/useToggleDisplay';
+import useToggleDisplay from '../../../../../utils/display/useToggleDisplay';
 import canProceedOrder from '../../utils/canProceedOrder';
 import toggleOrderConfirmationButtonState from '../../utils/toggleOrderConfirmationButtonState';
-import { each } from '../../../../utils/DOMHelpers';
+import { each } from '../../../../../utils/DOM/DOMHelpers';
 
 const { show } = useToggleDisplay();
 

_dev/js/theme/core/checkout/handler/process/checkoutFormSubmitHandler.js → _dev/js/checkout/core/checkout/handler/process/checkoutFormSubmitHandler.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import { each } from '../../../../utils/DOMHelpers';
+import { each } from '../../../../../utils/DOM/DOMHelpers';
 
 /**
  * Handles the submission of the checkout form, disables submit buttons, and emits a 'submitCheckoutForm' event.

_dev/js/theme/core/checkout/index.js → _dev/js/checkout/core/checkout/index.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import DOMReady from '../../utils/DOMReady';
+import { DOMReady } from '../../../utils/DOM/DOMHelpers';
 
 import checkoutController from './checkoutController';
 

_dev/js/theme/core/checkout/request/checkCartStillOrderableRequest.js → _dev/js/checkout/core/checkout/request/checkCartStillOrderableRequest.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import useDefaultHttpRequest from '../../../components/http/useDefaultHttpRequest';
+import useDefaultHttpRequest from '../../../../utils/http/useDefaultHttpRequest';
 
 /**
  * Represents the server response from a check cart still orderable request.

_dev/js/theme/core/checkout/request/selectDeliveryMethodRequest.js → _dev/js/checkout/core/checkout/request/selectDeliveryMethodRequest.js

@@ -1,4 +1,4 @@
-import useDefaultHttpRequest from '../../../components/http/useDefaultHttpRequest';
+import useDefaultHttpRequest from '../../../../utils/http/useDefaultHttpRequest';
 
 /**
  * Represents the server response from a select delivery method request.

_dev/js/theme/core/checkout/utils/areConditionsAccepted.js → _dev/js/checkout/core/checkout/utils/areConditionsAccepted.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import { each } from '../../../utils/DOMHelpers';
+import { each } from '../../../../utils/DOM/DOMHelpers';
 
 /**
  * Checks if all conditions are accepted.

_dev/js/theme/core/checkout/utils/collapseAllPaymentOptions.js → _dev/js/checkout/core/checkout/utils/collapseAllPaymentOptions.js

@@ -1,6 +1,6 @@
 import prestashop from 'prestashop';
-import { each } from '../../../utils/DOMHelpers';
-import useToggleDisplay from '../../../components/display/useToggleDisplay';
+import { each } from '../../../../utils/DOM/DOMHelpers';
+import useToggleDisplay from '../../../../utils/display/useToggleDisplay';
 
 /**
  * Collapses all payment options' additional information blocks and options forms.

_dev/js/theme/core/checkout/utils/switchConfirmAddressesButtonState.js → _dev/js/checkout/core/checkout/utils/switchConfirmAddressesButtonState.js

@@ -1,4 +1,4 @@
-import { each } from '../../../utils/DOMHelpers';
+import { each } from '../../../../utils/DOM/DOMHelpers';
 
 /**
  * Switches the state of the confirm addresses button.

_dev/js/theme/core/checkout/utils/switchEditAddressButtonColor.js → _dev/js/checkout/core/checkout/utils/switchEditAddressButtonColor.js

@@ -1,4 +1,4 @@
-import { each } from '../../../utils/DOMHelpers';
+import { each } from '../../../../utils/DOM/DOMHelpers';
 
 /**
  * Changes the color of the edit button for the wrong address.

_dev/js/checkout/index.js

@@ -1,9 +1,8 @@
 import prestashop from 'prestashop';
-import useEvent from '../theme/components/event/useEvent';
-import parseToHtml from '../theme/utils/parseToHtml';
-import useHttpRequest from '../theme/components/http/useHttpRequest';
-import { each } from '../theme/utils/DOMHelpers';
-import DOMReady from '../theme/utils/DOMReady';
+import useEvent from '../utils/event/useEvent';
+import { parseToHtml, each, DOMReady } from '../utils/DOM/DOMHelpers';
+import useHttpRequest from '../utils/http/useHttpRequest';
+import './core/checkout/index';
 
 const { on } = useEvent();
 

_dev/js/listing/components/filters/Filters.js

@@ -1,6 +1,6 @@
 import prestashop from 'prestashop';
 import FiltersRangeSliders from './FiltersRangeSliders';
-import useEvent from '../../../theme/components/event/useEvent';
+import useEvent from '../../../utils/event/useEvent';
 
 class Filters {
   constructor() {

_dev/js/listing/components/filters/FiltersRangeSliders.js

@@ -1,5 +1,5 @@
 import RangeSlider from './RangeSlider';
-import { each } from '../../../theme/utils/DOMHelpers';
+import { each } from '../../../utils/DOM/DOMHelpers';
 
 class FiltersRangeSliders {
   static init() {

_dev/js/listing/components/filters/RangeSlider.js

@@ -2,7 +2,7 @@ import prestashop from 'prestashop';
 import noUiSlider from 'nouislider';
 import wNumb from 'wnumb';
 import FiltersUrlHandler from './FiltersUrlHandler';
-import useEvent from '../../../theme/components/event/useEvent';
+import useEvent from '../../../utils/event/useEvent';
 
 class RangeSlider {
   constructor(element) {

_dev/js/listing/index.js

@@ -1,8 +1,6 @@
 import prestashop from 'prestashop';
-import Filters from '@js/listing/components/filters/Filters';
-import parseToHtml from '../theme/utils/parseToHtml';
-import { each } from '../theme/utils/DOMHelpers';
-import DOMReady from '../theme/utils/DOMReady';
+import Filters from './components/filters/Filters';
+import { each, parseToHtml, DOMReady } from '../utils/DOM/DOMHelpers';
 
 function updateProductListDOM(data) {
   each(prestashop.selectors.listing.searchFilters, (el) => {

_dev/js/product/index.js

@@ -1,5 +1,5 @@
 import ProductGallery from './components/ProductGallery';
-import DOMReady from '../theme/utils/DOMReady';
+import { DOMReady } from '../utils/DOM/DOMHelpers';
 
 DOMReady(() => {
   const gallery = new ProductGallery();

_dev/js/theme/components/customer/index.js

@@ -1,4 +1,4 @@
-import DOMReady from '../../utils/DOMReady';
+import { DOMReady } from '../../../utils/DOM/DOMHelpers';
 
 const initCustomerLinksTriggerActive = () => {
   const url = window.location.pathname;

_dev/js/theme/components/dynamic-bootstrap-components.js

@@ -1,5 +1,5 @@
-import DOMReady from '../utils/DOMReady';
-import useBootstrapComponentDynamicImport from '../utils/dynamicImports/useBootstrapComponentDynamicImport';
+import { DOMReady } from '../../utils/DOM/DOMHelpers';
+import useBootstrapComponentDynamicImport from '../../utils/dynamicImports/useBootstrapComponentDynamicImport';
 
 DOMReady(() => {
   const { init: initDynamicImportForModal } = useBootstrapComponentDynamicImport(

_dev/js/theme/components/header/index.js

@@ -1,4 +1,4 @@
-import DOMReady from '../../utils/DOMReady';
+import { DOMReady } from '../../../utils/DOM/DOMHelpers';
 import useTopMenu from './useTopMenu';
 import useStickyElement from '../useStickyElement';
 

_dev/js/theme/components/header/useTopMenu.js

@@ -1,4 +1,4 @@
-import useEvent from '../event/useEvent';
+import useEvent from '../../../utils/event/useEvent';
 
 const useTopMenu = (selector) => {
   const { on, off } = useEvent();

_dev/js/theme/components/product.js

@@ -1,8 +1,6 @@
 import prestashop from 'prestashop';
 import useCustomQuantityInput from './useCustomQuantityInput';
-import { each } from '../utils/DOMHelpers';
-import parseToHtml from '../utils/parseToHtml';
-import DOMReady from '../utils/DOMReady';
+import { each, parseToHtml, DOMReady } from '../../utils/DOM/DOMHelpers';
 import productEventContextSelector from '../core/product/utils/productEventContextSelector';
 
 DOMReady(() => {

_dev/js/theme/components/quickview.js

@@ -1,6 +1,5 @@
 import prestashop from 'prestashop';
-import DOMReady from '../utils/DOMReady';
-import parseToHtml from '../utils/parseToHtml';
+import { DOMReady, parseToHtml } from '../../utils/DOM/DOMHelpers';
 
 /**
  * Handle open quick view

_dev/js/theme/components/responsive.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import DOMReady from '../utils/DOMReady';
+import { DOMReady } from '../../utils/DOM/DOMHelpers';
 
 function isMobile() {
   return prestashop.responsive.current_width < prestashop.responsive.min_width;

_dev/js/theme/components/sliders/index.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import DOMReady from '../../utils/DOMReady';
+import { DOMReady } from '../../../utils/DOM/DOMHelpers';
 import PageSlider from './PageSlider';
 import SwiperSlider from './SwiperSlider';
 

_dev/js/theme/components/useAlertToast.js

@@ -1,4 +1,4 @@
-import parseToHtml from '@js/theme/utils/parseToHtml';
+import { parseToHtml } from '../../utils/DOM/DOMHelpers';
 
 let id = 0;
 

_dev/js/theme/components/usePageLoader.js

@@ -1,8 +1,12 @@
 /**
  * A utility module for managing the page loader state.
  *
- * @return {showLoader, hideLoader}
+ * @module usePageLoader
+ * @returns {Object} An object with methods to show and hide the page loader.
+ * @property {Function} showLoader - Displays the page loader.
+ * @property {Function} hideLoader - Hides the page loader.
  * @example
+ * // Usage example:
  * const pageLoader = usePageLoader();
  * pageLoader.showLoader(); // Display the page loader
  * pageLoader.hideLoader(); // Hide the page loader
@@ -14,7 +18,8 @@ const usePageLoader = () => {
   /**
    * Show the page loader.
    *
-   * @method showLoader
+   * @function
+   * @name showLoader
    * @returns {void}
    */
   const showLoader = () => {
@@ -24,7 +29,8 @@ const usePageLoader = () => {
   /**
    * Hide the page loader.
    *
-   * @method hideLoader
+   * @function
+   * @name hideLoader
    * @returns {void}
    */
   const hideLoader = () => {

_dev/js/theme/components/useStickyElement.js

@@ -1,4 +1,4 @@
-import debounce from '../utils/debounce';
+import debounce from '../../utils/debounce';
 
 /**
  * Returns sticky element data

_dev/js/theme/components/useThemeForm.js

@@ -1,4 +1,4 @@
-import { each } from '../utils/DOMHelpers';
+import { each } from '../../utils/DOM/DOMHelpers';
 
 const supportedValidity = () => {
   const input = document.createElement('input');

_dev/js/theme/core/address/addressController.js

@@ -1,4 +1,4 @@
-import useEvent from '../../components/event/useEvent';
+import useEvent from '../../../utils/event/useEvent';
 import changeAddressCountryHandler from './handler/changeAddressCountryHandler';
 
 /**

_dev/js/theme/core/address/handler/changeAddressCountryHandler.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import parseToHtml from '../../../utils/parseToHtml';
+import { parseToHtml } from '../../../../utils/DOM/DOMHelpers';
 import updateAddressRequest from '../request/updateAddressRequest';
 
 /**

_dev/js/theme/core/address/index.js

@@ -1,5 +1,5 @@
 import addressController from './addressController';
-import DOMReady from '../../utils/DOMReady';
+import { DOMReady } from '../../../utils/DOM/DOMHelpers';
 
 const { init } = addressController();
 

_dev/js/theme/core/address/request/updateAddressRequest.js

@@ -1,7 +1,7 @@
-import useHttpRequest from '../../../components/http/useHttpRequest';
-import useHttpController from '../../../components/http/useHttpController';
-import useHttpPayloadDefinition from '../../../components/http/useHttpPayloadDefinition';
-import GenericHttpRequestError from '../../../components/http/error/GenericHttpRequestError';
+import useHttpRequest from '../../../../utils/http/useHttpRequest';
+import useHttpController from '../../../../utils/http/useHttpController';
+import useHttpPayloadDefinition from '../../../../utils/http/useHttpPayloadDefinition';
+import GenericHttpRequestError from '../../../../utils/http/error/GenericHttpRequestError';
 
 /**
  * @typedef {Object} ServerResponse

_dev/js/theme/core/cart/cartController.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import useEvent from '../../components/event/useEvent';
+import useEvent from '../../../utils/event/useEvent';
 import submitVoucherHandler from './handler/voucher/submitVoucherHandler';
 import codeLinkSubmitHandler from './handler/voucher/codeLinkSubmitHandler';
 import deleteVoucherHandler from './handler/voucher/deleteVoucherHandler';

_dev/js/theme/core/cart/handler/cart/addToCartHandler.js

@@ -1,7 +1,7 @@
 import prestashop from 'prestashop';
 import useAlertToast from '../../../../components/useAlertToast';
 import addToCartRequest from '../../request/cart/addToCartRequest';
-import sprintf from '../../../../utils/sprintf';
+import sprintf from '../../../../../utils/sprintf';
 
 const { danger } = useAlertToast();
 

_dev/js/theme/core/cart/handler/cart/updateCartHandler.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import parseToHtml from '../../../../utils/parseToHtml';
+import { parseToHtml } from '../../../../../utils/DOM/DOMHelpers';
 import updateCartContentRequest from '../../request/cart/updateCartContentRequest';
 
 /**

_dev/js/theme/core/cart/handler/voucher/submitVoucherHandler.js

@@ -1,6 +1,6 @@
 import prestashop from 'prestashop';
 import addVoucherToCartRequest from '../../request/voucher/addVoucherToCartRequest';
-import parseToHtml from '../../../../utils/parseToHtml';
+import { parseToHtml } from '../../../../../utils/DOM/DOMHelpers';
 
 /**
  * Handles the submission of a voucher form and updates the cart accordingly.

_dev/js/theme/core/cart/index.js

@@ -1,5 +1,5 @@
 import prestashop from 'prestashop';
-import DOMReady from '../../utils/DOMReady';
+import { DOMReady } from '../../../utils/DOM/DOMHelpers';
 import cartController from './cartController';
 
 prestashop.cart = prestashop.cart || {};

_dev/js/theme/core/cart/request/cart/addToCartRequest.js

@@ -1,6 +1,6 @@
 import prestashop from 'prestashop';
-import useDefaultHttpRequest from '../../../../components/http/useDefaultHttpRequest';
-import useHttpPayloadDefinition from '../../../../components/http/useHttpPayloadDefinition';
+import useDefaultHttpRequest from '../../../../../utils/http/useDefaultHttpRequest';
+import useHttpPayloadDefinition from '../../../../../utils/http/useHttpPayloadDefinition';
 
 /**
  * @typedef {object} ServerResponse

_dev/js/theme/core/cart/request/cart/deleteFromCartRequest.js

@@ -1,6 +1,6 @@
 import prestashop from 'prestashop';
-import useDefaultHttpRequest from '../../../../components/http/useDefaultHttpRequest';
-import useHttpPayloadDefinition from '../../../../components/http/useHttpPayloadDefinition';
+import useDefaultHttpRequest from '../../../../../utils/http/useDefaultHttpRequest';
+import useHttpPayloadDefinition from '../../../../../utils/http/useHttpPayloadDefinition';
 
 /**
  * @typedef {object} ServerResponse

_dev/js/theme/core/cart/request/cart/quantityChangeRequest.js

@@ -1,6 +1,6 @@
 import prestashop from 'prestashop';
-import useDefaultHttpRequest from '../../../../components/http/useDefaultHttpRequest';
-import useHttpPayloadDefinition from '../../../../components/http/useHttpPayloadDefinition';
+import useDefaultHttpRequest from '../../../../../utils/http/useDefaultHttpRequest';
+import useHttpPayloadDefinition from '../../../../../utils/http/useHttpPayloadDefinition';
 
 /**
  * @typedef {object} ServerResponse