@shopgate/pwa-common/providers/loading/index.js

Common library for the Shopgate Connect PWA.

import _inheritsLoose from "@babel/runtime/helpers/inheritsLoose";
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { UIEvents } from '@shopgate/pwa-core';
import LoadingContext from "./context";

/**
 * The LoadingProvider component.
 */
import { jsx as _jsx } from "react/jsx-runtime";
let LoadingProvider = /*#__PURE__*/function (_Component) {
  /**
   * @param {Object} props The component props.
   */
  function LoadingProvider(props) {
    var _this;
    _this = _Component.call(this, props) || this;
    /**
     * Adds or increases the loading counter for a path.
     * @param {string} path The path which loads.
     */
    _this.setLoading = path => {
      const {
        loading
      } = _this;
      const newLoading = {
        ...loading,
        [path]: loading[path] ? loading[path] + 1 : 1
      };

      // Immediately updates state due to multiple sets before actual rerender.
      _this.loading = newLoading;
      _this.setState({
        loading: newLoading
      });
    };
    /**
     * Resets the loading counter for a path.
     * @param {string} path The path which loads.
     */
    _this.resetLoading = path => {
      const {
        [path]: removedPath,
        ...remaining
      } = _this.loading;

      // Immediately updates state due to multiple sets before actual rerender.
      _this.loading = remaining;
      _this.setState({
        loading: remaining
      });
    };
    /**
     * Decreases the loading counter for a path.
     * @param {string} path The path which loads.
     */
    _this.unsetLoading = path => {
      const {
        loading
      } = _this;
      if (typeof loading[path] === 'undefined') {
        return;
      }
      if (loading[path] <= 1) {
        _this.resetLoading(path);
        return;
      }
      const newLoading = {
        ...loading,
        [path]: loading[path] - 1
      };

      // Immediately updates state due to multiple sets before actual rerender.
      _this.loading = newLoading;
      _this.setState({
        loading: newLoading
      });
    };
    /**
     * Checks if a path is loading.
     * @param {string} path The path it inspect.
     * @return {boolean}
     */
    _this.isLoading = path => {
      const {
        loading
      } = _this.state;
      return !!loading[path];
    };
    _this.loading = {};
    _this.contextValue = null;
    _this.state = {
      loading: {}
    };
    UIEvents.addListener(_this.constructor.SET, _this.setLoading);
    UIEvents.addListener(_this.constructor.RESET, _this.resetLoading);
    UIEvents.addListener(_this.constructor.UNSET, _this.unsetLoading);
    return _this;
  }

  /**
   * Removes the event listeners when the component unmounts.
   */
  _inheritsLoose(LoadingProvider, _Component);
  /**
   * Adds or increases the loading counter for a path.
   * @param {string} path The path which loads.
   */
  LoadingProvider.setLoading = function setLoading(path) {
    UIEvents.emit(LoadingProvider.SET, path);
  }

  /**
   * Resets the loading counter for a path.
   * @param {string} path The path which loads.
   */;
  LoadingProvider.resetLoading = function resetLoading(path) {
    UIEvents.emit(LoadingProvider.RESET, path);
  }

  /**
   * Decreases the loading counter for a path.
   * @param {string} path The path which loads.
   */;
  LoadingProvider.unsetLoading = function unsetLoading(path) {
    UIEvents.emit(LoadingProvider.UNSET, path);
  };
  var _proto = LoadingProvider.prototype;
  _proto.componentWillUnmount = function componentWillUnmount() {
    UIEvents.removeListener(this.constructor.SET, this.setLoading);
    UIEvents.removeListener(this.constructor.RESET, this.resetLoading);
    UIEvents.removeListener(this.constructor.UNSET, this.unsetLoading);
  };
  /**
   * @return {JSX}
   */
  _proto.render = function render() {
    const {
      loading
    } = this.state;
    const nextValue = {
      loading,
      setLoading: this.setLoading,
      unsetLoading: this.unsetLoading,
      isLoading: this.isLoading
    };
    if (!this.contextValue || this.contextValue.loading !== loading) {
      this.contextValue = nextValue;
    }
    return /*#__PURE__*/_jsx(LoadingContext.Provider, {
      value: this.contextValue,
      children: this.props.children
    });
  };
  return LoadingProvider;
}(Component);
LoadingProvider.SET = 'loading_set';
LoadingProvider.RESET = 'loading_reset';
LoadingProvider.UNSET = 'loading_unset';
export default LoadingProvider;